Глава 9
Использование фильтров и наложений
До сих пор мы изучали возможности, перекочевавшие во Flash 8 из предыдущих версий этой программы. Многие из них появились еще в самой первой версии Flash, вышедшей во второй половине 90-х годов прошлого века. Это, в основном, ключевые возможности Flash, касающиеся рисования и правки графики, простых трансформаций, управления цветом, слоями и пр.
А теперь мы познакомимся с двумя нововведениями, появившимися только во Flash 8. Это фильтры и наложения, позволяющие быстро создавать эффекты наподобие тени, размытия, сложения цветов и др. Пользователям замечательного пакета растровой Web-графики Macromedia Fireworks все это должно быть уже знакомо.
Начнем мы с фильтров, как более простых и эффектных нововведений Flash 8.
Фильтры
Фильтры Flash 8 позволяют применить к фрагменту изображения такие эффекты, как отбрасывание тени, "выдавливание", иллюзию тления и пр. Сейчас мы рассмотрим, как все это делается.
Сразу же нужно сказать вот что. Фильтры могут быть применены не ко всем фрагментам графики, а только кнопкам, клипам (экземплярам образцов-клипов) и текстовым блокам. Так что если мы хотим применить какой-то фильтр к обычному примитиву, придется преобразовать его в экземпляр образца-клипа. Как это делается, было описано в главе 8.
Создание фильтров
Для создания фильтров нам понадобится "универсальная" панель Properties. Только в этом случае нам понадобится переключиться на вкладку Filters этой панели (рис. 9.1). Также можно включить пункт-переключатель Filters подменю Properties меню Window.
В левой части панели Properties после переключения на вкладку Filters появится большой список, в котором будут перечислены все созданные нами к данному моменту фильтры. (На рис. 9.1 этот список пуст.) Над этим списком будут находиться кнопки Add filter (со знаком "плюс") и Remove filter (со знаком "минус"), выполняющие создание нового и удаление выделенного в списке фильтра соответственно.
Итак, чтобы создать новый фильтр, нам будет нужно выделить на рабочем листе нужный нам фрагмент изображения (кнопку, клип или текстовый блок) и нажать кнопку Add filter. После этого на экране появится меню, показанное на рис. 9.2. В этом меню перечислены пункты, соответствующие доступным фильтрам, а также выполняющие различные вспомогательные операции. Пункты, создающие фильтры Flash, находятся в нижней части этого меню.
Фильтр будет создан сразу же после выбора соответствующего пункта меню кнопки Add filter. В списке фильтров появится и будет выбран пункт, носящий название этого фильтра. А справа от списка фильтров появятся элементы управления, с помощью которым мы сможем задать его параметры.
Мы можем создавать для выделенного фрагмента изображения несколько фильтров. При этом они будут применяться в том порядке, в котором перечислены в списке фильтров.
Фильтры, поставляемые в составе Flash
А теперь давайте подробно рассмотрим все фильтры, поставляемые в комплекте Flash, и все их параметры.
Отображение тени (Drop Shadow)
Фильтр, позволяющий создать тень для выделенного фрагмента изображения, создается выбором пункта Drop Shadow меню кнопки Add filter. Результат его применения показан на рис. 9.3.
Если выбрать в списке фильтров панели Properties пункт Drop Shadow, соответствующий этому фильтру, правее этого списка появятся элементы управления для настройки его параметров. Эти элементы управления показаны на рис. 9.4.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры тени в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции тени.
Поле ввода с регулятором Strength позволяет задать степень насыщенности тени в процентах.
Раскрывающийся список Quality задает качество отрисовки тени. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Здесь нужно помнить, что чем выше качество отрисовки тени, тем больше времени отнимает вывод изображения на экран. Разработчики вообще рекомендуют оставлять выбранным пункт Low (Низкое качество), если, конечно, не стоит задача получить изображение максимального качества.
Селектор цвета Color служит для задания цвета тени.
Поле ввода с регулятором Angle задает угол "падения" тени в градусах. Это поле ввода с регулятором несколько отличается от уже рассмотренных нами полей тем, что имеет круговой регулятор (поле ввода с круговым регулятором; рис. 9.5).
Видно, что это поле ввода имеет регулятор в виде круговой шкалы. Чтобы им воспользоваться, нужно сначала открыть его щелчком мышью по кнопке, расположенной правее поля ввода. Далее ставим курсор мыши на любую точку шкалы этого регулятора, нажимаем кнопку мыши и, не отпуская ее, буксируем мышь по вертикали, вверх или вниз. При буксировке мыши мы можем заметить, что небольшой, имеющий вид точки указатель движется по шкале регулятора. Задав нужное значение (его можно видеть в поле ввода), мы отпустим кнопку мыши, и регулятор пропадет с экрана.
Поле ввода с регулятором Distance позволяет задать расстояние между фрагментом изображения и тенью. Здесь можно вводить как положительные, так и отрицательные значения.
Флажок Knockout при включении "заливает" фрагмент изображения, к которому применяется фильтр, белым цветом. Это позволяет создать интересный эффект (рис. 9.6).
Флажок Inner shadow позволяет отобразить тень "внутри" ее "владельца". А флажок Hide object скрывает "владельца" тени, оставляя саму тень видимой.
Размытие (Blur)
Фильтр, создающий эффект размытия выделенного фрагмента изображения, создается выбором пункта Blur меню кнопки Add filter. Результат его применения показан на рис. 9.7, а набор элементов управления для задания его параметров — на рис. 9.8.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры области размытости в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции области размытости.
Раскрывающийся список Quality задает качество отрисовки размытости. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Эффект сияния (Glow)
Фильтр, создающий эффект сияния выделенного фрагмента изображения, создается выбором пункта Glow меню кнопки Add filter. Результат его применения показан на рис. 9.9, а набор элементов управления для задания его параметров — на рис. 9.10.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры области "сияния" в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции области "сияния".
Поле ввода с регулятором Strength позволяет задать степень насыщенности "сияния" в процентах.
Раскрывающийся список Quality задает качество отрисовки эффекта тления. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Флажок Knockout при включении "заливает" фрагмент изображения, к которому применяется фильтр, белым цветом. Флажок Inner glow позволяет отобразить имитацию "сияния" внутри ее "владельца".
Эффект вдавливания (Bevel)
Фильтр, создающий эффект вдавливания выделенного фрагмента изображения, создается выбором пункта Bevel меню кнопки Add filter. Результат его применения показан на рис. 9.11, а набор элементов управления для задания его параметров — на рис. 9.12.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры области "вдавливания" в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции области "вдавливания".
Поле ввода с регулятором Strength позволяет задать степень "вдавленности" в процентах.
Раскрывающийся список Quality задает качество отрисовки эффекта вдавливания. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Селекторы цвета Shadow и Highlight служит для задания цветов затененной и освещенной сторон "вдавленного" фрагмента изображения соответственно.
Поле ввода с регулятором Angle задает угол "вдавленности" в градусах, а поле ввода с регулятором Distance — ее "глубину". Причем "глубина" эта может принимать как положительные, так и отрицательные значения.
Флажок Knockout при включении "заливает" фрагмент изображения, к которому применяется фильтр, белым цветом.
Раскрывающийся список Туре позволяет задать вид эффекта вдавливания. В нем доступны три пункта:
□ Inner — эффект создается на самом фрагменте изображения (выбран по умолчанию);
□ Outer — эффект создается вокруг фрагмента изображения, оставляя сам этот фрагмент нетронутым;
□ Full — комбинация пунктов Inner и Outer.
Эффект градиентного сияния (Gradient Glow,)
Фильтр, создающий эффект сияния выделенного фрагмента изображения и использующий для создания этого эффекта градиент, создается выбором пункта Gradient Glow меню кнопки Add filter. Результат его применения показан на рис. 9.13, а набор элементов управления для задания его параметров — на рис. 9.14.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры области "сияния" в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции области "сияния".
Поле ввода с регулятором Strength позволяет задать степень насыщенности "сияния" в процентах.
Раскрывающийся список Quality задает качество отрисовки эффекта сияния. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Поле ввода с регулятором Angle задает угол направления эффекта в градусах, а поле ввода с регулятором Distance — ее величину отступа эффекта от фрагмента изображения, к которому применяется фильтр. Причем величина отступа может принимать как положительные, так и отрицательные значения.
Флажок Knockout при включении "заливает" фрагмент изображения, к которому применяется фильтр, белым цветом.
Раскрывающийся список Туре позволяет задать вид эффекта градиентного тления. В нем доступны три пункта:
□ Inner — эффект создается на самом фрагменте изображения;
□ Outer — эффект создается вокруг фрагмента изображения, оставляя сам этот фрагмент нетронутым (выбран по умолчанию);
□ Full — комбинация пунктов Inner и Outer.
Кроме того, в панели Properties имеется линейка для задания градиентного цвета, который используется при создании фильтра. На этой линейке находятся два указателя цвета, задающие ключевые цвета градиента.
Чтобы задать ключевой цвет для какого-либо указателя, достаточно щелкнуть по нему. После этого на экране появится окно селектора цвета, в котором мы сможем выбрать нужный цвет.
Чтобы добавить новый указатель цвета (и тем самым — новый ключевой цвет в градиент), нужно щелкнуть чуть ниже линейки, на уровне остальных указателей. Удалить ненужный указатель цвета можно, "сдернув" его мышью вниз.
Эффект градиентного вдавливания (Gradient Bevel)
Фильтр, создающий эффект вдавливания выделенного фрагмента изображения и использующий для создания этого эффекта градиентный цвет, создается выбором пункта Gradient Bevel меню кнопки Add filter. Результат его применения показан на рис. 9.15, а набор элементов управления для задания его параметров — на рис. 9.16.
Поля ввода с регуляторами Blur X и Blur Y позволяют задать размеры области "вдавливания" в пикселах. Если включить расположенную правее этих полей ввода кнопку-выключатель со знаком замка, Flash при изменении значения в одном из полей будет менять значение в другом поле, чтобы соблюсти пропорции области "вдавливания".
Поле ввода с регулятором Strength позволяет задать степень "вдавленности" в процентах.
Раскрывающийся список Quality задает качество отрисовки эффекта вдавливания. В нем доступны три пункта: Low (Низкое качество), Medium (Среднее) и High (Высокое). По умолчанию выбран пункт Low.
Поле ввода с регулятором Angle задает угол "вдавленности" в градусах, а поле ввода с регулятором Distance — ее "глубину". Причем "глубина" эта может принимать как положительные, так и отрицательные значения.
Флажок Knockout при включении "заливает" фрагмент изображения, к которому применяется фильтр, белым цветом.
Раскрывающийся список Туре позволяет задать вид эффекта градиентного вдавливания. В нем доступны три пункта:
□ Inner — эффект создается на самом фрагменте изображения (выбран по умолчанию);
□ Outer — эффект создается вокруг фрагмента изображения, оставляя сам этот фрагмент нетронутым;
□ Full — комбинация пунктов Inner и Outer.
Что касается самого градиентного цвета, использующегося при создании фильтра, то он задается с помощью уже знакомой нам линейки.
Настройка цвета (Adjust Color)
Фильтр, позволяющий настроить цвет выделенного фрагмента изображения, создается выбором пункта Adjust Color меню кнопки Add filter. Набор элементов управления для задания параметров этого фильтра показан на рис. 9.17.
Как видно на рис. 9.17, панель Properties содержит набор из четырех регуляторов, перечисленных ниже:
□ Brightness задает яркость выделенного фрагмента изображения;
□ Contrast — контрастность;
□ Saturation — насыщенность;
□ Hue — оттенок.
Мы можем задавать как положительные, так и отрицательные значения всех этих параметров. Кроме того, мы можем ввести нужное значение любого из параметров вручную. Для этого служат поля ввода, находящиеся правее перечисленных выше регуляторов.
Кнопка Reset позволит нам быстро сбросить заданные параметры фильтра в значения по умолчанию (т. е. в нулевые значения).
Управление фильтрами
Так, создавать фильтры и задавать их параметры мы уже научились. Давайте выясним, что же мы можем еще делать с ними.
Выше говорилось, что мы можем применять к выделенному фрагменту изображения сразу несколько фильтров. При этом они будут применяться к этому фрагменту в том порядке, в котором перечислены в списке фильтров панели Properties (см. рис. 9.1). Так вот, мы можем перемещать фильтры в списке мышью, меняя их порядок.
Удалить ненужный фильтр также очень просто. Выделяем в списке фильтров соответствующий ему пункт и нажимаем кнопку Remove filter, находящуюся над списком и помеченную значком "минус".
Также можно удалить сразу все фильтры, созданные для выделенного фрагмента изображения. Для этого достаточно выбрать пункт Remove All меню кнопки Add filter (см. рис. 9.2).
Если нужно временно убрать действие какого-либо фильтра, мы можем щелкнуть мышью по значку зеленой галочки, находящейся левее названия соответствующего пункта списка фильтров. После щелчка значок галочки сменится красным символом X, и фильтр будет отключен. Чтобы снова включить фильтр, нужно щелкнуть мышью по символу X (после этого там снова появится зеленая галочка, говорящая, что фильтр включен).
Пункт Disable All меню кнопки Add filter позволяет отключить сразу все фильтры. А пункт Enable All того же меню, наоборот, все их включает.
Если мы создали, с нашей точки зрения, удачную комбинацию фильтров, то можем сохранить ее в виде набора фильтров. Для создания набора фильтров
достаточно выбрать пункт Save As подменю Presets меню кнопки Add filter. На экране появится диалоговое окно Save Preset As (рис. 9.18). Вводим в единственное поле ввода Preset name этого окна имя создаваемого набора фильтров и нажимаем кнопку ОК. Если мы передумали создавать набор фильтров, нажмем кнопку Cancel.
Все созданные таким образом наборы фильтров будут присутствовать в виде пунктов, находящихся в нижней части подменю Presets меню кнопки Add filter. И чтобы применить нужный набор фильтров к выделенному фрагменту изображения, нам будет достаточно выбрать соответствующий пункт этого подменю.
Чтобы удалить ненужный набор фильтров, достаточно выбрать пункт Delete подменю Presets меню кнопки Add filter. На экране появится диалоговое окно Delete Preset (рис. 9.19). Выбираем в большом списке набор фильтров, который хотим удалить, и нажимаем кнопку Delete. Чтобы закрыть это окно, не удаляя ни одного набора фильтров, достаточно нажать кнопку Cancel.
На заметку
По идее, Flash 8 также позволяет переименовать выбранный набор фильтров. В подменю Presets меню кнопки Add filter доступен пункт Rename, после выбора которого на экране появляется диалоговое окно Rename Preset, похожее на окно Delete Preset. Но кнопка Rename этого окна, с помощью которой выполняется переименование набора фильтров, недоступна. Вероятно, это ошибка в программе.
Наложения
Наложения Flash 8 — это режимы смешивания цвета выделенного нами фрагмента изображения и цветов всех фрагментов, которые находятся под ним. При этом не имеет значения, лежат ли все эти фрагменты на одном слое или разнесены по разным слоям.
Наложения могут быть применены только к клипам (экземплярам образцов-клипов). Поэтому если нам нужно применить наложение к фрагменту изображения, не являющемуся клипом, придется сначала преобразовать его в образец-клип и применить наложение к его экземпляру.
Наложение задается с помощью панели Properties, а именно, пунктов раскрывающегося списка Blend, расположенного на вкладке Properties этой панели. Этот список показан на рис. 9.20.
Давайте перечислим все пункты этого списка и познакомимся с предлагаемыми ими режимами наложения.
□ Normal — отключение всех наложений, т. е. фрагменты графики ведут себя, как обычно.
□ Layer — то же самое, что при выборе пункта Normal. По крайней мере, автору книги не удалось обнаружить никаких отличий. Скорее всего, это ошибка в программе.
□ Darken — более светлые пикселы перекрываемых фрагментов, имеющие цвет клипа, заменяются на пикселы клипа, остальные остаются неизменными.
□ Lighten — более темные пикселы перекрываемых фрагментов, имеющие цвет клипа, заменяются на пикселы клипа, остальные остаются неизменными.
□ Screen — инвертированные пикселы клипа умножаются на пикселы перекрываемых фрагментов.
□ Overlay — то же самое, что при выборе пункта Screen, только с учетом цвета пикселов перекрываемых фрагментов.
□ Hard light — то же самое, что при выборе пункта Screen, только с учетом цвета пикселов клипа.
□ Difference — цвет пикселов клипа вычитается из цвета пикселов перекрываемых фрагментов или наоборот, в зависимости от того, какие пикселы ярче.
□ Invert — цвета пикселов клипа и перекрываемых фрагментов инвертируются.
□ Alpha и Erase — клип просто исчезает. Насколько удалось выяснить автору этой книги, другой эффект выбор этих пунктов не дает. Вероятно, это также ошибка в программе.
Скорее всего, для создания нужного эффекта придется поэкспериментировать с различными наложениями. Как говорится, лучше один раз увидеть…
Что дальше?
Вот мы и познакомились с новыми возможностями, предлагаемыми Flash 8, — фильтрами и наложениями. Удобные, кстати, штуки — автору они пригодились в Macromedia Fireworks, значит, пригодятся и во Flash.
Flash 8, как мы помним из главы 1, — пакет гибридной графики. Это значит, что изображение Flash может содержать, наряду с векторными, и растровые фрагменты. О том, как импортировать такие фрагменты в документ Flash и что можно с ними делать потом, и расскажет следующая глава.