Если вы, уважаемый читатель, уже знакомы с одним из программных средств от фирмы Macromedia (например, с редактором Dreamweaver), то освоение пользовательского интерфейса Flash не потребует от вас значительных усилий. Если же вы решили начать освоение инструментов от Macromedia именно с Flash MX, то некоторые решения могут вам показаться несколько необычными. Например, в большинстве Windows-приложений (в частности, в офисных пакетах) все команды, управляющие составом отображаемых панелей инструментов, входят в меню View (Вид). Разработчики Flash поместили такие команды в меню Window (Окно). Несколько необычно выглядят также панели свойств редактируемых объектов. Тем не менее, подобные нововведения не являются определяющими, и уже после нескольких сеансов работы они кажутся вполне естественными.
Итак, познакомимся поближе с рабочей средой редактора Flash MX.
В целом организация пользовательского интерфейса редактора является достаточно стандартным для Windows-приложений. Та же полоса меню, те же кнопки основной панели инструментов, на которую вынесены наиболее часто используемые команды. Достаточно своеобразной является панель временной диаграммы, но опять-таки только для тех, кто пока не знаком с Dreamweaver.
При первом запуске редактора на экран выводится поверх основного окна дополнительное диалоговое окно - Welcome (Добро пожаловать), предлагающее настроить конфигурацию рабочей среды в соответствии с вашими интересами. Это действительно полезная функция, но вопросам настройки интерфейса посвящен отдельный раздел главы «Средства поддержки пользователя». Поэтому закройте пока окно Welcome (впоследствии оно может быть вызвано на экран с помощью одноименной команды из меню Help). Прежде поговорим о том, из чего же, собственно, предлагается выбирать.
Наиболее важные элементы основного окна Flash MX показаны на рис. 3.1.
Строка меню Панель в Р еменн ° й Диаграммы
Рис. 3.1. Структура основного окна flash MX
Панель инструментов редактирования расположена вдоль левой границы окна. Она обеспечивает доступ к инструментам, которые применяются для создания и редактирования графических объектов. Многие из этих инструментов, вероятно, знакомы читателю по работе с графическими редакторами.
Для удобства работы панель инструментов разделена на четыре части (рис. 3.2):
Замечание
В отличие от предыдущей версии Flash, установка некоторых параметров инструментов рисования может также выполняться с помощью панели инспектора свойств. Особенности настройки каждого инструмента рассмотрены в следующей главе.
Рис. 3.2. Панель инструментов редактирования
При необходимости панель инструментов может быть «отстыкована» от границы и окна и превращена в «плавающую».
Рабочая область занимает всю центральную часть окна. В рабочей области можно выполнять любые операции редактирования объектов, однако в «кадр» попадут только те объекты (или их фрагменты), которые расположены в пределах монтажного стола. В связи с этим может возникнуть вопрос: зачем же нужна остальная часть рабочей области? Ответов два:
Непосредственно над рабочей областью находится относящаяся к ней панель инструментов. На ней расположены следующие элементы интерфейса (рис. 3.3, слева направо):
Рис. 3.3. Панель инструментов рабочей области
Щелчок правой кнопкой мыши в любой точке рабочей области открывает контекстное меню, содержащее основные команды для изменения параметров рабочей области и фильма в целом. Всего таких команд около двух десятков. Пока остановимся на одной - Scene (Сцена). Ее выбор приводит к выводу на экран одноименной панели, предназначенной для работы со сценами фильма (рис. 3.4).
Рис. 3.4. Панель Scene
С ее помощью вы можете:
В центре рабочей области находится так называемый монтажный стол (Stage), который мы в дальнейшем для краткости будем называть просто «стол». Размер стола и его цвет определяют соответственно размер и цвет «экрана» при просмотре фильма. Как было отмечено выше, при воспроизведении фильма на «экран» попадут только те объекты, которые расположены в пределах стола.
В каждый момент времени на столе может располагаться только одна сцена, относящаяся к данному фильму. В то же время сам стол принадлежит определенному фильму. Как только вы открываете для редактирования какой-либо фильм (то есть файл с расширением .fla), или создаете новый файл, в окне Flash появляется стол и связанная с ним временная диаграмма. Если же редактируемых файлов нет, то и стол не отображается (рис. 3.5).
Рис. 3.5. Нет фильма — нет и стола
И наоборот, если вы последовательно откроете несколько файлов, в пределах основного окна будет помещено соответствующее количество столов и связанных с ними элементов интерфейса.
Объясняется это тем, что во Flash используется так называемый многодокументный интерфейс — MDI (Multi Document Interface). Такая модель работы приложения означает, что внутри одного родительского окна (именно оно показано на рис. 3.5) может быть открыто несколько редактируемых файлов — дочерних окон. Например, на рис. 3.6 показан случай, когда в родительском окне Flash открыто два файла, то есть два различных фильма. Кстати, обратите внимание, что при минимизации окон фильмов некоторые кнопки стали как бы собственностью конкретного фильма, а панель инструментов редактирования осталась общей.
Рис. 3.6. Работа с двумя фильмами одновременно
MDI обеспечивает целый ряд преимуществ, одно из которых — возможность копирования или перемещения элементов из одного фильма в другой путем перетаскивания с помощью мыши (то есть применение техники drag-and-drop — «перетащи и оставь»). При копировании или перемещении объектов в другой фильм для него сохраняется не только визуальное представление, но и остальные свойства. Например, при копировании кнопки сохраняются и связанные с ней действия.
Совет
Для перемещения объекта из одного фильма в другой достаточно установить указатель на этот о&ъект. нажать кнопку мыши, и, не отпуская ее, переместить объект на нужную позицию в другом окне.
Чтобы скопировать объект в другой фильм, описанные выше действия выполняются при нажатой клавише <Ctrl>.
Над рабочей областью расположена панель временной диаграммы (Timeline). Временная диаграмма, как и стол, принадлежит конкретной сцене фильма. Она позволяет описать взаимное расположение слоев на сцене, последовательность изменения состояния объектов, представленных на сцене, и выполнить некоторые другие операции. Временная диаграмма является основным инструментом при создании анимации и при описании поведения интерактивных элементов фильма.
Панель временной диаграммы имеет весьма сложную структуру и содержит большое число элементов управления. Кроме того, в зависимости от установленных параметров, внешний вид временной диаграммы изменяется в достаточно широком диапазоне. Тем не менее, от умения работать с временной диаграммой в значительной степени зависит эффективность работы с Flash в целом.
В данном подразделе мы рассмотрим только основные компоненты панели временной диаграммы и наиболее общий ее формат. В последующих подразделах вопросы, связанные с ее использованием, будут уточняться и конкретизироваться;
Итак, в общем случае на панели временной диаграммы могут быть представлены следующие элементы (рис. 3.7):
Рис. 3.7. Панель временной диаграммы
Рассмотрим подробнее элементы временной диаграммы.
Начнем со шкалы кадров. Шкала является общей для всех слоев сцены. На ней отображена нумерация кадров в возрастающем порядке. Шаг нумерации равен 5 (он остается неизменным при любом формате кадров).
Считывающая головка (Play head) является своеобразным индикатором, указывающим текущий (активный) кадр анимации. При создании очередного кадра и при воспроизведении фильма считывающая головка перемещается вдоль временной диаграммы автоматически. Вручную (с помощью мыши) ее можно перемещать только после того, как анимированный фильм будет создан. Причем перемещать ее можно в обоих направлениях; при этом будет изменяться и состояние ани-мированных объектов.
Временная диаграмма отдельного слоя представляет собой графическое изображение последовательности кадров. Ниже видно, что само по себе изображение кадров на временной диаграмме весьма информативно. В частности, по изображению кадров можно определить, какой способ анимирования использован для данного слоя. Ниже приведена краткая характеристика различных форматов временной диаграммы слоя (точнее, расположенного в нем объекта).
Форматы изображения кадров на временной диаграмме
Пояснения
Ключевые кадры для tweened-анимации перемещения обозначаются как черные точки, соединенные линией со стрелкой, на светло-синем фоне (линия со стрелкой заменяет все промежуточные кадры)
Ключевые кадры для tweened-анимации трансформации обозначаются как черные точки, соединенные линией со стрелкой, на светло-зеленом фоне (линия со стрелкой заменяет все промежуточные кадры)
Пунктирная линия указывает, что конечный (заключительный) ключевой кадр отсутствует
Одиночный ключевой кадр в виде черной точки, после которого идет последовательность светло-серых кадров, означает, что содержимое ключевого кадра не изменяется; заключительный ключевой кадр в этом случае обозначается пустым прямоугольником
Маленькая буква а указывает, что данному кадру с помощью панели Actions (Действия) было назначено некоторое действие
Красный флажок указывает, что кадр содержит метку или комментарий
Непрерывная последовательность ключевых кадров, обозначенных черными точками, означает покадровую анимацию
Желтый якорек говорит о том, что данный кадр содержит именованную метку, используемую для навигации между кадрами фильма; если позволяет место на диаграмме, рядом с якорем выводится имя метки
Внешний вид временной диаграммы также существенно зависит от выбранного формата кадров. Выбор, как уже было сказано, выполняется с помощью выпадающего меню Frame View. Действие команд меню распространяется на все строки (слои) временной диаграммы. Пункты меню разделены на четыре подгруппы (рис. 3.8).
Рис. 3.8. Выпадающее меню формата кадров
Команды из первой позволяют установить размер ячейки кадра по горизонтали; возможны следующие варианты:
Формат Large целесообразно использовать для просмотра параметров звукового сопровождения.
Во вторую группу входит единственная команда — Short (Короткий), которая обеспечивает уменьшение размера ячейки кадра по вертикали. Такое изменение влияет и на формат левой части временной диаграммы (где расположено описание слоев), как показано на рис. 3.9.
В третью группу также включена только одна команда - - Tinted Frames (Окрашенные кадры). При выборе данного пункта используется цветовая индикация кадров для различных видов анимации (см. табл. 3.1). По умолчанию цветовая индикация кадров включена.
Рис. 3.9. Изменение формата временной диаграммы по команде Short (сравн. с рис. 3.7)
Последняя, четвертая, группа состоит из двух команд:
Ниже рабочей области (в исходном состоянии) размещается панель инспектора свойств (см. рис. 3.1). Если в рабочей области не выбран ни один объект, либо таковые вообще отсутствуют, то инспектор свойств отображает общие параметры фильма. При выборе какого-либо объекта автоматически изменяется формат инспектора свойств.
На рис. 3.11 показан формат инспектора свойств для документа (фильма) в целом.
В этом случае панель инспектора содержит следующие элементы:
Рис. 3.10. Результаты применения команд Preview (вверху) и Preview In Context (внизу)
Рис. 3.11. Формат инспектора свойства документа
Замечание
Следует отметить, что как инспектор свойств, так и другие панели являются контекстно-зависимыми. То есть для того, чтобы получить с их помощью данные о другом объекте, не требуется открывать их повторно — достаточно просто выбрать в окне редактора интересующий вас объект.
Рис. 3.12. Диалоговое окно Document Properties
С остальными элементами окна Flash MX, а также с командами, входящими в различные разделы меню, вы познакомитесь при изучении соответствующих этапов создания фильма
Movie Explorer — это специальная компонента Flash 5, которая обеспечивает возможность просмотра структуры фильма и быстрый выбор любого элемента фильма для модификации. Использование Movie Explorer позволяет существенно повысить производительность труда разработчика фильма. С помощью Movie Explorer могут быть, в частности, выполнены следующие операции:
Чтобы открыть Movie Explorer, требуется выбрать в меню Window команду Movie Explorer. Формат окна Movie Explorer показан на рис. 3.13.
Рис. 3.13. Формат окна Movie Explorer
Структура фильма отображается в окне обозревателя в виде дерева, уровень детализации которого можно изменять, сворачивая и разворачивая «ветви» дерева. С целью облегчения визуального восприятия структуры фильма для представления каждого типа элемента используется свой значок. Если фильм большой, и дерево структуры не умещается в окне стандартного размера, пользователь может увеличить размер окна, переместив его границы с помощью
Следует отметить, что дерево фильма состоит как бы из двух частей. Первая из них описывает структуру конкретной сцены, соответственно корневым элементом этой части является элемент с именем сцены, например, Scenel, как показано на рис. 3.13. Если в фильме несколько сцен, то описание каждой из них «растет» из своего корня. Вторая часть является общей для всего фильма (для всех сцен) и называется Symbol Definition(s). Она описывает состав и структуру всех символов, используемых в фильме (рис. 3.14).
Рис. 3.14. Раздел описания символов фильма
Независимо от того, с какой частью дерева вы работаете, выбрав в нем определенный элемент (щелкнув на нем мышью) вы можете получить информацию о расположении этого элемента внутри фильма. Эти сведения выводятся в строке состояния окна обозревателя (см. рис. 1.14).
Существует и еще одна важная особенность работы с обозревателем. Если в фильме используется сценарий на языке ActipnScript, то щелчок на соответствующем значке в дереве фильма позволяет «развернуть» сценарий (рис. 3.15). Двойной щелчок на корневом элементе или на любой строке сценария приводит к вызову редактора ActionScript с загруженным в него сценарием.
Наряду с областью просмотра структуры фильма, в окне Movie Explorer имеются следующие элементы интерфейса.
Рис. 3.15. Просмотр сценария в окне обозревателя
Группа топок Show (Показать), которые позволяют выбирать категории элементов фильма, подлежащие отображению в дереве структуры; кнопки используются по аналогии с флажками, то есть одновременно может быть выбрано (нажато) несколько кнопок.
Варианты отбора элементов распределены между кнопками следующим образом:
Рис. 3.16. Диалоговое окно для выбора отображаемых в дереве элементов
Поле ввода запроса Find (Найти) предназначено для ввода имени элемента фильма, который требуется найти. По мере ввода имени визуальное представление дерева изменяется таким образом, чтобы искомый элемент был виден в окне Movie Explorer.
Кнопка меню открывает контекстное меню обозревателя (рис. 3.17). С его помощью вы можете указать действие, которое требуется выполнить над выбранным в дереве элементом.
В меню также содержатся команды управления форматом дерева структуры. В частности, можно запретить отображение ветви Symbol Definition. Меню является контекстно-зависимым: перечень доступных команд зависит от того, элемент какого типа выбран в данный момент.
Рис. 3.17. Контекстное меню панели Movie Explorer
Средства поддержки пользователя, входящие в состав пакета Flash MX, предназначены для сокращения времени на изучение технологии работы с пакетом, а также для повышения удобства работы и производительности труда пользователей.
Достижению первой цели служит развитая система помощи, реализованная в нескольких формах:
Удобство работы и производительность труда пользователя существенно зависят от того, насколько удачно организована рабочая среда, которую предоставляет приложение. При всем желании разработчиков удовлетворить потребности максимального числа потенциальных пользователей, угодить всем просто невозможно. Здесь сказываются и уровень подготовки, и личные качества пользователей, и, кроме того, особенности конкретного фильма. Поэтому создатели Flash предуcмарели возможность настройки пользователями рабочей среды редактора под себя, любимого.
Некоторые аспекты настройки пользователем рабочей среды были упомянуты в предыдущем подразделе, другие пока не были названы. К числу наиболее часто используемых относятся:
В первой главе было отмечено, что возможность автоматического выбора конфигурации рабочей среды - это одно из новшеств Flash MX. Во многих случаях оно может действительно оказаться весьма полезным. Предусмотрено три конфигурации: для дизайнера (Designer), для разработчика (Developer) и универсальная конфигурация (General). Если вы хотите предварительно получить краткую характеристику каждой конфигурации, выберите в меню Help основного окна команду Welcome (Добро пожаловать). При этом на экране появится диалоговое окно, созданное с помощью Flash. Оно содержит своеобразное меню из трех пунктов, соответствующих определенной конфигурации. При наведении указателя на пункт меню (без щелчка) вид окна изменяется (рис. 3.18). Щелкнув мышью на пункте меню, вы сможете получить более развернутую информацию.
Чтобы перейти в режим настройки конфигурации, необходимо:
После выбора любой из предопределенных конфигураций она может быть скорректирована посредством закрытия лишних или, наоборот, вызова недостающих панелей. Полный перечень всех доступных панелей содержится в меню Window основного окна.
Скомпоновав панели в соответствии со своими предпочтениями, вы можете сохранить выбранную конфигурацию на диске для использования в последующих сеансах работы. Для сохранения конфигурации необходимо:
Рис. 3.18. Справочное окно для выбора требуемой конфигурации
Описание пользовательской конфигурации панелей сохраняется в одноименном файле на жестком диске в папке Flash MX\First Ruu\Panel Sets. Поэтому название конфигурации должно удовлетворять требованиям к выбору имен файлов той системы, с которой вы работаете. Конфигурация, созданная последней, будет загружена автоматически при последующем запуске Flash MX.
Рис. 3.19. Сохранение пользовательской конфигурации панелей
Названия всех созданных конфигураций включаются в каскадное меню Panel Sets, которое уже упоминалось выше. Поэтому, если вы создали и сохранили несколько вариантов конфигурации, то для выбора одного из них необходимо войти в каскадном меню Panel Sets (рис. 3.20).
Рис. 3.20. Вызов пользовательской конфигурации
С распространением графического пользовательского интерфейса
подавляющее большинство реализуемых приложениями функций получили «мышиное» воплощение. Однако практика показывает, что для выполнения некоторых часто используемых команд значительно удобнее использовать так называемые «горячие клавиши» (Shortcut keys или Hotkeys). Во Flash MX пользователю разрешено назначать собственную комбинацию горячих клавиш. Такое назначение выполняется в специальном диалоговом окне, которое вызывается по команде Keyboard Shortcuts... (можно перевести как «Горячая клавиатура»), входящей в меню Edit (Правка). Окно содержит следующие элементы интерфейса (рис. 3.21).
Рис. 3.21. Окно назначения горячих клавиш
Раскрывающийся список Current Set (текущий набор) позволяет выбрать одну из предопределенных комбинаций горячих клавиш; эти комбинации могут оказаться привычными для пользователей следующих графических редакторов:
Кроме того, предусмотрены варианты раскладки Macromedia Standard и Flash 5.
Раскрывающийся список Commands (Команды) позволяет указать, для какого подмножества команд будет выполняться назначение; таких подмножеств четыре:
От выбранного варианта зависит перечень команд, отображаемых в расположенном ниже списке. Если выбран вариант Drawing Menu Commands, то в списке перечислены все меню основного окна Flash (File, Edit и т. д.). Чтобы добраться до содержимого любого из меню, достаточно щелкнуть мышью на крестике, расположенном слева от названия меню.
Список команд содержит перечень команд выбранной категории, а также текущее назначение горячих клавиш.
Текстовое поле Description (описание) используется для вывода комментария к выбранной в списке команде.
Кнопки Shortcuts (Горячие клавиши), обозначенные символами «+» и «-», позволяют добавить или удалить (соответственно) комбинацию горячих клавиш для выбранной в списке команды. Назначаемая комбинация должна быть введена с клавиатуры и отображается в текстовом поле Press Key (Нажмите клавишу). Чтобы вносимые изменения вступили в силу, требуется нажать кнопку Change (Изменить), расположенную правее.
Здесь необходимо сделать важное замечание. В исходном окне Keyboard Shortcuts кнопки Shortcuts, поле Press Key и кнопка Change «недееспособны». Прежде чем вносить изменения в текущее распределение горячих клавиш, необходимо создать дубликат файла описания. Дублирование выполняется с помощью кнопки Duplicate Set (Дублировать набор), расположенную в правом верхнем углу окна Keyboard Shortcuts (рис. 3.22). Щелкнув эту кнопку, вы увидите дополнительное диалоговое окно, в котором требуется ввести имя копии файла описания. После создания такого файла окно Keyboard Shortcuts относится уже к нему, и в этом окне доступны как описанные выше элементы назначения горячих клавиш, так и две дополнительные кнопки, расположенные рядом с кнопкой Duplicate Set.
Рис. 3.22. Назначение нового сочетания горячих клавиш
Итак, процедура назначения нового сочетания горячих клавиш состоит в выполнении следующих действий:
Если введенная комбинация не конфликтует с имеющимися, то в поле Press Key строка <empty> будет заменена заданной комбинацией; в этом случае требуется нажать кнопку Change, чтобы введенные изменения вступили в силу; в случае конфликта ниже поля Press Key появится предупреждающее сообщение; в такой ситуации можно изменить свой выбор.
Наряду с параметрами рабочей среды, пользователь может установить и некоторые другие параметры работы редактора. Такая установка выполняется с помощью специального диалогового окна, которое открывается при выборе команды Preferences (Установка параметров), входящей в меню Edit основного окна.
Окно Preferences содержит пять вкладок: General (Общие параметры), Editing (Параметры редактирования), Clipboard (Параметры буфера обмена), Warnings (Предупреждения) и ActionScript Editor (Параметры редактора ActionScript).
На начальных этапах работы с Flash MX вполне достаточно иметь представление о параметрах, размещенных на вкладках General и Clipboard. Остальные будут описаны в соответствующих главах.
Вкладка General содержит следующие элементы (рис. 3.23):
Рис. 3.23. Вкладка General окна Preferences
Вкладка Clipboard предназначена для установки параметров копирования объектов, помещаемых в буфер обмена. Пользователь может установить требуемые параметры для трех типов объектов (рис. 3.24):
Рис. 3.24. Вкладка Clipboard окна установки параметров Flash
В заключение рассмотрим команды настройки интерфейса, позволяющие изменять вид стола и рабочей области. Большинство таких команд включены разработчиками Flash в меню View (Вид):
Zoom In (Увеличить), Zoom Out (Уменьшить), Magnification (Увеличение размеров изображения) — для изменения масштаба изображения на столе (вместе с размером самой рабочей области);
Work Area (Рабочая область); если данная команда выбрана (о чем говорит маркер слева от ее имени), то окружающая стол рабочая область также становится интерактивной и может использоваться как часть стола; в частности, на ней можно рисовать, перемещать на нее символы при создании ключевых кадров анимации и т. д.; пример размещения объектов в рабочей области показан на рис. 3.25; подобное использование рабочей области полезно в тех случаях, когда требуется задать положение начального или конечного ключевого кадра за пределами стола; кроме того, установка этого режима необходима для использования инструмента Hand;
Rulers (Линейки), Grid (Сетка), Guide (Направляющие) - для включения соответствующих средств разметки стола и рабочей области; на рис. 3.26 показан вид стола при использовании линеек и включенной сетке.
Рис. 3.25. Допустимое размещение объектов при использовании интерактивной рабочей области
Все средства указанной категории доступны посредством соответствующих команд, входящих в меню Help основного окна. К ним относятся:
Рис. 3.26 Вид стола при использовании линеек и включенной сетке
На рис. 3.27 показан формат Flash-приложения, предоставляющего доступ к интерактивным урокам.
Рис. 3.27. Страница Flash-приложения, предоставляющего доступ к интерактивным урокам
С их помощью вы можете получить сведения и первичные навыки по следующим темам:
Следует отметить, что разработчики Flash MX рекомендуют начинать его изучение именно с освоения материала интерактивных уроков. Тем не менее, практика показывает, что более полное и цельное представление о возможностях редактора и особенностях работы с ним можно получить с помощью электронного учебника. Если, разумеется, у вас по какой-то причине не оказалось с собой книжки, которую вы держите сейчас в руках.