Flash Catalyst CS5 Timeline

• May 8, 2024

Если вы похожи на меня, веселье начинается, когда вы добавляете взаимодействие в свое приложение. В последней вспышке^р катализатор^TM В обзорной статье CS5 мы обсудили страницы / состояния для нашего веб-приложения и сказали Catalyst запрограммировать наши кнопки для перехода с одной страницы нашего веб-сайта на другую.

Давайте продолжим с нашим примером веб-сайта, который имеет только три страницы: CityView, UnionParkView и CentralParkView. Мы немного поработали над навигацией, когда запрограммировали наши кнопки для отображения этих страниц. Мы создали следующие кнопки:

Кнопка 1 отобразит страницу UnionParkView
Кнопка 2 отобразит страницу CentralParkView
Кнопка 3 отобразит страницу CityView

Catalyst отслеживает отношения между этими страницами / состояниями на временной шкале, и мы можем использовать временную шкалу Catalyst в качестве визуального руководства для навигации по нашему веб-приложению.

Если вы использовали Flash, вы знакомы с временной шкалой, которая состоит из последовательности кадров. Однако временная шкала Catalyst состоит из страниц / состояний нашего приложения и переходов между этими страницами / состояниями. Давайте взглянем.

Хронология Catalyst состоит из четырех столбцов. Крайний левый список страниц / государств. На основе кнопок и страниц / состояний нашего проекта Catalyst отобразит взаимосвязь между страницами нашего веб-сайта в этом столбце. Как видите, мы можем перемещаться между страницами четырьмя способами. Каждый из них размещается на слое на временной шкале.

Начиная здесь
Вид на город
Вид на город
UnionParkView
CentralParkView

Заканчивается здесь
UnionParkView
CentralParkView
Вид на город
Вид на город

Во втором столбце временной шкалы отображается начальное состояние. Когда мы нажимаем на каждый слой на временной шкале, Catalyst отобразит активную страницу (страницу, которую мы сейчас просматриваем) в верхней части этого второго столбца. Например, в первом слое мы переходим со страницы CityView на страницу UnionParkView. Поэтому CityView указывается в качестве исходного состояния. Но в нижнем слое мы переходим от CentralParkView к CityView, и страница CentralParkView будет отображаться в этом столбце.

В третьем столбце отображаются соответствующие переходы, необходимые для перехода с одной страницы на другую. Здесь мы видим, что Catalyst определил по нашим кнопкам, что мы будем перемещаться между страницами, и уже поместил для нас переход «перемещение» в этом столбце. Поскольку мы продолжаем работать над нашим приложением и добавляем больше элементов и эффектов, Catalyst автоматически добавит правильный переход на временную шкалу.

Четвертый столбец отображает конечное состояние. Опять же, нажимая на каждый слой на временной шкале, мы видим целевую страницу (страницу, на которую мы перемещаемся), перечисленные в последнем столбце. Теперь, когда мы понимаем связь временной шкалы с нашим приложением, мы готовы добавить несколько профессионально выглядящих анимаций на наш сайт.

* Adobe предоставила мне обзорную копию бесплатно.

Copyright 2018 Adobe Systems Incorporated. Все права защищены. Снимки экрана продукта Adobe перепечатаны с разрешения Adobe Systems Incorporated. Adobe, Photoshop, альбом Photoshop, элементы Photoshop, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, фейерверки, содействие, увлечение, Flash Catalyst и Flash Paper является или является [a] зарегистрированным товарным знаком (-ами) или товарным знаком (-ами) Adobe Systems Incorporated в США и / или других странах.

Видео инструкция: InfiniteSkills Tutorial | Flash Catalyst CS5.5 | Using The Timeline (May 2024).