11.1. Macromedia DreamWeaver MX. Анимация.Часть1.
Как уже говорилось в прошлой части, анимация применима лишь к слоям, ну еще к графике - но принцип графической анимации несколько иной. Что же представляет из себя анимация? - если вы внимательно читали прошлую часть, то помните, что любой слой задается при помощи нескольких параметров, таких как: координаты расположения на странице, размеры (ширина и высота), z-индекс, а так же видимость слоя на странице (или скрытость). Так вот, любой из этих параметров может меняться (принимать новые значения) на протяжении заданного интервала времени. Причем изменение этих параметров не инициируется пользователем, а является ответом на какое-то событие.
Итак, приступим. Для начала следует дать команду Window - Others - TimeLines для отображения панели временной диаграммы (Рис. 11.01)
Рис. 11.01
После того как флажок установлен, в нижней части редактора будет отображена панель TimeLines (Рис. 11.02)
Рис. 11.02
Теперь нужно создать любой слой, для примера я создам простой слой с текстовой надписью, который и буду впоследствии анимировать (Рис. 11.03)
Рис. 11.03
Не забывайте сами давать слоям уникальные имена. Когда слой создан, его нужно добавить на временную диаграмму. Для этого следует выделить его и мышкой "бросить" на временную диаграмму. После чего появится следующее окошко, в котором вам будет напомнено, что при помощи этой панели вы сможете менять координаты расположения слоя на странице, размеры (ширина и высота), z-индекс, а так же видимость слоя в определенный момент времени. (Рис. 11.04)
Рис. 11.04
Нажмите кнопку "ОК" и переходите непосредственно на саму панель TimeLines, где вы можете увидеть добавленный вам слой в виде отрезка (Рис. 11.05)
Рис. 11.05
Теперь давайте научим наш слой перемещаться по странице, для начала растяните анимацию на 400 кадров по горизонтали. На приведенном скриншоте анимация растянута только на 15 кадров, вам же нужно нажать левой кнопкой мышки на точку, которая сейчас находится на 15 кадре, и не отпуская кнопку мыши тащить точку на 400. Когда удлините отрезок, то перейдите на 100 кадр, кликните по отрезку правой кнопкой мышки (Рис. 11.06)
Рис. 11.06
и из контекстного меню выберите пункт Add KeyFrame. После этих манипуляций на временной диаграмме появится еще одна ключевая точка (Рис. 11.07)
Рис. 11.07
Далее выделите ее мышкой, затем на самой странице, при помощи той же самой мышки, переместите слой, который вы собираетесь анимировать, в любое место страницы (как перемещать слои я писал в прошлой части). Когда слой перемещен вы можете увидеть, что начальная и конечна точки соеденены отрезком (Рис. 11.08)
Рис. 11.08
Далее снова перейдите на временную диаграмму на 200 кадр, добавьте Add KeyFrame и тащите слой в другое место.. в общем вам нужно установить ключевые точки на диаграмме и указать где в это время должен находится анимированный слой. В результате у вас получится примерно следующая картина (Рис. 11.09)
Рис. 11.09
Вот такая вот траектория движения получилось, так же не забывайте, что кроме координат размещения слоя, в каждой ключевой точке вам доступны и другие параметры для изменения (какие это параметры писалось в этой же части и повторяться я не буду), изменять параметры вы можете через панель Properties.
|
