Flash - статьи

         

Работа с цветом


Flash MX обеспечивает различные механизмы применения, создания и модификации цветовой палитры фильма и отдельных его элементов. Используя палитру, установленную по умолчанию, или созданную вами, вы можете выбрать определенный цвет для заливки объекта или для его контура.

Для закрашивания линий и контуров могут использоваться только базовые цвета; вместе с тем, при выборе цвета контура или отдельной линии вы можете дополнительно выбрать стиль и толщину линии. Для заливки может быть использован базовый (однотонный) цвет, градиент, или растровое изображение. Чтобы применить для закрашивания растровое изображение, вы должны импортировать его в файл фильма. Flash MX поддерживает возможность применения прозрачного (невидимого) цвета для закрашивания линий и заливок. Это позволяет создавать, например, только контур объекта без заливки, или, наоборот, закрашенный объект без контура. Кроме того, Flash MX поддерживает достаточно широкие возможности по управлению цветовой схемой текстовых символов.


Для работы с цветом во Flash MX предназначены следующие средства:

инструменты Ink Bottle Tool (Бутылка чернил), Paint Bucket Tool (Банка краски), Fill Transform (Трансформация заливки) и Dropper Tool (Пипетка), расположенные на панели Tools (рис. 6.1);
кнопки Stroke Color (Цвет контура), Fill Color (Цвет заливки), Default Colors (Цвета по умолчанию), No Color (Бесцветный) и Swap Colors (Поменять цвета), расположенные в поле Colors панели Tools (см. рис. 5.22);
панели Color Mixer (Смеситель цвета) и Color Swatches (Образцы цвета).

Рис. 6.1. Инструменты для работы с цветом

 

Начало

Инструмент Ink Bottle Tool


Инструмент предназначен для изменения цвета линии или контура объекта; при этом использоваться могут только базовые цвета. Кроме того, с его помощью можно изменять толщину и стиль линии (контура)

Для изменения цвета линии с помощью Ink Bottle необходимо выполнить следующие действия:

Включить инструмент;
С помощью кнопки Stroke Color выбрать требуемый цвет;
Установить указатель на редактируемую линию (горячей точкой указателя является кончик «струи» из бутылки) и щелкнуть кнопкой мыши.
Чтобы изменить с помощью Ink Bottle толщину и/или стиль линии, необходимо установить соответствующие параметры в инспекторе свойств инструмента (рис. 6.2) и затем щелкнуть им по редактируемой линии. Таким образом, благодаря инспектору свойств вы можете «одним щелчком» изменить цвет, толщину и стиль любой линии.

Рис. 6.2. Инспектор свойств инструмента Ink Bottle

 

Инструмент Paint Bucket Tool


Инструмент предназначен для изменения цвета заливки объекта или «мазка» кисти, а также для закрашивания произвольной замкнутой области на столе; для закрашивания могут использоваться базовые цвета, градиенты и растровые изображения. Инструмент может также применяться для закрашивания и незамкнутых областей, однако в этом случае требуется разрешить Flash MX автоматически закрывать промежутки между ограничивающими область линиями.

Для изменения цвета заливки с помощью Paint Bucket Tool необходимо выполнить следующие действия:

Включить инструмент;
С помощью кнопки Fill Color выбрать требуемый цвет;
Установить указатель на закрашиваемую область (горячей точкой указателя является кончик «струи» из банки) и щелкнуть кнопкой мыши.
Инструмент Paint Bucket имеет дополнительные параметры, установка которых выполняется с помощью кнопок-модификаторов, расположенных в поле Options панели Tools (рис. 6.3).

Кнопка Gap Size (Размер промежутка) открывает меню, позволяющее выбрать вариант автоматического «оконтуривания» незамкнутой области, которую требуется закрасить (рис. 6.4).

Рис. 6.3. Кнопки-модификаторы инструмента Paint Bucket

Рис. 6.4. Варианты автоматического «оконтуривания» незамкнутой области

Выберите вариант Don't Close Gaps (He закрывать промежутки), если вы хотите закрыть промежутки вручную; такой вариант предпочтителен для сложных рисунков, поскольку, во-первых, Flash требуется время для поиска и закрытия промежутков и, во-вторых, это еще более усложнит рисунок.

Выбор любого из трех других вариантов (Close Small Gaps — «закрыть маленькие промежутки», Close Medium Gaps - «закрыть средние промежутки» и Close Large Gaps — «закрыть большие промежутки») обеспечивает закрашивание областей, контур которых имеет один или более «просветов». Необходимо отметить, что различие в размерах «маленького» и «большого» промежутков не оговорено авторами Flash MX, поскольку зависит от разрешающей способности монитора, и в любом случае не превышает пары миллиметров. Поэтому, если вы действительно хотите воспользоваться этой услугой Flash, целесообразно выбрать вариант Close Large Gaps.

Модификатор Lock Fill (Блокировка заливки) используется только для градиентных заливок и растровых изображений. Он создает эффект, что все изображения как бы являются частью одного, занимающего весь стол. Соответственно, каждому изображению «достается» свой участок общей заливки, цвет которого зависит от позиции объекта на столе (рис. 6.5).

 

Инструмент Fill Transform

Данный инструмент позволяет изменять параметры градиентной или растровой заливки некоторой области.

Чтобы перейти в режим редактирования заливки, необходимо включить инструмент Fill Transform (при этом изменится форма указателя мыши) и выбрать редактируемую заливку, щелкнув на ней мышью.

Рис. 6.5. Результат применения модификатора Lock Fill

Это приведет к тому, что в центре заливки появится точка трансформации, а на выделяющей рамке — три маркера (рис. 6.6 а). Первый и второй обеспечивают изменение размера градиента (или растрового изображения), третий — его положение. При наведении указателя на маркер форма указателя изменяется, показывая назначение маркера. Перемещение точки трансформации также позволяет изменять вид градиентной заливки и растрового изображения. Примеры редактирования градиентной заливки показаны на рис. 6.6 б-6.6 д.


Рис. 6.6. Редактирование градиентной заливки с помощью инструмента Fill Transform

Особенность работы с растровыми изображениями, в том числе используемыми в качестве заливки, будет рассмотрена в разделе «Использование импортированных изображений».

 

Инструмент Dropper Tool


Инструмент позволяет копировать (переносить) атрибуты некоторой линии или заливки на другой объект. Кроме того, с его помощью можно производить выбор растрового изображения, которое будет использовано для создания заливки.

Для копирования атрибутов линии или заливки требуется выполнить следующие действия:

Включить инструмент Dropper Tool и щелкнуть на линии или фигуре; в зависимости от типа эталонного элемента (линия или заливка) автоматически включается соответствующий инструмент закрашивания — Ink Bottle Tool или Paint Bucket Tool, кроме того, для инструмента Paint Bucket Tool устанавливается режим Lock Fill.
Щелкнуть на объекте, которому требуется назначить эталонные атрибуты.

 

Кнопки группы Colors


Еще раз повторим, что в эту группу панели Tools входят кнопки Stroke Color, Fill Color, Default Colors, No Color и Swap Colors (CM. рис. 6.1).

Кнопки Stroke Color и Fill Color представляют собой как бы два переключателя, и в каждый момент времени может быть включена только одна из них. Кнопки могут использоваться либо совместно с инструментами рисования, рассмотренными выше, либо с инструментом Arrow. Щелчок на любой из кнопок приводит к открытию окна палитры, в котором производится выбор нужного цвета (рис. 6.7)

Обратите внимание, что для градиентных цветов код RGB принимается равным #000000 (то есть коду черного цвета).

Кнопка Swap Color позволяет быстро (одним щелчком) поменять местами цвета заливки и контура выбранного объекта.

Рис. 6.7. Окно палитры Flash MX

Кнопка No Color предназначена для создания объектов с прозрачной (бесцветной) заливкой или с прозрачным (бесцветным) контуром. Данная установка может быть применена только к вновь создаваемым объектам, но «е к существующим. Для существующего объекта аналогичный эффект можно получить, просто удалив контур или заливку. Кнопка становится доступной только при включении инструментов Oval Tool или Rectangle Tool. Щелчок на кнопке приводит к тому, что прозрачный цвет устанавливается для заливки (рис. 6.8). Чтобы применить его к контуру объекта, следует воспользоваться кнопкой Swap Color.

Рис. 6.8. Выбор прозрачной заливки

Кнопка Default Colors обеспечивает замену цветовой схемы выбранного объекта (или нескольких объектов) на используемую по умолчанию: белая заливка и черный контур.

 

Панель Color Mixer


Панель позволяет выполнять следующие действия:

устанавливать цвет заливки для выбранного или вновь создаваемого объекта;
редактировать существующие градиентные заливки;
выбирать растровое изображение, которое должно использоваться в качестве заливки;
создавать новые и редактировать основные цвета палитры Flash.

 

Форматы панели


Формат панели зависит от вида операции, который может быть выбран из раскрывающегося списка (рис. 6.9).

Таких вариантов пять:

None (Отсутствует) — установить прозрачный цвет заливки; вариант доступен только в том случае, если на панели Tools включен один из трех инструментов: Pen, Oval или Rectangle (то есть для вновь создаваемого объекта); формат панели для этого режима показан на рис. 6.10; кнопки, отображаемые справа от списка режимов, дублируют кнопки, входящие в группу Colors панели Tools;

Рис. 6.9. Панель Color Mixer (формат для создания радиального градиента)

Solid (Базовый цвет) — установить для заливки один из базовых цветов; при выборе этого варианта панель также содержит кнопки, дублирующие группу Colors панели Tools; при выборе основного цвета вы можете использовать как полный, так и сокращенный формат панели (именно он показан на рис. 6.11);
Linear gradient (Линейный градиент) — редактировать заливку с линейным градиентом; в данном случае на панели отображаются те же элементы, что и при создании радиального градиента (см. рис. 6.9); подробнее технология редактирования градиентных заливок будет рассмотрена чуть позже;
Radial gradient (Радиальный градиент) — редактировать заливку с радиальным градиентом; формат панели и технология работы с ней такие же, как и для заливки с линейным градиентом;
Bitmap (Растровое изображение) — выбрать растровое изображение для заливки; в данном случае панель Color Mixer дополняется своеобразным списком, в котором отображаются растровые изображения, импортированные в фильм (рис. 6.12); щелчок на элементе списка приводит к тому, что соответствующий вид заливки становится активным и может быть применен к объектам фильма с помощью инструмента Paint Bucket; подробнее о работе с растровыми изображениями см. подраздел «Использование импортированных изображений» этой главы.

Рис. 6.10. Формат панели Color Mixer для прозрачной заливки

Рис. 6.11. Формат панели Color Mixer для заливки основным цветом

Рис. 6.12. Формат панели Color Mixer для работы с растровыми заливками

Замечание

При работе с цветовой палитрой можно использовать вместо кодировки RGB (Red, Green, Blue) альтернативную кодировку — HSB (Hue, Saturation, Brightness); выбор кодировки выполняется с помощью команд контекстного меню "панели (чтобы его открыть, требуется щелкнуть кнопку в верхнем правом углу панели).

 

Редактирование градиентной заливки


Если необходимо скорректировать цветовые переходы одной из существующих градиентных заливок, следует ее предварительно выбрать с помощью кнопки Fill Color на панели Tools (или одноименной кнопки на панели Color Mix).

Для создания новой градиентной заливки достаточно просто выбрать в списке режимов панели пункт Linear или Radial. В этом случае в качестве исходной будет использована заливка на основе черного цвета.

Рис. 6.13. Формат панели Color Mix при редактировании градиентной заливки

Рассмотрим подробнее формат панели Color Mix при редактировании градиентной заливки (рис. 6.13).

Ползунковый регулятор, предназначенный для коррекции цветовых переходов, состоит из двух основных компонентов:

шкалы градиента (Gradient definition bar), предназначенной для просмотра полученного результата;
индикаторов градиента (Gradient pointers), которые позволяют изменять цвет областей градиента и перемещать границы цветовых переходов.
По умолчанию (в исходном состоянии) таких индикаторов два. Индикаторы являются интерактивными, перемещение более светлого увеличивает светлую область градиента, перемещение темного, соответственно, темную.

С помощью мыши можно поменять взаимное расположение светлого и темного индикаторов. Это приведет к изменению взаимного расположения светлой и темной областей заливки (рис. 6.14).

Помимо положения индикатора на шкале, вы можете изменять его цвет и, следовательно, цвет связанной с ним области. Чтобы изменить цвет индикатора, необходимо:

Щелкнуть на нем мышью; при этом цвет значка активного индикатора (см. рис. 6.13) станет таким же, как у выбранного индикатора.
Открыть окно палитры (щелкнув на кнопке палитры) и выбрать в нем требуемый цвет.

Рис. 6.14. Изменение вида градиента путем перемещения индикаторов

Для градиентной заливки может быть задано произвольное количество цветовых областей. Чтобы добавить новую область, требуется добавить индикатор градиента. Для этого подведите указатель мыши к нижней кромке шкалы градиента (при этом возле указателя появится символ «+») и щелкните левую кнопку мыши. После этого описанным выше способом измените цвет индикатора. Пример градиентной заливки с несколькими цветовыми переходами показан на рис. 6.15.

Чтобы удалить лишний индикатор (и связанную с ним область), необходимо нажать клавишу <Ctrl> и, не отпуская ее, переместить с помощью мыши удаляемый индикатор вниз, то есть как бы «оторвать» его от шкалы. После этого отпустить клавишу <Ctrl> и кнопку мыши.

Рис. 6.15. Пример градиентной заливки с несколькими цветовыми переходами

Чтобы сохранить новую заливку в базовой палитре Flash, необходимо открыть контекстное меню панели и выбрать в нем команду Add Swatch (Добавить образец).

Технология редактирования радиального градиента аналогична рассмотренной выше. Некоторая особенность имеется лишь в представлении светлой и «затененной» областей. В зависимости от их взаимного расположения различают «внешний» градиент, когда источник света как бы находится вне освещаемого объекта (рис. 6.16, слева), и «внутренний», имитирующий источник света, расположенный внутри объекта (рис. 6.16, справа).

Рис. 6.16. Разновидности радиального градиента

Совет

Даже с помощью одной и той же градиентной заливки вы можете имитировать различные варианты взаимного расположения источника света и объекта. Для этого необходимо включить инструмент Paint Bucket и, щелкая мышью на заливке объекта, добиться требуемого эффекта.

Для линейных градиентов интересный эффект может быть получен, если при включенном инструменте Paint Bucket и нажатой кнопке мыши «прочертить» линию на заливке объекта.

 

Панель Color Swatches


Данная панель отличается от панели Color Mix тем, что позволяет работать не с отдельными цветами, а с палитрами цветов. С ее помощью можно скомпоновать и сохранить на диске несколько палитр, каждая из которых будет использоваться в определенном фильме.

Основным средством работы с палитрами являются команды раскрывающегося меню (рис. 6.17).

К таким командам относятся:

Duplicate Swatch (Дублировать образец) — копирование выбранного цвета;
Delete Swatch (Удалить образец) удаление выбранного цвета;
Add Color... (Добавить цвет) — импортирование во Flash внешней палитры и добавление ее цветов к текущей палитре; палитра может храниться в файле формата CLR (Flash Color Set — палитра Flash) или ACT (Adobe Color Table);
Replace Colors... (Заменить цвет) - импортирование во Flash внешней палитры и замена ею текущей палитры;
Load Default Colors (Загрузить стандартную палитру) — замена текущей палитры используемой по умолчанию;
Save Colors (Сохранить палитру) — сохранение текущей палитры в формате ACT или CLR;

Рис. 6.17. Панель Color Swatches

Save as Default (Сохранить как стандартную палитру) — сохранение текущей палитры в качестве используемой по умолчанию;
Clear Colors (Очистить палитру) — из палитры удаляются все цвета, кроме черного и белого, а также серого градиента;
Web 216 (попробуйте перевести самостоятельно) — загрузка палитры из 216 цветов, которая гарантированно поддерживается в Интернете;
Sort by Color (упорядочить цвета) — упорядочивание цветов текущей палитры по оттенку.

 

ИСПОЛЬЗОВАНИЕ ИМПОРТИРОВАННЫХ ИЗОБРАЖЕНИЙ


И без того достаточно развитые возможности Flash по созданию графических изображений могут быть еще более усилены за счет включения в Flash-фильмы импортированных изображений. Flash поддерживает импорт как векторных, так и растровых изображений в различных форматах. Перечень основных из них был приведен в разделе «Варианты использования фильмов Flash» второй главы. В данном разделе мы остановимся на использовании растровых изображений. Сразу отметим, что технология работы с ними практически не зависит от формата и аналогична для GIF, JPEG, PNG и BMP.

Импортирование растровых изображений в Flash-фильм может увеличивать размер файла фильма. Чтобы уменьшать размер файла растрового изображения, вы можете выбирать опцию сжатия в диалоговом окне Bitmap Properties (Параметры растра).

Flash не способен «своими силами» редактировать растровое изображение. Если в этом имеется необходимость, возможны два варианта действий:

открыть и отредактировать изображение в одном из внешних графических редакторов (например, Fireworks);
конвертировать растровое изображение в векторное.
Преимуществом второго подхода является уменьшение размера файла с Flash-фильмом.

Существует и еще один способ работы с растровой графикой. Вы можете разделить растр на отдельные доступные для редактирования области (процедура называется Breaking Apart). При этом растр сохраняет все первоначальные детали. Применение указанной процедуры позволяет также использовать растровое изображение в качестве заливки для закрашивания объектов.

 

Импорт растровых изображений


Чтобы импортировать в фильм растровое изображение, следует выполнить следующие действия:

В меню File выбрать команду Import (Импорт).
С помощью стандартного окна файловой системы ОС Windows открыть нужный файл.
В результате импортированное изображение появится на столе, а также будет помещено в библиотеку фильма в качестве символа соответствующего типа, как показано на рис. 6.18.

Рис. 6.18. Результат импорта растрового изображения

Замечание

Если импортируемое изображение — это анимирован-ный GIF, то каждый кадр помещается в библиотеку как отдельный символ; им автоматически назначаются возрастающие порядковые номера (рис. 6.19).

Рис. 6.19. Представление в библиотеке анимированного GIF-файла

Чтобы уточнить и при необходимости изменить параметры импортированного изображения (например, уменьшить его размер), необходимо:

В раскрывающемся меню окна библиотеки выбрать команду Properties (Свойства).
В открывшемся диалоговом окне Bitmap Properties установить требуемые значения.
Диалоговое окно Bitmap Properties содержит следующие элементы (рис. 6.20):

область просмотра изображения; следует иметь в виду, что масштабирование изображения в данном случае не выполняется, поэтому в окне может быть виден только фрагмент изображения (верхний левый угол);
текстовое поле с именем соответствующего символа библиотеки (по умолчанию оно совпадает с именем файла изображения, но пользователь может его изменить);

Рис. 6.20. Диалоговое окно Bitmap Properties

статическая текстовая область, в которой отражается дополнительная информация об изображении (путь к файлу, дата создания, размер, глубина цвета);
флажок Allow Smoothing (Разрешить сглаживание); если он установлен, то Flash выполняет сглаживание изображения (antialiasing);
раскрывающийся список Compression (Сжатие); список содержит два пункта:
Photo (JPEG) — сжатие для фотореалистических изображений;
Lossless (PNG/GIF) — сжатие для контурных рисунков с резкими цветовыми переходами;
флажок Use Imported JPEG Data (Использовать импортированные данные); если он установлен, то сжатие изображения вы-полняется в соответствии с установленными ранее параметрами; для формата BMP тот же флажок называется несколько иначе — Use Document Default Quality (Использовать заданное качество документа), а для форматов GIF и PNG вообще отсутствует (поскольку для этих двух форматов дополнительное сжатие эффекта не дает); если флажок снят, то ниже отображается текстовое поле Quality (Качество), в котором можно указать требуемое качество изображения после сжатия (в процентах от исходного, 100% соответствует максимальному качеству);
кнопка Test (Тест) позволяет оценить результат сжатия: после щелчка на ней в нижней части окна выводится информация о размере исходного и сжатого изображения, и новый вариант отображается в области просмотра (рис. 6.21).

Рис. 6.21. Представление результатов сжатия изображения

 

Редактирование растровых изображений


Импортированное растровое изображение не доступно для редактирования средствами Flash. Правда, его можно масштабировать, поворачивать, наклонять и изменять точку привязки, но инструменты рисования и закрашивания на него не действуют. Чтобы их можно было использовать, требуется конвертировать растровое изображение в векторное.

Для этого необходимо выполнить следующие действия:

Скопировать из окна библиотеки экземпляр изображения на стол.
В меню Modify выбрать команду Trace Bitmap... (Перенести растр).
В открывшемся диалоговом окне Trace Bitmap установить параметры преобразования. Следует иметь в виду, что это весьма важный шаг. Дело в том, что если импортируемое изображение содержит сложные формы и много цветов, полученное векторное изображение может иметь больший размер, чем первоначальный растр. Путем подбора установок в диалоговом окне Trace Bitmap можно найти компромисс между размером файла и качеством изображения.
Окно Trace Bitmap содержит следующие элементы (рис. 6.22):

Текстовое поле Color Threshold (Цветовой порог) — целое число в диапазоне от 1 до 500; представляет собой числовой код цвета пиксела в системе RGB; если цвет двух соседних пикселов растрового изображения различается меньше, чем на указанную величину, участок изображения переносится в векторный рисунок как одноцветный; таким образом, увеличение цветового порога ведет к «обеднению» палитры изображения, но и сокращает его размер;
Текстовое поле Minimum Area (Минимальная область) — целое число в диапазоне от 1 до 1000; представляет собой количество окружающих пикселов, которые должны учитываться при назначении цвета пикселу;
Раскрывающийся список Curve Fit (Подбор кривой) позволяет выбрать способ сглаживания контуров и линий изображения:
Pixels (По пикселам);
Very Tight (Очень близко);
Tight (Близко);

Рис. 6.22. Окно Trace Bitmap

Normal (Стандартно);
Smooth (Сглаживать);
Very Smooth (Сильно сглаживать);
Раскрывающийся список Corner Threshold (Пороговое значение углов) позволяет выбрать способ сглаживания углов.
Чтобы получить векторное изображение, наиболее похожее на исходное растровое, рекомендуется устанавливать следующие значения: Color Threshold: 10 Minimum Area: 1 pixel Curve Fit: Pixels Corner Threshold: Many Corners.

На рис. 6.23 показан результат преобразования растрового изображения (а) в векторное при рекомендуемых значениях параметров (б) и при установленных по умолчанию (в).

Замечание

После преобразования растрового изображения в векторное экземпляр изображения, находящийся на столе, больше не связан с исходным символом в окне библиотеки фильма.

Применение процедуры разбиения изображения Breaking apart — имеет следующие особенности:

пикселы в изображении разделяются на отдельные дискретные области, которые могут быть выбраны и изменены независимо друг от друга;


Рис. 6.23. Результат преобразования растрового изображения в векторное при различных значениях параметров

полученное изображение может использоваться для закрашивания заливки объектов. Для разбиения изображения необходимо:
Выбрать изображение на столе, дважды щелкнув на нем мышью при включенном инструменте Arrow.
В меню Modify выбрать команду Break Apart.
Для выбора области в полученном изображении используется инструмент Lasso при включенном модификаторе Magic Wand (Волшебная палочка). Сама Волшебная палочка также может настраиваться с помощью дополнительного диалогового окна, которое открывается щелчком на кнопке Magic Wand Settings (Параметры волшебной палочки).

Чтобы использовать растровое изображение в качестве заливки, следует выполнить следующие действия.

Импортировать растровое изображение с помощью команды Import или скопировать его на стол из другого приложения через буфер обмена.
В меню Modify выбрать команду Break Apart.
Открыть панель Color Mix и в списке режимов выбрать пункт Bitmap.
В списке растровых изображений щелкнуть на миниатюре изображения, которое будет использовано в качестве заливки; в результате на кнопке Fill Color панели Tools появится еще более мелкая копия растрового изображения, это означает, что фигуры, создаваемые инструментами рисования, будут закрашены растровым изображением.
Если требуется изменить заливку для ранее созданных объектов, следует включить инструмент Paint Bucket и использовать его обычным образом.
При использовании растрового изображения в качестве заливки оно масштабируется (уменьшается) и затем размножается таким образом, чтобы заполнить всю площадь заливки (рис. 6.24).

Рис. 6.24. Пример использования растрового изображения в качестве заливки: слева — с инструментом Oval, справа — с инструментом Paint Bucket