Методические указания по выполнению практической работы № 17
Пример использования слоев
Попробуем создать плывущие облака на фоне заката.
1. Вначале создадим новый ролик (CTRL+N).
2. Переименуем его единственный пока слой, назвав его Фон.
3. Создадим в нем прямоугольник, по размерам чуть превышающий размеры области ролика.
4. Выберем инструмент Заливка, затем в панели Fill (Заполнение) создадим линейный градиент, состоящий из перехода темно-синего цвета в светло-голубой и далее в красноватый. Зальем этим градиентом наш фон и повернем его с помощью кнопки Transform Fill (Преобразование заливки) так» чтобы цвета шли почти горизонтально, но все же под некоторым углом. Это и будет наше закатное небо. (Можно добавить к нему еще «заходящее солнце», хотя лучше это делать в отдельном слое.)
5. Теперь щелкнем на кнопке Insert Layer (Вставить слой). Сверху от слоя Фон появится новый слой с именем Layer 2. Переименуем его в Облака.
6. Теперь сделаем на некоторое время слой Фон невидимым и создадим изображение облака. Можно, например, взять Перо, создать неправильный многоугольник, а затем искривить каждую его сторону. Теперь можно залить получившийся контур линейным градиентом светло-голубых оттенков, а сам контур выделить двойным щелчком мыши и удалить. Сдвинем получившееся изображение влево за границу рабочей области ролика.
7. Теперь выделим позицию 60 на шкале времени в этом слое и создадим в ней ключевой кадр (клавиша F6). Сдвинем наше «облако» на правый край за границу рабочей области. Немного изменим расположение градиента в «облаке» и искривим его границу, чтобы облако при движении немного меняло форму и освещенность. Можно также немного изменить его размер, пользуясь кнопкой Scale (Масштабирование). Перейдем снова в первый кадр и создадим морфинг, выбрав пункт Shape (Формат в раскрывающемся списке Tweening (Тип анимации).
8. Теперь снова сделаем слой Фон видимым. Чтобы завершить создание ролика, необходимо еще выровнять длину (продолжительность) обоих слоев. Сейчас у нас в слое Облака 60 кадров, а в слое Фон - только один (соответственно, во втором кадре фон уже не будет виден). Поэтому выделим на шкале времени позицию 60 в слое Фон и нажмем клавишу F5, чтобы создать серию обычных кадров. Теперь можно просмотреть наш ролик. Вы увидите нечто похожее на облака, проплывающие на фоне закатного неба.
Направляющие слои
Самая простая разновидность специальных слоев в программе Flash — это так называемые направляющие слои (guide layers). Единственное их предназначение — помочь при рисовании разных объектов и размещении флэш-символов.
При выборе инструмента Стрелка на панели инструментов в разделе Options (Параметры) появляется кнопка, включают режим «магнита»: Snap to Objects (Привязка к объектам). Этот же режим можно включить (или выключить) клавиатурной комбинацией CTRL+SHIFT+/. В обычных ситуациях в этом режиме перемещаемые или создаваемые объект притягиваются к другим объектам.
Если создать направляющий слой и нарисовать в нем какой-либо контур, остальные объекты будут к нему притягиваться, однако сам этот контур (содержимое направляющего слоя) в готовом ролике не отображается.
Например, если требуется расположить множество объектов неравномерно на линии одной окружности, можно создать направляющий слой, нарисовать в нем окружность, а затем, перейдя в обычный слой, перемещать объекты так, чтобы они притянулись к окружности (рис. 3.20 слева). При просмотре готового ролика сама окружность не видна (рис. 3.20 справа).
Чтобы создать направляющий слой, достаточно нажать кнопку Insert Layer ( Вставить слой), затем нажать правую кнопку мыши на вновь созданном слое и в контекстном меню выбрать пункт Guide (Направляющая).
При изменении порядка слоев следует учитывать, что если разместить обычный слой непосредственно под направляющим, то направляющий слой автоматически конвертируется в слой траектории (motion-guide layer). Чтобы избежать случайного конвертирования слоев, в документации по программе Flash рекомендуется располагать все направляющие слои в самом низу списка слоев.
Слои траекторий
Слои траекторий — очень мощное средство создания анимации в программе Flash. Технология Flash позволяет задавать траектории движения объектов графически, просто «рисуя» их на экране. Давайте посмотрим, как это делается.
Как вы, вероятно, помните, при создании анимации движения мы указывали начальное и конечное положение объекта. Программа рассчитывает анимацию, исходя из того, что объект будет передвигаться из начальной точки в конечную по кратчайшему пути.
Однако есть способ заставить этот объект двигаться по любой другой траектории. Для этого следует создать слой траектории (motion-guide layer) и нарисовать в нем желаемую траекторию движения. Траектория должна быть незамкнутой и представлять собой контур или заливку. Рекомендуется использовать именно контур, поскольку заливка может быть любой формы, и иногда программа выдает непредсказуемый результат.
В первом и заключительном ключевых кадрах анимации следует притянуть Движущийся объект к концам траектории. Строго говоря, не обязательно привязывать объект именно к концам траектории, но нет смысла рисовать траекторию так, чтобы использовать ее не полностью. При этом режим Snap to Objects (Привязка к объектам) должен быть включен. Напомним, что для его включения и выключения можно использовать сочетание клавиш CTRL+SHIFT+/.
Слой, в котором расположена анимация
(движущийся объект), должен быть «привязан»
к слою траектории. Такой слой называют ведомым
(guided). К одному слою траектории можно
одновременно привязать несколько ведомых слоев.
Ведомые слои можно привязывать и освобождать, просто перемещая их в списке слоев на шкале времени. На вис. 3.25 показано, как обозначаются слои траекторий и ведомые слои. Слой траектории всегда должен иметь хотя бы один ведомый слой, иначе он преобразуется в направляющий слой.
Для того чтобы добавить слой траектории, выделите будущий ведомый слой и нажмите кнопку Add Guide Layer (Добавить слой траектории), расположенную под списком слоев на шкале времени. При этом текущий слой автоматически становится ведомым.
Применение траектории
Давайте рассмотрим простой пример. Предположим, у нас есть растровое изображение и рисованный шарик, который нам нужно заставить скакать по дороге.
1. Создадим новый ролик.
2. Импортируем растровое изображение и назовем слой с фотографией Photo.
3. Добавим новый слой, назовем его Ball.
4. В слое Ball нарисуем шарик, сгруппируем его (Ctrl+G).
5. В слое Ball создадим ключевой кадр в позиции 150, переместим изображение шарика вправо и вниз, а затем уменьшим его, что шарик постепенно удалялся от нас.
6. Вернемся в первый ключевой кадр и создадим анимацию движения. Убедимся что выделен слой Ball, и нажмем кнопку Add Guide Layer (Добавить слой траектории)
7. Повесим «замочки» на слои Ball и Photo и нарисуем в слое траектории ломаную линию, соответствующую скачкам шарика.
8. Повесим «замочек» на слой траектории и снимем его со слоя Ball.
9. Убедимся в том, что включен режим Snap to Objects (Привязка к объектам).
10. Переместим шарик на начало траектории. Затем перейдем в последний кадр и переместим шарик точно на конец траектории. Теперь можно нажать клавиши CTRL+ENTER, и мы увидим шарик, прыгающий по дороге, изображенной на фотографии.
Управление ориентацией объекта
Теперь давайте рассмотрим другой пример. Мы должны изобразить самолетик, летящий по произвольной кривой.
1. Создадим новый ролик.
2. Схематично изобразим самолетик. Сгруппируем его.
3. Создадим ключевой кадр в позиции 50 (F6) и передвинем наш самолетик вправо и вверх за границу рабочей области.
4. Вернемся в первый кадр и создадим анимацию движения. Если сейчас просмотреть ролик, мы увидим самолетик, плавно поднимающийся по диагонали.
5. Нажмем кнопку Add Guide Layer (Добавить слой траектории). На вновь созданном слое нарисуем траекторию движения самолетика.
6. Перейдем в слой с самолетиком и притянем его изображение к началу и концу траектории (в первом и последнем кадрах анимации соответственно). В последнем кадре немного повернем его, чтобы он смотрел параллельно траектории.
7. Просмотрим анимацию (Ctrl+Enter). Наш самолетик летит все время направив нос вправо, что совершенно неестественно.
8. Чтобы он все время поворачивался носом параллельно траектории, на панели Properties отметьте галочкой пункт Orient to path (Ориентировать по траектории).
9. Если теперь просмотреть анимацию, самолетик будет двигаться «правильно», справа).
Кстати, при движении по траекториям никто не запрещает использовать вращение объектов. Таким образом, комбинируя различные свойства анимации, можно получить весьма интересные эффекты.
Слои-маски
Анимация маски
1. Создайте новый ролик.
2. Разместите по центру надпись крупными буквами «Добро пожаловать!». Слой переименуйте как Надпись.
3. Вставьте новый слой, затем нажмите правую кнопку мыши на вновь созданном слое и в контекстном меню выберите пункт Mask (Маска). При этом слой, находящийся непосредственно под слоем-маской, преобразуется в маскированный. Символ и название маскированного слоя несколько сдвинуты вправо относительно «нормального» положения.
4. Слой-маску назовите Маска.
5. Нарисуйте в нем прямоугольник шириной в две-три буквы надписи. Удалите его контур, оставив только заливку.
6. Передвиньте этот прямоугольник влево за границу рабочей области (или, по крайней мере, за границу текстового блока). Выделите прямоугольник и нажмите клавиши CTRL+G.
7. Отметьте на шкале времени позицию 40 в слое Маска и нажмите клавишу F6, чтобы создать там новый ключевой кадр. Сдвиньте в нем прямоугольник вправо за границу рабочей области (или текстового блока).
8. Вернитесь в первый кадр и создайте анимацию движения. Затем отметьте позицию 40 в слое Надпись и нажмите клавишу F5, чтобы выровнять длину слоев. Нажмите клавиши CTRL+ENTER и просмотрите получившийся ролик. Надпись возникает на экране как бы по частям.
9. Теперь удалите ключевой кадр из позиции 40 слоя Маска, снова скопируйте его из первого клавишей F6, выделите прямоугольник, нажмите кнопку Scale (Масштабирование) и расширьте прямоугольник по горизонтали так, чтобы он покрыл всю надпись.
10. Если теперь нажать клавиши CTRL+ENTER и просмотреть ролик, можно увидеть, как надпись постепенно появляется слева, на манер рекламных вывесок.
В слоях-масках можно применять все приемы, доступные в обычных слоях. Например, хорошие результаты можно получить при морфинге маски. Можно применять и метки морфинга.
