Слои-маски Macromedia Flash MX

Кроме вспомогательных опорных слоев и слоев траекторий в редакторе Flash очень часто применяются так называемые слои-маски, с помощью которых можно создавать очень интересные эффекты. Применение масок подразумевает наличие как минимума двух слоев, а именно маскируемого слоя, в котором может находиться максируемый объект и слоя маски. Что же такое маска? Маска используется для сокрытия определенной части изображения, расположенного в нижележащем слое.
Графика, находящаяся в слое маске не просматривается в опубликованном ролике, но она выполняет роль отверствия или окна, через которое видно то, что нарисовано в прикрепленных маскируемых слоях. Если применить к слою-маске или к маскируемому слою анимацию, то можно получить множество замечательных эффектов. Прежде всего вы должны знать какие объекты должны быть использованы в качестве масок. Это простые формы, т.е. заливки, статический текст и графические символы размещенный в одном слое и содержащие простые формы.
Линии или контуры, градиентные или растровые заливки, а также динамический текст не могут быть масками. В принципе в качестве масок можно применять и мувиклипы, но в этом случае есть большое но. Так Flash использует в качестве маскирующего элемента, только первый кадр нижнего слоя клипа. Поэтому в общем случае мувиклипы не являются лучшим выбором для создания масок. Зато они прекрасно подходят в качестве маскируемых элементов. а теперь перейдем к практическим примерам. Создадим эффект прожектора - это классический пример, котрый демонстрирует, когда хотят познакомит с маскированием. Импортируем в проект подходящее изображение, выполнив команду File
Import. Выберем нужный файл и щелкнем по
кнопке Открыть. При необходимости с помощью панели Align
разместим рисунок в центре полотна.
Нажмем клавишу F8
и конвертируем его в графический символ или в мувиклип. Эту операцию мы сделали для того, чтобы в последующем применить к изображению цветовые эффекты. Теперь нам нужно создать слой маску. К сожалению разработчики программы не предусмотрели для этого специальной кнопки под списком слоев. Поэтому мы сначала создадим обычный слой
и дадим ему имя
Mask. Далее дважды щелкнув по пиктограмме слоя или через контекстное меню
откроем окно его свойств. Здесь установим тип Mask
и щелкнем по кнопке ОК. Обратите внимание как изменилась пиктограмма слоя.
Сделать из слоя - маску можно и быстрее, установив в контекстном меню флажок на пункте Mask.
Далее необходимо прикрепить нижний слой к слою маске, т.е. сделать его маскируемым. Это можно реализовать двумя путями. Щелкнем правой кнопкой мыши по слою и откроем окно его свойств. Если установить сейчас тип Masked,
то слой станет маскируемым, но мы пока этого делать не будем, поэтому щелкнем по кнопке Cancel - Отмена. И покажем более быстрый способ прикрепления слоя к маске. Просто перетащим нижний слой под слой маску.
Пиктограмма слоя изменится и он станет маскируемым.
Заблокируем нижний слой и перейдем в слой маску.
Затем с помощью иснтрумента Овал нарисуем круг. Цвет заливки круга значения не имеет. Инструментом Arrow выделим
и удалим контур фигуры,
поскольку линии в масках не используются. Если сейчас протестировать ролик, то на экране мы увидим только часть изображения нижнего слоя, которое находится под маской. Закроем тест. Кстати говоря принцип дефствия маски можно посмотреть и на основной сцене, для этого нужно заблокировать оба слоя.
Снова разблокируем слой маски и создадим анимацию движения. Выделим круг,
нажмем клавишу F8 и конвертируем фигуру в графический символ. Перетащим экземпляр символа за левую часть полотна,
затем выдели 15 позицию слоя
и клавишей F6 скопируем туда первый ключевой кадр.
В этом кадре переместим объект вправо за пределы сцены.
Используя клавишу F5 увеличим длительность нижнего слоя также до 15 кадров.
Щелкнем правой кнопкой мыши на первом кадре слоя Маски
и назначим анимацию движения. Теперь протестируем фильм. Мы получили достаточно инстересный эффект,
но это еще не эффект прожектора. Закроем тестовое окно и добавим к фильму небольшое усложнение. Создадим новый обычный слой
и перетащим его вниз пакета слоев.
Убедимся, что новый слой не является маскируемым.
Сделаем невидимыми два верхних слоя,
клавишей F11 откроем окно Библиотеки
и поместим
еще один экземпляр символа изображения на сцену. Используя панель Выравнивание отцентрируем объект.
Не снимая выделения в списке цветовых эффектов панели Properties установи пункт яркость и установим ее значение - 60%.
Протестируем созданную анимацию еще раз. Теперь получился эффект настоящего прожектора. Закроем тестовое окно и приведем еще один пример, где с помощью маски попробуем создать анимацию вращающегося глобуса, которую часто можно увидеть на WEB-страницах Internet. Создадим новый проект
и отмасштабируем рабочую область.
На этот раз маску сделаем статичной, а анимировать будем маскируемое изображение. Импортируем из файла или вставим из буфера обмена рисунок карты в виде прямоугольной области. Нажмем клавишу F8 и конвертируем рисунок в символ, что необходимо для создания анимации движения. Щелкнем дважды на названии нового слоя и дадим ему имя Map -карта. Теперь создадим новый слой, который в дальнейшем будем использовать в качестве маски. Выберем инструмент Овал, сбросим цвет контура и нарисуем круг любого цвета диаметром чуть меньшем ширины нашей карты. Выделим его инструментом Arrow
и разместим относительно карты в какой-нибудь характерной точке. Например, так, чтобы левый край фигуры касался крайней правой точки Африки на карте. Перейдем в слой карты, выделим 18 позицию слоя и создадим клавишей F6 ключевой кадр. Чтобы выровнять слои по длительности, отметим 18 позицию верхнего слоя
и нажмем клавишу F5. Опять перейдем в 18 кадр нижнего слоя и спомощью клавиатуры сместим карту влево настолько, чтобы Африка оказалась снова у левого края круга.
Этим мы добъемся того, что в первом и последнем кадрах анимации, под маской будет одинаковое изображение. Перейдем в первый кадр нижнего слоя и с помощью контекстного меню, назначим анимацию движения. Щелкнем правой кнопкой мыши по верхнему слою и в контекстном меню установим тип
Mask. Теперь протестируем ролик, нажав CTRL+Enter. Анимация происходит но выглядит абсолютно плоской и мало похожа на глобус. Закроем тестовое окно и попробуем устранить отмеченный недостаток. Придадим нашей фигуре объемный вид. При активном слое Маске создадим новый обычный слой.
Присвоим ему имя Shade - Тень. Здесь изобразим круг с полупрозрачной заливкой, которая будет выполнять роль тени. Чтобы не рисоват фигуру заново и совмещать ее с маской, поступим следующим образом. Снимем блокировку со слоя Маски,
выделим круг, скопируем его в буфер обмена,
перейдем в верхний слой и вставим из буфера копию фигуры командой Edit-Paste in Place
Вставить на место. Снова заблокируем слой маски, чтобы случайно его не изменить. Зделаем также нижние слои временно невидимыми и поработем с фигурой в верхнем слое. Теперь нам нужно залить круг полупрозрачной градиентной заливкой. Выберем инструмент Paint Bucket
и с помощью панели
Mixer настроим нужную заливку. Установим на панели радиальную градиентную заливку, щелкнем по левому маркеру
и введем непрозрачность цвета 0%. Добавим еще один маркер, щелкнув под линейкой перехода цвета. Выберем черный цвет,
а непрозрачность установим равной 60%. Для третьего маркера также назначим черный цвет и сделаем непрозрачность равной 90%.
Щелкнем инструментом заливка, где-нибудь левее и выше центра круга.
Фигура будет залита круговым полупрозрачным градиентом. Включим видимость всех слоев и заблокируем их, щелкнув по пиктограмме замка. Осталось только протестировать ролик, если сделать анимацию более плавной, т.е. увеличить скорость воспроизведения, то она будет неплохо смотреться на какой-нибудь WEB-страничке. А сейчас сделаем перерыв.

ЛЕКТРОННАЯ ШКОЛА MACROMEDIA FLASH MX
II курс: Основы создания анимации в Macromedia Flash MX
Модуль IV: Слой-маска, Анимированная маска, Редактирование анимации

http://www.iralebedeva.ru/informdm2_4.html

Экспресс-план модуля:

§ Слой-маска

§ Анимированные маски

§ Анимированная маска. Расчётная анимация типа Shape

§ Анимированная маска. Расчётная анимация типа Motion

§ Анимированная маска. Использование символа типа Movie Clip для создания маски двигающейся по заданной траектории

§ Редактирование анимации.