Macromedia Flash в действии. Слои

Macromedia Flash в действии. Слои

Здравствуй, Паша. Мне понравилась твоя статья, и я решил заняться флэшем и купил его. Но у меня он почему-то не запускается, хотя свою флэшку я очень тщательно подключаю к компьютеру, и даже Windows XP пишет, что обнаружено новое устройство...
(из письма на мой адрес:))

Смех смехом, а меня даже совесть мучает теперь. Причем вперемешку с завистью, что производители флэш-памяти совершенно не платят мне за явно успешную рекламу их продукции:). Однако пора переходить ближе к теме. В отношении слоев и работы с ними Flash очень даже смахивает на старый добрый "Фотошоп", "Автокад" и еще целую кучу графических редакторов подобного рода, однако Macromedia решила слегка расширить их функциональные возможности, на которых мы сейчас и остановимся. Поехали.

1. Что это такое, и с чем его едят
Слой (Layer) — это небольшая часть сцены фильма, способная содержать любое число графических объектов. Преимущества использования слоев проявляются прежде всего при создании многоплановых сцен, поскольку объект на более высоко расположенном слое в ролике всегда будет перекрывать остальные объекты. На применении этой особенности мы остановимся несколько позже, а пока полюбуйтесь на окошко, с которым нам придется сегодня немного поработать:
Для создания нового слоя достаточно выбрать пункт меню Insert — Layer или кликнуть в приведенном рисунке на пиктограмму белого листочка с синим крестиком слева от него. Соответственно для удаления слоя нужно выделить его и кликнуть на изображение мусорного бачка, имеющего в нашей стране названия, которые я не буду приводить из эстетических соображений. Для работы также понадобятся пиктограммы глаза, замочка и прямоугольника в верхней части окна работы со слоями. Кликнув по изображению глаза, мы скрываем все содержимое всех слоев на экране редактирования (чтобы скрыть только один слой, нужно кликнуть на точку, расположенную на линии этой пиктограммы). Следует помнить, что объекты на скрытом слое не будут видны только в режиме редактирования, т.е. в запущенном фильме они будут присутствовать, как будто никто их и не трогал. Замочек запрещает редактирование объектов, расположенных на запираемом слое. Пример использования этой особенности следующий: предположим, что у вас есть фон из заливки и любая фигура на другом слое. Так вот, для того, чтобы не трогать эту многострадальную заливку при каждой попытке выделения фигуры, гораздо выгоднее ее залочить. Пиктограмма прямоугольника, или Контурность, как ее еще называют, нужна для показа области действия слоя, когда все контуры объектов слоя показываются соответствующим цветом. В своих работах я использовал этот прямоугольник ровно 1 раз (чтобы вспомнить, зачем он нужен, при написании этой статьи:)). Для работы со слоями каждый пользователь, несомненно, хотел бы видеть свои названия, а не непонятные Layer1, Layer2 и т.д. Для изменения имени слоя просто дважды кликните по названию любого их них и обзывайте на здоровье. Это основное, что нужно знать при работе со слоями, а теперь остановимся на некоторых нестандартных финтах ушами великой Macromedia…

2. Многоплановые (извиняюсь за матерное слово:)) сцены
Предугадывая вопросы по этому словосочетанию, я решил расписать его несколько подробнее. Объяснять буду на примере поверхности с объектами, по которой будет двигаться какой-нибудь шарик. Создаем следующую картинку:
Особенность ее будет заключаться в том, что каждый объект должен быть расположен на своем собственном слое. Т.е. окно слоев должно выглядеть так, как показано на рисунке.
Особенно следует заострить внимание на том, что объект Шарик находится в окне слоев между двумя другими объектами (которые так и называются: Объект1 и Объект2). Как это скажется на самом анимационном клипе, мы сможем увидеть, заставив шарик прокатиться по столу и обратно. Выделяем шарик (заблокировав слой со столом, чтобы не мешал), преобразуем его в анимационный клип (F8 — Movie Clip) и, дважды кликая на нем, попадаем в его линейку времени. Выбираем пункт меню Insert — Create Motion Tween, затем создаем ключевыми 30-й и 60-й кадры. В 30-м кадре просто перетягиваем шарик по горизонтали на край стола и запускаем клип на выполнение (Ctrl+Enter). Поняли, что к чему? Шарик при движении находится впереди объекта 1, поскольку слой шарика выше уровнем. Почему он находится позади объекта 2, вы, я думаю, сами уже догадались. Поэкспериментируйте, просто перетягивая слой с шариком с уровня на уровень и запуская клип на исполнение. Анимации при этом менять совершенно не нужно.

3. Всегда быть в маске — судьба моя…
А маска-то тут причем, спросите вы и будете, несомненно, удивлены, узнав про существование слоя-маски. Маска на нем не потому, что он такой страшный, что пользователь грохнется с табуретки, просто взглянув на этот кошмар, а потому, что с помощью этой штуки очень легко можно реализовать эффект отверстия, под которым будет просвечиваться содержимое слоя, расположенного уровнем ниже. А вот и наш слой-маска в действии:
Для создания этого эффекта используется 2 слоя: первый (Исходное изображение) содержит фоновый рисунок, загрузить который можно используя File — Import, второй (маска) содержит мазню кисточкой, сгенерированную моим больным воображением совершенно случайным образом. Все, что нужно теперь сделать — указать программе, что второй слой будет маской для первого. Для этого достаточно кликнуть по второму слою мышкой и в контекстном меню выбрать Mask. Запускаем, наслаждаемся.
Маска может быть основана на различных типах объектов слоя (заливка, текст, клип, графический объект) и, как и прочие объекты, с легкостью подвергается анимации. Попробуем реализовать эту особенность с использованием слой-маски, содержащей текст. Итак, прежде всего создайте слой с фоновым изображением. Неважно, какая там будет картинка, главное — чтобы она была как можно более пестрой. Создаем новый слой и помещаем на нем надпись. Теперь преобразуем надпись в анимационный клип и зададим для нее любую анимацию. Выделяем слой с надписью, кликаем правой кнопкой мыши, выбираем Mask, запускаем, наслаждаемся:).

4. Верной дорогой идете, товарищи…
А в этом пункте будет рассмотрен еще один слой, который будет называться Ведущий (но не популярной передачи:)). Это особый слой для создания траектории движения объекта. Во всех предыдущих примерах мы заметили, что анимированный объект так или иначе движется по линейной траектории, что существенно связывает дизайнеру руки. Именно эту проблему и призван решить Guide Layer aka ведущий слой. Создаем новый проект и рисуем любой объект. Затем выбираем в меню Insert — Motion Guide. Вы увидите, что в окне редактирования слоев появится совершенно новый слой с изображением движущегося по траектории квадратика. Выделите этот слой, возьмите карандаш (только не с полки возле компьютера, а выберите этот инструмент) и нарисуйте какую-нибудь загогулину. Затем в этом же слое перейдите на 30-й кадр (ну, или на любой другой) и создайте там ключевой кадр. Выделите слой с объектом, выберите Insert — Create Motion Tween и создайте ключевой кадр тоже на 30-м кадре. Картинка в Timelin'е должна быть такой же, как на картинке. Там явно виден ведущий слой и две линии на линейке. Выделите первый кадр первого слоя (который с объектом), затем совместите центр объекта с началом нарисованной на втором слое линии, а в 30-м кадре первого слоя совместите центр объекта с концом нарисованной линии, чтобы получилось что-то похожее:
При включенной привязке (а включить ее можно в свойствах объекта Стрелка) программа сама притянет шарик к траектории. Все, что остается сделать вам — запустить клип на выполнение и убедиться в том, что шарик движется по заданной вами линии. Как и в случае с маской, данный эффект можно проделывать не только с обычными графическими символами, но и с анимационными клипами, текстами и другими объектами, с которыми работает Macromedia Flash. На этом со слоями закончим. Пишите, о чем бы вы хотели узнать в последующих статьях, и, вполне возможно, вы увидите реализацию своих заявок в очередном номере КГ.

Паша Либер aka Fireangel,
Fireangel@tut.by