WWW.DISSERS.RU

БЕСПЛАТНАЯ ЭЛЕКТРОННАЯ БИБЛИОТЕКА

   Добро пожаловать!

Pages:     | 1 |   ...   | 2 | 3 || 5 | 6 |   ...   | 11 |

«Этан Уотролл, Норберт Этан Уотролл, Норберт Гербер MX Москва • Санкт-Петербург • Нижний Новгород • Воронеж Ростов-на-Дону • Екатеринбург • Самара Киев • Харьков • Минск 2003 Краткое содержание Об ...»

-- [ Страница 4 ] --

Тестирование сцен Кнопка Edit Scene При щелчке на кнопке Edit Scene (рис. находящейся в правой части строки Scene and Symbol, вы получаете доступ к меню с именами всех сцен, имеющихся в фильме. Для перехода к нужной сцене выберите соответствующий пункт меню.

Панель Movie Explorer Как уже говорилось в главе 7, Movie (открыть которую можно с помощью Movie Explorer меню Window) служит для отображения иерар хической структуры фильма. С помощью панели можно осуществлять поиск символов и экземпляров символов, а также производить текста и шрифтов.

Поскольку фильм состоит из сцен, они представлены на панели Movie Explorer как элементы высшего порядка в иерархии.

Для перехода к определенной сцене найдите ее имя на панели Movie Explorer и вы полните щелчок.

СОВЕТ По умолчанию на панели Movie Explorer выводится содержимое только текущей сцены.

Чтобы одновременно просматривать содержимое всех сцен, из меню Options данной панели команду Show All Scenes (Показывать все сцены).

Тестирование сцен Вам уже известны способов тестирования созданного фильма. Для проверки результата непосредственно в среде разработки Flash можно нажать клавишу Return/Enter, но при этом возможности просмотра будут ны только текущей сценой. Последовательное воспроизведение всех сцен воз можно только после публикации фильма, при этом уже не требуется среда Flash.

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

Для тестирования сцены выберите ее на панели Scene и нажмите клавишу Return/Enter либо после выбора сцены откройте меню Control и акти визируйте команду Test Scene.

Для тестирования фильма целиком выберите команду Test Movie меню Control либо используйте комбинацию клавиш При этом откро ется новое окно, где все сцены фильма будут воспроизводиться в последова тельности, определенной на панели Scene.

Воспроизвести все сцены фильма можно также, выбрав команду Play АН Scenes меню Control.

206 4 Глава Использование сцен при работе с анимационными фильмами Возможности управления сценами с помощью сценариев ActionScript Использование сцен значительно облегчает общую организацию содержимого фильма, заданная последовательность воспроизведения сцен приводит к созда нию фильмов. Но наряду с рядом преимуществ (например, две сцепы не могут воспроизводиться в этом есть и свои недостатки, свя занные с невозможностью изменить сцен. Эту пробле му можно решить, используя сценарии ActionScript (в действия кад ров), которые позволяют управлять сценами и изменять их порядок.

Более подробно о сценариях языка ActionScript и использовании действий кад ров будет рассказано в главе 12. В этом же разделе речь пойдет о возможностях использования некоторых действий, с помощью которых можно управлять сце нами.

Вызов действия ay приводит к переходу головки вос произведения к определенной сцене и кадру. Воспроизведение фильма про должается с этого кадра.

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

Это действие позволяет продолжить воспроизведение фильма после остановки.

С помощью данного действия можно остановить воспроизведение фильма.

Разработки Сцены позволяют разбить содержимое фильма и сам творческий процесс разра ботки на логические управляемые блоки. выделить какой-либо проект в качестве примера эффективного использования сцен, поскольку это присуще сотням Web-узлов, созданных базе Flash. Одним из них является Web-узел компании Media (www.mondomedia.com).

Компания Mondo Media была создана для разработки и распространения в сети Интернет развлекательных созданных на основе анимации. Среди са мых известных разработок компании можно назвать такие небольшие анимаци онные фильмы, как Thugs on Film (Головорезы в кино), The God and Devil Show (Шоу Господа и дьявола) и Heavy Metal Guy (Металлист). Продукты Mondo Media пользуются большой благодаря этому компания стала од ним из лидеров в области создания развлекательных продуктов для Интернета.

Web-узел компании Mondo Media (рис. был создан на основе технологии Flash с использованием сцен. Разделы Web-узла, содержащие неболь шие фильмы (Mondo Mini Shows), представляют собой миниатюрные Web-уз лы. Рекомендуем Web-узел компании Mondo Media как прекрасный пример ис пользования сцен для организации хранения и доступа к содержимому.

Резюме 4 fie Edit View Favorite Mail.

Ivy Рис. Web-узел компании Media Резюме В этой главе речь шла об использовании сцен как о методе разделения содержи мого фильма на логические части. Кроме того, вы узнали, что сцены позволяют создавать интерактивные продукты, где пользователь может определить необхо димую для воспроизведения часть фильма. Вы познакомились с общими прин ципами функционирования сцен в фильме, а затем научились создавать их и ма нипулировать ими с помощью панели Scene, переключаться между сценами и воспроизводить их. В конце главы мы вас с возможностями управ ления с использованием сценариев Практикум Создание сцены полета космической ракеты Данный предоставляет возможность совершить импровизированное космическое путешествие. Мощные средства Flash помогут вам создать анима цию полета космической ракеты. Для выполнения этой задачи понадобятся все знания и практические полученные при изучении части 3 данной книги.

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

Файлы с изображением всех объектов, используемых в данном фильме, а также копия готового фильма (файлы и находятся на прилагаемом компакт-диске в каталоге Hands On 3.

Изображение космического корабля Выполнение учебного задания начните с создания первой сцены — старта косми ческого корабля с Земли.

1. Создайте новый файл, выбрав команду New меню File.

2. В диалоговом окне Document Properties, которое можно открыть выбором коман ды Document меню измените частоту смены кадров, установив значе ние 15. В качестве фонового выберите черный цвет.

3. Щелкните на кнопке ОК.

4. На панели Tools выберите инструмент Rectangle.

5. Откройте цветовую палитру, щелкнув на образце цвета обводки Stroke Color.

Затем нажмите кнопку No Color (Нет цвета), расположенную справа на панели Tools и обозначенную красной наклонной линией. После этого форма, созда ваемая с помощью инструмента Rectangle, не будет иметь обводки.

6. Щелкните на образце цвета заливки Fill Color и выберите в открывшейся па литре коричневый или зеленый цвет. Создаваемый прямоугольник будет ис пользоваться в качестве изображения земной поверхности.

7. С помощью инструмента Rectangle создайте который должен занимать приблизительно треть области действия.

8. Присвойте существующему слою имя ground (Земля).

СОВЕТ Вы можете фантазию и дополнить рисунок, изображающий поверхность Зем ли, различными объектами — строениями, деревьями и т. д.

Изображение космического корабля 9. Создайте новый слой, назвав его background. Оставшуюся часть области действия займет фон неба светло-голубого цвета, созданный также с помощью инструмента Rectangle.

На данном этапе экран должен соответствовать рисунку, приведенному ниже.

10. Теперь необходимо присвоить имя вашей первой сцене. Откройте панель Scene посредством выбора команды Scene меню Window, выполните двойной щелчок на имени сцены (ваш фильм пока содержит сцену Scene 1) и введите имя takeoff (старт).

Следующий шаг — импортирование всех графических объектов, которые бу дут использоваться в сцене. Выберите команду New Symbol меню Insert. В от крывшемся диалоговом окне New Symbol введите в поле Name имя rocket (ракета). Убедитесь также, что переключатель типа символа установлен в по ложение Graphic (Графический) и щелкните на кнопке ОК.

12. При включенном режиме редактирования символа выберите в меню File ко манду Import, после чего откроется одноименное диалоговое окно. В этом окне найдите и откройте на компакт-диске каталог Hands On 3, выберите файл и щелкните на кнопке Open. Изображение космической ракеты будет помещено на область действия в режиме редактирования символа.

(При импортировании сложных графических рисунков некоторые элементы изображения могут появиться как отдельные части, в этом случае их необхо димо сгруппировать. Но в нашем примере все части изображения ракеты уже сгруппированы.) Иногда Flash не помещает рисунок в центр окна редактора символов. Если после им портирования изображение объекта не появилось в окне редактора символов, исполь зуйте полосы прокрутки, а затем с помощью инструмента Arrow выберите изображение и переместите его мышью в центр окна. Помните, что небольшой крестик в центре окна обозначает точку регистрации объекта.

13. На данном этапе необходимо превратить статическое изображение ракеты в клип, демонстрирующий, как из сопел ракетных двигателей вырывается пламя.

Прежде всего, выберите в окне библиотеки графический символ с изображе нием ракеты. Откройте меню Options и выберите пункт Properties. В качестве альтернативы после выбора символа щелкните на кнопке Properties, располо женной в нижней части окна библиотеки.

14. Когда откроется диалоговое окно Symbol Properties, установите переключатель типа символа в положение Movie Clip (Клип) и щелкните на кнопке ОК. Теперь необходимо добавить изображение пламени.

15. Присвойте существующему слою имя rocket ship (помните, что вы продол жаете работать с клипом в режиме редактирования символа).

16. Создайте новый слой и назовите его (пламя).

17. Переместите слой ниже слоя rocket ship.

• Практикум 18. Выберите кадр 5 слоя rocket и произведите вставку кадра, используя ко манду Frame меню Insert.

19. Теперь выберите кадр 2 слоя flames и вставьте ключевой кадр командой Keyframe меню Insert. Почему первый ключевой кадр будет содержать только изображение ракеты без пламени из сопел двигателей мы позже.

20. Выберите второй ключевой кадр (который вы добавили) и нарисуйте пламя, используя инструмент Pencil. Для соз дания заливки используйте инструмент Paint Bucket с крас ным цветом. Изображение должно выглядеть, как показа но на следующем рисунке.

21. Щелкните на кадре 3 слоя и вставьте ключевой кадр, выбрав команду Keyframe меню Insert.

22. Теперь, щелкнув на кадре 4 слоя вставьте пустой ключевой кадр, ис пользуя команду Blank Keyframe меню Insert.

инструментов Pencil и Paint Bucket подробно описано в главе 4.

23. Выберите только что созданный пустой ключевой кадр и нарисуйте дополнительные языки пламени. Изображение пламени должно быть похоже на предыдущее, но не иден тично ему. Для заливки выберите оранжевый цвет. Изо бражение должно выглядеть, как показано на рисунке ниже.

24. Щелкните на кадре 5 слоя и вставьте ключевой кадр, выбрав команду Keyframe меню Insert. Поскольку клип в фильме будет воспроизводиться не прерывно, изменение изображения пламени создаст эффект горения.

25. На данном этапе необходимо вставить клип rocket в кадры сцены запус ка ракеты Для этого нужно выйти из режима редактирования симво ла, щелкнув на имени сцены в строке Scene and Symbol.

26. Вставьте новый слой и назовите его rocket ship.

27. Выберите первый ключевой кадр слоя rocket ship и с помощью мыши перетащите клип из окна библиоте ки на область действия. Расположите изображение приблизительно в центре области действия. Сцена должна выглядеть, как показано на рисунке.

28. Выберите кадр 30 слоя background и вставьте ключевой кадр, используя ко манду Keyframe меню Insert. Теперь объясним, почему при создании клипа мы оставили первый ключевой кадр слоя f ames без изображения пламени. Если бы этого не было сделано, при помещении клипа на область действия ракета изображалась бы с работающими двигателями. Но пустого. ключевого кадра позволяет создать эффект запуска двигателей при старте.

29. Выберите кадр 30 слоя ground и вставьте кадр, используя команду Frame меню Insert или нажав клавишу F5.

Отправление и удаление от Земли 30. Теперь выберите кадр 30 слоя rocket и вставьте ключевой кадр командой Keyframe меню Insert.

31. На этом этапе выберите кадр 30 слоя rocket ship и переместите изображение ракеты вверх за пределы области действия.

32. Выберите первый ключевой кадр слоя rocket ship и создайте промежуточные кадры выбрав команду Create Motion Tween меню Insert.

33. Чтобы старт ракеты выглядел более реально, выберите первый ключевой кадр слоя rocket откройте панель Properties, используя команду Properties меню Window, и установите в поле Ease (Замедлять ход) значение -100. При этом создается эффект медленного старта и постепенного движе ния ракеты при подъеме.

34. файл, выбрав команду Save меню File. Когда появится диалоговое окно Save, выберите каталог, где вы хотите сохранить файл, введите имя в поле Name и щелкните на кнопке Save.

35. Для проверки сцены, нажмите клавишу Return/Enter. Если вы хотите, чтобы при воспроизводился клип, выберите команду Test Movie меню Control.

Отправление и удаление от Земли Теперь можно приступать к созданию второй сцены анимации. Вы продолжите космическое путешествие и разработаете сцену, в которой ракета уходит далеко в космическое пространство, все дальше и дальше удаляясь от Земли. Здесь по требуется проявить мастерство для создания иллюзии расстояния и глубокого космического пространства.

1. Откройте файл 2. Выберите команду Scene меню Window, чтобы открыть панель Scene. Добавьте еще одну сцену, щелкнув на кнопке Add Scene (в нижней части панели Scene) либо выбрав команду Scene меню Insert.

3. Выполните двойной щелчок на имени созданной сцены и назовите ее depar ture (отправление).

4. Выберите сцену departure.

5. Чтобы сделать изображение космического пространства темным, откройте меню Modify и выберите команду Document. Щелкните на образце цвета фона Back ground Color и с помощью открывшейся палитры цветов выберите черный цвет.

6. Теперь необходимо создать изображение звезд, разбросанных в космическом пространстве. Выберите команду New Symbol меню Когда откроется диалоговое окно Create New Symbol, введите в поле Name имя (звезда), ус тановите переключатель типа символа в положение Graphic и щелкните на кнопке ОК.

7. После переключения в режим редактирования символа выберите Ellipse и нарисуйте небольшой кружок желтого цвета. Убедитесь, что его об водка также желтая. Как обычно, вам возможность проявить 212 Практикум фантазию — сделать изображения звезд разнообразными, создать другие кос мические объекты и т. д. Все зависит от вашего воображения.

8. Завершив создание изображения звезды, которое в дальнейшем будет много кратно использовано в сцене, возвратитесь к главной временной шкале.

9. На данном этапе необходимо импортировать графическое Зем ли, которое вы будете использовать. Выберите команду New Symbol меню Insert. В открывшемся диалоговом окне Create New Symbol введите в поле Name имя earth (Земля), установите типа символа в Graphic и щелкните на кнопке ОК.

10. После перехода в режим редактирования символа откройте диалоговое окно Import, выбрав команду Import меню File. В этом окне найдите и откройте на компакт-диске каталог Hands On 3, выберите файл и щелкните на кнопке Open.

Используйте кнопку Edit Scene для перехода к сцене departure. кнопка в правой части строки Scene and Symbol.

12. Присвойте единственному слою имя stars (звезды).

13. Откройте окно библиотеки, активизировав команду Library меню Window, вы берите первый ключевой кадр и с помощью мыши несколько раз (количество звезд определите самостоятельно) перетащите символ с изображением звез ды на область действия.

14. Теперь добавьте еще один слой, выбрав команду Layer меню Insert или щелк нув кнопке Insert Layer, расположенной в правом нижнем углу временной шкалы. Выполните двойной щелчок на имени слоя и введите имя earth. В ка честве альтернативы выполните двойной щелчок на значке слоя, расположен слева от его имени. При этом откроется диалоговое окно Layer Properties, где в поле Name нужно ввести имя 15. С помощью мыши перетащите символ earth (с изобра жением Земли) из окна библиотеки на область дейст вия в левый нижний угол. На данном этапе сцена должна выглядеть, как показано на рисунке.

16. Создайте третий слой и назовите его rocket 17. Выберите первый ключевой кадр слоя rocket ship, перетащите клип rocket из окна библиотеки на область действия. (Данный клип был создан в предыдущем разделе.) 18. Размер и ориентация клипа не подходят для данной сцены, димо внести некоторые Прежде всего, выберите симво ла с изображением ракеты и зеркально отразите его по горизонтали, выпол нив последовательность команд Modify Transform Flip Horizontal.

19. На панели Tools выберите инструмент Free Transform и в секции Option нажми те кнопку Rotate and Skew (Вращение и наклон).

20. Поверните изображение ракеты приблизительно па 45° по часовой стрелке.

В качестве альтернативы используйте панель Transform, открыть которую можно с помощью команд Window Panels Transform.

Отправление и удаление от Земли Установите переключатель в положение Rotate (Вращение) и введите в поле Rotate Value (Угол вращения) значение 45.

21. Убедитесь, что выбран первый ключевой кадр. Уменьшите изображение раке ты с помощью инструмента Free Transform или панели Transform. Зрителю должно казаться, что в начале полета ракета находится далеко. Во время дви жения она будет увеличиваться в размерах, как бы приближаясь из глубины пространства.

22. Используя инструмент Arrow, переместите экземпляр символа с уменьшен ным изображением ракеты ближе к центру изображения Земли.

23. После помещения на сцену всех необходимых элементов можно приступать к созданию анимации. Выберите кадр 35 слоя stars и вставьте кадр, активизи ровав команду Frame меню Insert.

24. Выберите кадр 35 слоя earth и вставьте кадр, используя ту же команду.

25. Теперь выберите кадр 35 слоя rocket и вставьте ключевой кадр командой Keyframe меню Insert.

26. Выберите только что созданный ключевой кадр слоя rocket ship. С помощью мыши перетащите изображение ракеты в правый верхний угол за пределы об ласти действия.

27. Используя инструмент Free Transform или па нель Transform, увеличьте изображение раке ты таким образом, чтобы оно стало несколько больше исходного. Убедитесь, что после уве личения изображение полностью находится за пределами области действия. Все эти дей ствия приведут к созданию эффекта удаления ракеты от Земли. На данном этапе кадр должен выглядеть, как показано на рисунке.

Выберите первый ключевой кадр слоя rocket ship и создайте промежуточные кадры движения ракеты, используя команду Create Motion Tween меню Insert.

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

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

29. Выберите первый ключевой кадр слоя rocket ship и добавьте направляющую движения, щелкнув на кнопке Add Motion Guide, расположенной в нижнем ле вом углу временной шкалы.

30. Выберите первый ключевой кадр слоя motion guide (направляющая движе ния) и с помощью инструмента Line создайте траекторию ракеты:

от середины изображения Земли и за пределы правого верхнего угла области действия. Фоновый цвет данной сцены черный, поэтому для линии выберите яркий цвет, используя образец цвета обводки Stroke Color, либо сделайте линию 214 • Практикум черного цвета, но при этом временно измените фоновый цвет документа, вы брав команду Modify Document и щелкнув на образце цвета фона Background Color.

31. Выберите первый ключевой кадр слоя rocket и с помощью инструмента Arrow переместите изображение ракеты таким образом, чтобы точка регистра ции символа совпала с началом траектории движения. Поскольку изображе ние ракеты в первом ключевом кадре небольшое, вам может понадобиться ин струмент Zoom.

32. Выберите последний ключевой кадр слоя rocket и, используя инструмент Arrow, переместите изображение ракеты таким образом, чтобы точка регистра ции совпала с окончанием траектории движения. Если у вас возникнут труд ности при совмещении точки регистрации экземпляра символа с направляю щей движения, проверьте, активизирована ли команда Snap to Objects (При вязка к объектам) меню View. Кроме того, прежде чем перемещать объект, удерживайте левую кнопку нажатой в течение нескольких секунд.

33. Выберите первый ключевой кадр слоя и откройте панель Properties, активизи ровав одноименную команду меню Window.

34. Установите флажок Orient to Path и введите значение в поле Ease. Это при ведет к тому, что ракета всегда будет соответственно траекто рии полета. Кроме того, в начале движения скорость ракеты будет меньше, чем в конце, а это создаст иллюзию пространства.

35. Теперь для создания эффекта удаления необходимо изображе ние Земли. Щелкните на кадре 35 слоя earth и вставьте ключевой кадр, вы брав команду Keyframe меню Insert.

36. Убедитесь, что выбран только что созданный ключевой кадр. Используя ин струмент Arrow, выберите и переместите изображение Земли в левый нижний угол за пределы области действия. С помощью инструмента Free Transform или панели Transform уменьшите размеры изображения Земли в несколько раз. При просмотре анимации у зрителя должно создаваться впечатление, что Земля удаляется.

37. Выберите первый ключевой кадр слоя earth и, используя команду Create Motion Tween меню Insert, создайте промежуточные кадры.

Создание второй сцены завершено. Для ее проверки нажмите клавишу Re turn/Enter. Если вы хотите, чтобы при тестировании воспроизводился клип, акти визируйте команду Test Scene меню Control. Выбрав команду Test Movie этого же меню, можно просмотреть весь фильм, включая первую сцену.

Путешествие в космосе Теперь можно приступать к созданию новой сцены, в которой космический ко рабль путешествует в космосе.

1. Откройте файл 2. Выбрав команду Scene меню Window, откройте панель Scene и добавьте третью сцену, щелкнув на кнопке Add Scene (в нижней части панели Scene) либо вы брав команду Scene меню Insert.

Путешествие в космосе 3. Выполните двойной щелчок на имени только что сцены и переиме нуйте ее в travel (путешествие).

4. Выберите пока еще единственный слой на временной шкале и присвойте ему имя stars (звезды). Выберите кадр 30 и командой Frame меню Insert вставьте кадр.

5. Выберите первый ключевой кадр слоя stars, откройте окно библиотеки и с помощью мыши перетащите несколько раз символ с изображением звезды на область действия, как при разработке предыдущей сцены.

6. Теперь необходимо создать изображение планеты, рядом с которой будет пролетать космический корабль. Выберите команду New Symbol меню Insert.

Когда откроется диалоговое окно Create New Symbol, установите переключа тель типа символа в положение Graphic, введите в поле Name имя anet 1 и щелкните на кнопке ОК.

7. Переключившись в режим редактирования символа, откройте меню File и берите команду Import. После появления одноименного диалогового окна най дите и откройте каталог Hands On 3 на компакт-диске, выберите файл net и щелкните на кнопке Open.

8. Переместите изображение к его точке регистрации в окна редактора символа.

9. Выйдите из режима редактирования символа и на основную вре менную шкалу. Создайте новый слой, щелкнув на Insert Layer или вы брав команду Layer меню Insert, и присвойте ему имя anet.

10. Выберите первый ключевой кадр слоя и с помо щью мыши перетащите символ planet 1 с изображени ем планеты из окна библиотеки па область действия.

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

11. Теперь необходимо изображение ты. Выберите кадр 30 слоя anet и вставьте ключевой кадр, используя коман ду Keyframe меню Insert.

12. Выберите только что ключевой кадр и с инструмента Arrow переместите изображение планеты влево примерно на 4 сантиметра. Да лее щелкните на первом ключевом кадре слоя planet и выберите команду Create Motion Tween меню Insert. Будет создан эффект полета ракеты на боль шой скорости.

13. Создайте слой и его rocket 14. Выберите первый ключевой кадр слоя roc ket и с помощью мыши перетащите клип rocket из окна библиотеки на ра бочую область слева от области действия.

С помощью инструмента Free Transform или панели Transform расположите ракету гори зонтально. данном этапе сцена должна выглядеть, как показано на рисунке.

Практикум 15. Выберите кадр 30 слоя rocket и вставьте ключевой кадр, используя ко манду Keyframe меню Insert.

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

17. Выберите первый ключевой кадр слоя rocket и, команду Create Motion Tween меню Insert, создайте промежуточные кадры ракеты.

Вы завершили создание анимации, в которой космический корабль путешеству ет в космосе. Для проверки сцены нажмите клавишу Return/Enter. Если вы хотите, чтобы при тестировании воспроизводился клип, активизируйте команду Test Scene меню Control. Выбрав команду Test Movie этого же меню, можно просмотреть весь фильм, включая первую и вторую сцены.

Приближение к планете X Теперь вам предстоит создать сцену, в которой космический корабль приближа ется к конечному пункту своего путешествия — планете X.

1. Откройте файл 2. Выбрав команду Scene меню Window, откройте панель Scene и добавьте четвер тую сцену, щелкнув на кнопке Add Scene (в нижней части панели Scene) либо активизировав команду Scene меню Insert.

3. Выполните двойной щелчок на имени только что созданной сцены и переиме нуйте ее в descent (снижение).

4. Выберите пока еще единственный слой на временной шкале и присвойте ему имя stars (звезды). Выберите кадр 30 и, используя команду Frame меню Insert, вставьте кадр.

5. Щелкните на первом ключевом кадре слоя stars, откройте окно библиотеки и с помощью мыши перетащите раз символ с звезды на область действия, как при предыдущих сцен.

6. На данном этапе необходимо создать изображение планеты X. Выберите ко манду New Symbol меню Insert. Когда откроется диалоговое окно Create New Symbol, установите переключатель типа символа в положение Graphic, введите в поле Name имя planet 2 и на кнопке ОК.

7. Переключившись в режим редактирования символа, откройте меню File и вы берите команду Import. После появления одноименного диалогового окна най дите и откройте каталог Hands On 3 на компакт-диске, выберите файл pl a net и щелкните на кнопке Open.

8. Переместите изображение к его точке регистрации в центре окна редактора символа.

9. Выйдите из режима редактирования символа и перейдите на основную вре менную шкалу. Создайте новый слой, щелкнув на кнопке Insert Layer или вы брав команду Layer меню Insert, и присвойте ему имя x.

10. Выберите первый ключевой кадр созданного слоя и с помощью мыши перета щите символ planet 2 с планеты из библиотеки в правый Приближение к планете X нижний угол на область действия. Поскольку изобра жение планеты слишком большое, уменьшите его с по мощью инструмента Free Transform или панели Trans form до размера примерно 123x123 На данном этапе сцена должна выглядеть, как показано на рисунке.

12. Выберите кадр 30 слоя x и вставьте ключевой кадр, используя команду Keyframe меню Insert.

13. Щелкните на последнем ключевом кадре только что созданного слоя 2, выберите экземпляр символа 2 и с помощью инструмента Free Transform или панели Transform увеличьте размер изображения, как показано на следующем рисунке.

14. Затем щелкните на первом ключевом кадре слоя pl a net х и выберите команду Create Motion Tween меню Insert.

15. Создайте новый слой и присвойте ему имя rocket ship.

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

17. Используя инструмент Free Transform или Trans form, поверните изображение ракеты таким образом, чтобы ее нос был направлен к На данном эта пе сцена должна выглядеть, как показано на рисунке ниже.

18. Выберите кадр 30 слоя rocket и командой Keyframe меню Insert вставьте ключевой кадр.

19. Щелкните на только что созданном ключевом кадре и поместите изображение ракеты над изображением пла неты. Используя инструмент Free Transform или панель Transform, уменьшите изображение ракеты. Теперь сце на должна выглядеть, как показано на рисунке.

20. Щелкните на первом кадре слоя rocket shi p и выберите команду Create Motion Tween меню Insert.

21. Вновь, как при создании первой сцены, может возник нуть несоответствие между направлением носа ракеты и ее движения во время полета. Для устранения этого недостатка опять создайте направляющую движения.

22. Выберите первый ключевой кадр слоя rocket shi p и щелчком на кнопке Add Motion Guide, расположенной в нижнем левом углу временной шкалы, добавьте направляющую движения.

23. Щелкните на первом ключевом кадре слоя motion guide (направляющая дви жения) и с помощью инструмента Line создайте траекторию движения ракеты.

Практикум 24. Выберите первый ключевой кадр слоя rocket shi p с помощью инструмента Arrow переместите изображение ракеты так, чтобы точка символа совпала с началом траектории движения.

25. Затем выберите ключевой кадр слоя rocket shi p и, пользуясь этим же инструментом, переместите изображение ракеты таким образом, чтобы точка регистрации совпала с окончанием траектории движения.

26. Теперь щелкните на первом ключевом кадре слоя rocket shi p и откройте па нель Properties, выбрав одноименную команду меню Window.

27. Установите флажок Orient to Path и введите значение -100 в поле Ease. Теперь ракета всегда будет ориентирована соответственно траектории полета. Кроме того, в начале скорость ракеты будет больше чем в что соз даст иллюзию глубокого пространства.

Вы завершили создание анимации, в которой космический корабль ся к X. Для проверки сцены нажмите клавишу Return/Enter. Если вы хо тите, чтобы при тестировании воспроизводился клип, активизируйте команду Test Scene меню Control. Выбрав команду Test Movie этого же меню, можно про смотреть весь фильм.

Конечная сцена Итак, первые четыре сцепы созданы. В последней сцене вы создадите эффект, присущий голливудским фильмам.

1. Откройте файл 2. Выбрав команду Scene меню Window, откройте панель Scene и добавьте пятую сцену, щелкнув на кнопке Add Scene (в нижней части панели Scene) либо активизировав команду Scene меню Insert.

3. Выполните двойной щелчок на имени только что созданной сцены и переиме нуйте се в f i nal e (конец).

4. Выберите команду New Symbol меню Insert.

5. Когда откроется диалоговое окно Create New Symbol, установите переключа тель типа символа в положение Graphic, введите в поле Name имя То Be Conti nued и щелкните на кнопке ОК.

6. На панели Tools выберите инструмент Text.

7. До ввода каких-либо символов откройте панель Properties, выбрав одноимен ную команду меню Window.

8. На панели Properties откройте список Font, выберите подходящий шрифт и за дайте размер в ноле Size.

9. Поскольку фоновый цвет фильма черный, для символов надписи выберите один из светлых цветов, например белый.

10. Щелкните на области действия и введите надпись То Be Continued.

Конечная сцена Переместите указатель мыши за пределы текстового поля и выполните щел чок. С помощью инструмента Arrow выровняйте текстовое поле в окне редак тора символа. Если края символов получатся ступенчатыми, выберите текст, откройте меню View и активизируйте команду Antialias Text (Сглаживать текст).

12. Теперь создайте эффект плавного исчезновения надписи. Для этого переклю читесь на основную временную шкалу и выберите первый ключевой кадр единственного слоя. (Можете присвоить слою какое-нибудь информативное имя, но поскольку в данной сцене используется только один слой, в этом нет необходимости.) 13. С помощью мыши перетащите символ с надписью То Be из окна биб лиотеки на центр области действия.

14. Щелкните на кадре 15 и вставьте ключевой кадр, активизировав команду Keyframe меню Insert.

15. Выберите только что созданный ключевой кадр и откройте панель Properties, активизировав одноименную команду меню Window.

16. Откройте список Color (Цвет) и выберите пункт Alpha (Прозрачность). В поле Alpha Value введите значение 0.

17. Щелкните на первом ключевом кадре и выберите команду Create Motion Tween меню Insert. При этом будет создан эффект медленного исчезновения текста надписи.

Если вы хотите, чтобы после воспроизведения всех сцен фильм не повторялся циклически, а был остановлен, добавьте действие кадра Более о действиях кадра будет рассказано в главе 12.

Поздравляем! Вы завершили создание последней сцены анимации. Для просмот ра созданного фильма целиком выберите команду Test Movie меню Control.

ЧАСТЬ Интерактивные фильмы В дискуссиях, посвященных созданию цифровых приложений, часто можно услышать термин интерактивность. Данное слово нередко встре чается в книгах, учебных пособиях и а также часто для оценки и определения категории создаваемого мультимедийного продукта. Ука занный термин начал характеристики модного, всеми употребляе мого слова. Создается угроза, что такое частое употребление может привести либо к потере первоначального смысла, либо к его искажению.

Так что же такое Collegiate Dic tionary дает определение интерактивности как «двухсторонней электронной сис теме связи... в которой в качестве информации передаются команды или Для начала нашей дискуссии такое определение вполне подхо дит — двухсторонняя связь между человеком и машиной. Однако какое это имеет отношение к Flash? В данном случае вам как создателю Flash-фильмов отводится главная роль, именно разработчик характер и параметры связи между фильмами и зрительской аудиторией. Ваша задача состоит в том, чтобы как именно фильм будет на запросы В данной части книги разговор пойдет об интерактивных свойствах создаваемых фильмов. Изучая возможности вы со множеством техник, обеспечивающих связь между аудиторией и Flash.

Глава 12. Базовые действия ActionScript Глава 13. Создание интерактивных элементов управления Глава Базовые действия До настоящего момента вы использовали Flash как инструмент для создания бы стро загружаемой графики и анимации. Однако с помощью Flash можно превра тить графические элементы в динамические компоненты игр, учебных фильмов и интерфейсов. Такие функциональные возможности фильмов Flash обеспечиваются благодаря использованию действий.

Действие — это набор команд, написанных языке ActionScript, который явля ется объектно-ориентированным языком сценариев Flash-фильмов. Действия указывают Flash, как именно должен воспроизводиться фильм. Действия могут быть как простыми (например, переход к определенному кадру и его воспроизве дение), так и достаточно сложными (допустим, выполнение вычислений и при нятие решений на основе полученного результата).

В этой главе рассматриваются следующие темы:

с панелью Actions;

работа с действиями объектов;

работа с действиями кадра;

связывание действий с объектами;

связывание действий с кадрами;

использование действий для создания основных элементов управления вос произведением фильма.

Действия Действия (Actions) — это одни из самых динамичных функций Flash, имеющиеся в распоряжении разработчика. Действия используются для создания интерак тивных элементов фильма и позволяют зрителям управлять ходом воспроизве дения фильма при помощи мыши или ввода соответствующих команд с клавиату ры. Используя действия, разработчик может установить определенный порядок сцен фильма, учитывая реакцию аудитории.

Чтобы использовать действия ActionScript, вам не нужно быть программистом.

Безусловно, при создании сложных сценариев опыт окажет ся Однако при написании сценариев ActionScript предыдущий опыт не является обязательным. Для выбора действий и связывания их с объектами фильма создатели Flash предусмотрели и понятный интерфейс — па нель Actions. С помощью данной панели вы получаете доступ к библиотеке ко манд ActionScript ), что позволяет вам значительно экономить время при вводе кода сценариев.

Таким образом, ActionScript — это язык программи рования, являющийся «родным» для среды Flash. В данном контексте термин * означает, что сценарии связываются с «объектами» или элементами фильма. Если во время воспроизведения фильма объекты принимают сообщение об определенном событии, их сценарии (или действия) выполняются. Например:

} В этом сценарии при наступлении события щелчка мыши press головка воспро изведения перейдет к кадру с меткой nextStop и воспроизведение продолжится с этого места. Другими словами, событие вызывает действие, которое изменяет порядок воспроизведения фильма.

Связь между событиями и действиями является главной особенностью объект но-ориентированного программирования. Если у вас нет опыта написания сце нариев либо вы совсем с программированием, такие формулировки могут вас несколько смутить. Однако не стоит впадать в унынье. Как только вы познакомитесь с действиями, синтаксис и структура языка ActionScript для вас менее загадочными.

Чтобы использовать действия для сценариев фильмов Flash, необхо димо прежде всего изучить панель Actions.

Знакомство с панелью Actions Панель Actions (Действия) — это интерфейс создания сценариев, которые будут выполняться во время воспроизведения Flash-фильма. Работать с панелью Ac tions можно в двух режимах: Normal (Обычный) и Expert (Эксперт). В режиме Normal пользователю доступны некоторые автоматические функции создания кода, поэтому данный режим рекомендуется для новичков. Работая в режиме Normal, вы можете создавать действия и добавлять их в фильм посредством вы бора соответствующих пунктов меню и перетаскивания элементов с помощью мыши. Режим Expert больше подходит для опытных разработчиков. В данном ре жиме панель Actions больше похожа на окно текстового редактора, в котором пользователь самостоятельно вводит код сценариев.

Чтобы открыть панель Actions, выберите команду Actions меню Window или на жмите клавишу F9.

Многие улучшения, появившиеся в новой версии Flash MX, связаны имен но с панелью Actions (рис. 12.1). Данная панель теперь обладает рядом но вых возможностей, которые значительно облегчают написание сценариев.

Ниже приведен перечень элементов панели Actions:

элементов ActionScript содержит раскрывающийся список категорий, с помощью которого вы получаете доступ к библиотеке ActionScript. Выбрав со ответствующее действие, вы можете с помощью мыши перетащить его на об ласть отображения сценария.

224 Глава Базовые действия ActionScript.

,. • • - Меню Options панели Actions Раскрывающийся :я,.

и p список сценариев !В SO 1 -Кнопка Launch ActionScript Reference Область элементов ТОВ ActionScript. ' "'.

- Кнопка Add a new to the Script : ' •. -' Кнопка Delete the Selected :

Область отображения параметров отображения Л • • • Рис. 12.1. Панель Actions отображения сценария служит для отображения всех строк-операторов текущего сценария. В режиме Expert данная область используется в качестве ок на ввода сценария.

отображения параметров служит для ввода специфической информа ции (например, номера кадра или имени сцены), которая будет вставлена в сце нарий. Область отображения параметров доступна для ввода только в режиме Normal. Информация, отображаемая в данной области, может быть свернута или развернута посредством щелчка на небольшом треугольнике в правой верхней части панели Actions.

Кнопки Add a new Item to the Script (Добавить новый элемент сценария) и Delete the Selected Action (Удалить выбранное действие) используются для добавления и удаления строк-операторов сценария ActionScript. При щелчке на кнопке Add a new Item to the Script открывается меню с элементами ActionScript. При щелчке на кнопке Delete the Selected Action удаляются все выделенные строки-операторы сценария.

Кнопки Up (Вверх) и Down (Вниз) используются для перемещения строк-опера торов в пределах окна отображения сценария.

Кнопка Insert Target Path (Указать путь к объекту) служит для доступа к диалого вому окну Insert Target Path. В данном окне отображается структура расположе ния клипов в вашем фильме. Вы можете выбрать экземпляр клипа (или кнопки), которым вы собираетесь управлять с помощью действий.

Ниже перечислены элементы панели Actions, появившиеся в новой версии Flash.

Раскрывающийся список сценариев позволяет переключаться между сценариями, связанными с различными элементами фильма. При выборе области действия элемента, которым можно управлять с помощью сценария, панель Actions автома тически переходит к отображению сценария, связанного с этим элементом. На пример, если выбран кадр, то в поле списка будет отображаться номер этого кадра, Действия а также имя и номер слоя, к которому относится данный кадр. Если на области действия выбран экземпляр или клипа, то в поле списка будет указано имя экземпляра, а также название родительского символа.

Меню View Options (Параметры отображения окна) позволяет переключаться ме жду режимами Normal и Expert, а также отображать или скрывать линейку с нуме рацией строк сценария. Более подробно о нумерации строк сценария мы расска жем в главе 14.

Кнопка Launch Reference позволяет получить доступ к окну панели Reference (Описание), с помощью которой можно получить справку и найти опи сание всех встроенных элементов языка ActionScript. Более подробно о работе с панелью Reference мы расскажем в главе 14.

Кнопка Script Pin используется для фиксации отображаемого сценария на панели Actions. Данное свойство позволяет отображать один сценарий на панели Actions при выборе различных элементов на области действия. Напомним, что в преды дущих версиях Flash на панели Actions мог отображаться только сценарий вы бранного в настоящий момент объекта.

Создание сценариев в режиме Normal Как уже отмечалось ранее, с панелью Actions можно работать в двух режимах:

Normal и Expert. В зависимости от сложности задания и уровня вашей подготовки выберите режим, который вам больше подходит. В табл. 12.1 представлены ос новные различия между двумя режимами работы с панелью Actions.

Таблица Поддерживаемые свойства при работе в режимах Normal и Expert свойство Режим Normal Режим Expert Поддержка функции перетаскивания из об- + ласти элементов ActionScript на область ото бражения сценария Использование области отображения пара- + метров для ввода данных Доступ к кнопкам добавления и удаления Доступна только кнопка строк-операторов сценария добавления строк-опера торов Доступ к кнопкам перемещения строк-опера- + торов Доступ к кнопке Insert Target Path + Использование раскрывающегося списка + + сценариев Доступ к кнопке Script Pin + + В общем, в режиме Expert ответственность за корректное написание сценария возлагается в основном на разработчика. И хотя некоторые функции остаются недоступными, для опытных пользователей режим Expert обеспечивает больше гибкости при написании сценариев. Более подробно о режиме Expert мы расска жем в главе 14.

226 Глава 12. Базовые действия ActionScript Режим Normal несколько ограничивает возможности разработчика, поскольку весь сценарий создается посредством выбора элементов меню с автоматическим вводом кода. Такая техника не требует глубоких знаний языка ActionScript и больше подходит для начинающих пользователей.

ПРИМЕЧАНИЕ — Средства Flash позволяют создавать сценарии, не содержащие ошибок. Кроме того, в процессе работы вы можете переключаться между режимами Normal и Expert, когда это необходимо.

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

1. Выберите команду Actions меню Window.

2. Выполните одно из следующих действий.

> Выполните щелчок на меню Options в верхнем правом углу панели Actions и выберите Normal Mode (Обычный режим).

> Воспользуйтесь комбинацией клавиш (Macintosh) или Ctrl+ (Windows).

3. Откройте меню View Options и выберите команду Normal Mode.

Работа с действиями объектов Во Flash-фильмах действия могут быть связаны с объектами двух типов: кнопка ми и клипами. Связанное действие выполняется тогда, когда объект принимает сообщение о события. Для кнопок эти сообщения в основном по ступают в виде сигналов от мыши или клавиатуры. Сообщения о событии клипа появляются в результате любых изменений или взаимодействий, которые про изошли с самим клипом. Когда вы связываете действие с объектом и создаете сценарий, вы определяете источник события для каждого объекта.

Действия связываются с кнопками и клипами, поскольку эти элементы являют ся интерактивными компонентами Flash-фильма. Как объекты, они могут при нимать события мыши, данные и другого типа информацию во время воспроиз ведения фильма. Структура, создаваемая с помощью объектов и связанных с ними действий, будет определять способ взаимодействия аудитории с филь мом.

Важно помнить, что кнопки и клипы хранятся в библиотеке Flash в виде симво лов. Каждый раз при использовании символов в фильме фактически использует ся отдельная копия символа, или его экземпляр. подробно об экземплярах символов мы рассказывали в главе 7.) Экземпляр можно рассматривать как копию символа. Любое изменение, которое произведено с никак не повлияет на родительский символ или на другие экземпляры этого символа. Тот же принцип сохраняется и при связывании действий с экземпляром символа. Любое действие, ассоциированное с экземпля ром символа, будет выполняться только тогда, когда в фильме используется дан ный экземпляр. Это означает, что действия связываются только с определенным экземпляром символа.

Действия Однако любое действие выполняется только тогда, когда в фильме происходит определенного рода событие. В языке (и во многих других объект но-ориентированных языках) действия управляются обработчиками событий.

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

Например, рассмотрим следующий сценарий:

} Каждый, кто хоть немного знаком с языком ActionScript, знает, что нет события с именем thisEvent и нет действия с именем Данный фрагмент кода — всего лишь демонстрация конструктора для событий и дей ствий. Обработчик события — это практически всегда первая строка-оператор.

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

Теперь вы знаете, что собой представляет обработчик события. Однако важно также понимать и суть самого события, когда и как оно происходит в контексте фильма. Как разработчику интерактивного продукта, вам необходимо знать и учитывать влияние каждого события на воспроизведение фильма. Например, если бы вы создавали интерактивный музыкальный микшер, какой бы обработчик события вы выбрали для кнопок, предназначенных для выключения и включе ния звуковых дорожек — нажатие кнопки мыши или отпускание кнопки мыши?

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

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

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

Работа с действиями кадра Как вы можете догадаться, действия кадров — это действия, связанные с кадрами вашего Flash-фильма. Действия кадров можно связывать только с ключевыми кад рами. Ключевые кадры используются для обозначения «точек» фильма, в которых 228 Глава 12. Базовые ActionScript происходят изменения как анимации, так и основных событий фильма. (Более подробно о ключевых кадрах речь шла в главе 9.) Если с ключевым кадром связано действие, то такой кадр на временной шкале можно узнать по небольшой букве а (рис. 12.2).

5 '. т действия кадра Рис. Действие кадра на временной шкале Посредством связывания действий с кадрами вы можете изменить способ вос произведения фильма. Рассмотрим следующий пример:

Если вы свяжете это действие с кадром 10, будет создан бесконечный цикл вос произведения кадров от 1 до 10. Такой режим будет продолжаться до тех пор, пока другое действие не изменит ход воспроизведения Flash-фильма.

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

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

Действия используются для управления схемой воспроизведения, интерактив ными свойствами, потоком и направлением воспроизведения фильма. Одним словом, с помощью действия можно точно определить порядок воспроизведения, а также реакцию фильма на пользовательский ввод. Благодаря действиям Flash меньше напоминает анимационную программу и в большей степени — среду раз работок интерактивных мультимедийных приложений. Вот лишь некоторые воз можности, которыми обладает Flash благодаря использованию действий.

Создание сложных, интерактивных схем навигации.

Изменение качества воспроизведения фильма.

Использование действий Связь с документами HTML, в Интернете, и обмен данными с приложениями сервера.

Обмен данными с хост-приложениями или другими Flash-фильмами.

Воспроизведение других фильмов в пределах главного фильма.

Связывание действий с объектами Связывание действий с объектами, такими как кнопки или клипы, — процесс достаточно простой. Однако при его выполнении следует помнить о некоторых вещах.

Прежде чем связывать действие, необходимо выбрать объект на временной шкале (или на области действия). Если ни один объект не выбран, все дейст вия на панели Actions будут недоступными.

Действия связываются только с конкретным экземпляром символа кнопки или клипа;

все другие экземпляры объекта остаются неизменными.

Важно произвести тестирование действия после его связывания. В режиме редактирования корректно могут работать только простые действия (такие как ay Чтобы протестировать действие, необходимо протестировать весь фильм. Выберите для этого команду Test Movie меню Control. (Более под робно о тестировании фильмов мы расскажем в главе 28.) Для связывания действий с объектами в режиме Normal выполните следующие действия.

1. Выберите объект на временной шкале или на области действия.

2. Активизируйте команду Actions меню Window или нажмите клавишу F9.

3. Когда откроется панель Actions, выполните следующие действия:

> Выберите действие в меню категорий области элементов > Установите параметры, требуемые для данного действия.

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

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

События мыши При связывании действия с экземпляром кнопки в режиме Normal Flash автома тически присваивает этому действию обработчик события мыши. Этот обработ чик определяет, какое событие при воспроизведении фильма будет иницииро вать выполнение действия (или действий), содержащихся в сценарии. Обработ чик события мыши определяется действием on В большинстве случаев опти мальным будет обработчик, установленный по умолчанию. Однако, если в этом есть необходимость, вы можете обработчик события мыши.

230 Глава 12. Базовые действия ActionScript Для установки или изменения обработчика события мыши, выполните щие действия.

1. Выберите кнопку, с которой необходимо связать действие либо для которой необходимо изменить обработчик событий.

2. Откройте панель Actions и выполните одно из следующих действий.

> Если вы хотите установить обработчик события мыши, выберите действие () из категории Actions Movie Control.

> Если вы хотите изменить обработчик события мыши для уже существую щего действия, выберите строку-оператор, содержащую название события, и на области отображения параметров установите соответствующий флажок.

При работе в режиме Normal вы можете добавить действие в сценарий четырьмя раз личными способами. Найдите действие в меню категорий области элементов Action Script и выполните на его значке двойной щелчок. 2. С помощью мыши перетащите зна чок действия из области элементов ActionScript на область отображения сценария.

3. Щелкните на кнопке Add (+) и выберите действие в меню. 4. Введите с клавиатуры комбинацию символов, соответствующую требуемому действию. Для отображения на бора клавиш, соответствующих каждому действию, в области элементов ActionScript панели Actions откройте меню Options названной панели и активизируйте команду View Esc Shortcut Keys.

3. В области параметров отображается список различных обработчиков собы тия мыши. Установите флажок рядом с названием соответствующего обра ботчика, и ваш сценарий автоматически будет На рис. 12.3 показан внешний вид панели Actions, когда в области отображения сценария выбрана строка-оператор, содержащая обработчик события.

Рис. 12.3. Вид панели Actions, когда в области отображения сценария выбран обработчик события Использование действий Ниже представлены имена и описания событий мыши в языке ActionScript.

Press. Событие press инициирует действие при нажатии кнопки, когда указа тель мыши находится над объектом кнопки.

Событие инициирует действие при отпускании кнопки, когда указатель мыши находится над объектом кнопки. Это событие принимается по умолчанию.

Событие инициирует действие при отпускании кнопки, когда указатель мыши не находится над объектом кнопки.

KeyPress. Событие keyPress не связано с мышью. Оно инициирует действие, когда на клавиатуре будет нажата клавиша, указанная в поле слева от данного флажка.

Over. Событие инициирует действие, когда указатель мыши поме щается на объект кнопки.

Событие Out инициирует действие, когда указатель мыши поме щается за пределы объекта кнопки.

DragOver. Событие dragOver может показаться сначала несколько сложным.

Фактически оно включает комбинацию из серии различных событий. Чтобы инициировать действие с помощью события dragOver, необходимо установить указатель мыши над объектом кнопки и выполнить щелчок, ука затель за пределы объекта, а затем снова поместить указатель на объект.

Чтобы инициировать действие с помощью события dragOut, выполни те щелчок, когда указатель мыши находится над объектом кнопки, а затем пе реместите указатель за пределы объекта.

Помните, что любой из этих обработчиков событий может использоваться для инициации нескольких действий в одном сценарии. Кроме того, любой объект может иметь более одного связанного с ним обработчика. Например:

} on(release){ } С помощью данного при нажатии кнопки мыши будет воспроизводить ся кадр а когда кнопка будет отпущена — кадр 2.

Чтобы увидеть, как функционируют различные обработчики событий, просмотрите фильм который вы найдете на прилагаемом компакт-диске в каталоге Chapter 12.

События клипа Клип — это еще один тип объекта, с которым можно связать действие. Посколь ку поведение клипов во Flash-фильме отличается от поведения кнопок, клипы имеют свой собственный обработчик событий, инициирующий действия. Обра ботчик событий клипа инициализируется действием При выборе действий для клипа Flash автоматически производит вставку обработчика собы тия, принятого по умолчанию. Однако, в отличие от обработчика события мыши, 232 Глава 12. Базовые действия ActionScript обработчик события клипа принимает аргументы, которые определяют, какого рода событие клипа будет инициировать действие. Структура кода с обработчи ком события клипа выглядит так:

} Вместо слова можно указать любое число аргументов. Ниже при веден список событий, которые можно использовать в качестве аргументов.

Load. Событие load происходит, когда клип впервые вызывается на область действия, либо когда клип находится в текущем кадре временной шкалы.

Событие происходит, когда воспроизведение клипа завершено и головка воспроизведения переходит к следующему кадру, либо при удалении клипа с области действия.

Событие enterFrame происходит при воспроизведении каждого кад ра клипа.

Событие происходит при любом перемещении указателя мыши.

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

Событие mouseUp происходит при отпускании кнопки мыши, когда ее указатель находится на области действия фильма.

Событие keyDown происходит при нажатии на клавишу. Более подроб ную информацию об использовании клавишного ввода вы найдете в прило жении Б.

Событие происходит при отпускании клавиши. Более информацию об клавишном вводе вы найдете в приложении Б.

Data. Событие data происходит тогда, когда клип принимает данные в резуль тате выполнения действия или Чтобы установить или изменить обработчик события клипа, выполните указан ную последовательность действий.

1. Выберите клип, с которым необходимо связать действие либо для которого необходимо изменить обработчик события.

2. Откройте панель Actions и выполните одно из следующих действий.

Если вы хотите установить обработчик событий для клипа, выберите дей ствие onClipEvent из категории Actions Movie Clip Control.

Если вы хотите изменить аргумент обработчика события клипа для уже существующего действия, выберите строку-оператор, содержащую назва ние события, и на области отображения параметров установите соответст вующий флажок.

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

Связывание действий с кадрами Действия кадров используются для порядком воспроизведения Flash-фильма. Когда на временной шкале встречается ключевой кадр со связан ным действием, это действие выполняется, а фильм соответственно реагирует.

Более подробно о действиях кадров мы рассказывали в разделе «Работа с дейст виями кадра» ранее в этой главе.

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

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

1. Выберите ключевой кадр, с которым вы хотите связать действие. Если на вре менной шкале будет выбран не ключевой кадр, Flash свяжет действие с бли жайшим предшествующим ключевым кадром (слева) на шкале.

Для вставки ключевого кадра выберите команду Keyframe меню Insert.

2. После того как ключевой кадр выбран, откройте панель Actions, выбрав коман ду Actions меню Window или нажав клавишу F9.

3. Выбрать действие можно одним из перечисленных ниже способов.

> Выполните двойной щелчок на значке действия в области элементов Ас > С помощью мыши перетащите значок действия из области элементов ActionScript на область отображения сценария.

> Щелкните на кнопке Add (+) и выберите действие в меню.

> Введите с клавиатуры набор клавиш, соответствующий требуемому дейст вию.

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

5. Если необходимо добавить в сценарий дополнительные действия, повторите шаги 3 и 4.

6. Действия кадров не требуют специальных обработчиков, поскольку они вы полняются при воспроизведении кадров во Flash-фильме. Для тестирования фильма выберите команду Test Movie меню Control.

234 Глава 12. Базовые ActionScript Использование действий для создания основных элементов управления воспроизведением фильма Категория Actions области элементов ActionScript содержит несколько подкате горий действий, предназначенных для управления воспроизведением фильма.

Мы уже рассмотрели процесс связывания действий с различными элементами фильма. Теперь давайте рассмотрим возможности различных действий.

В новой версии Flash MX в организации панели Actions произошли тельные изменения. Категория Basic Actions (Базовые действия), знакомая пользователям предыдущих версий Flash, была преобразована в более сложную структуру. Возможно, пользователям Flash 5 потребуется некоторое время, что бы привыкнуть к новшествам. Однако, внимательно изучив новую структуру па нели Actions, вы обнаружите, что все требуемые действия по-прежнему доступны и их легко найти.

В данном разделе мы дадим обзор самых важных и полезных действий языка ActionScript. Эти базовые действия перечислены в том порядке, в котором они расположены в своих подкатегориях.

Подкатегория Movie Control Переход к указанному в качестве параметра кадру или сцене и воспроизведение фильма с этого места.

Переход к указанному в качестве параметра кадру или сцене и остановка фильма.

Определяет обработчик события мыши, который будет инициировать какое-то действие.

О. Воспроизведение фильма.

О. Остановка фильма.

О. Отключение звукового фильма.

Подкатегория Browser/Network Управление приложением Flash Player.

Вызов фильма с указанным URL.

Загрузка других Flash-фильмов.

Выгрузка других Flash-фильмов.

Подкатегория Clip Control Установка атрибутов клипа: размеры, положение и т. д.

Определяет обработчик события клипа, который будет иниции ровать действие.

Устаревшие действия В связи с появлением новых, более эффективных и функциональных действий, некоторые действия, которые использовались в предыдущих версиях, можно Использование действий считать устаревшими. Они по-прежнему функционируют, но их задачи можно выполнять с помощью более эффективных новых действий.

Данное действие служит для управления клипом или фильмами.

Его можно заменить новым действием или указать путь к объекту с по мощью диалогового окна Insert Target Path.

Данное действие служит для управления качеством вос произведения фильма. В новой версии Flash MX используйте свойство Данное действие использовалось для отслеживания загрузки определенных кадров фильма и воспроизведения простой анимации во время загрузки фильма на локальный компьютер. В новой версии Flash MX исполь зуйте свойство Более подробно об использовании свойства мы расскажем в приложении А.

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

Чтобы использовать действие goto выполните следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Movie Control и выполните двойной щелчок па значке действия goto либо перетащите его на область отображения сценария.

4. Теперь действие появится в области отображения сценария. Установи те для него следующие параметры.

> Если вы хотите, чтобы после перехода к объекту воспроизве дение фильма продолжалось, оставьте установленным переключатель Go to and Play. Если после перехода воспроизведение фильма должно быть оста новлено, активизируйте переключатель Go to and Stop. Сценарий фильма будет автоматически обновлен.

> В раскрывающемся списке Scene (Сцена) выберите сцену, к которой необ ходимо перейти. При выборе элемента next scene или previous scene переход будет осуществлен к первому кадру следующей или предыдущей сцены.

При выборе элемента current scene или элемента с именем сцены необходи мо будет указать номер кадра указанной сцены, к которому необходимо перейти.

> В раскрывающемся списке Туре (Тип) установите способ идентификации кадра, к которому будет переход. Идентифицировать кадр можно по номеру (Frame Number), метке кадра (Frame Label), с помощью выражения (Expression), либо выбрав элемент Next Frame (Следующий кадр) или Previous Frame (Предыдущий кадр).

236 Глава 12. Базовые действия ActionScript Если в раскрывающемся списке Туре выбран элемент Frame Number (Номер кадра) или Flame Label (Метка кадра), то необходимо ввести номер кадра или имя метки в поле Frame (Кадр). Если в списке Туре выбран элемент Expression (Выражение), то необходимо ввести в поле Frame выражение, в котором описана метка кадра или его номер. (Более подробно о написании выражений мы расскажем в главе 14.) Установка обработчика события мыши В некоторых ситуациях вам может потребоваться сначала указать обработчик события, а затем выбрать действие, которое обработчик будет инициировать.

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

Для связывания действия О с какой-либо выполните следующее.

1. Выберите экземпляр кнопки, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Movie Control и выполните двойной щелчок на значке действия on либо перетащите его на область отображения сценария.

4. В этой области появится принятый по умолчанию обработчик события on(release){ } Для изменения обработчика выберите строку on и установите соот ветствующий флажок на области отображения параметров. Более подробно об обработчиках события мыши мы расскажем в главе 13.

5. После того как обработчик события выбран, добавьте в сценарий действие, которое он должен инициировать.

6. В области отображения параметров введите все необходимые значения, если они необходимы для добавленного действия.

7. Один обработчик может инициировать выполнение нескольких действий.

Чтобы добавить дополнительные действия, повторите шаги 5 и 6. Используя кнопки Up (Вверх) и Down (Вниз), установите порядок выполнения действий.

Воспроизведение и остановка фильма Существуют всего два действия для управления воспроизведением и остановкой фильма. Воспроизведение Flash-фильма до тех пор, пока все кад ры на временной шкале не будут воспроизведены либо пока фильм не будет ос тановлен с помощью действия Независимо от причины остановки филь ма для продолжения воспроизведения необходимо использовать действие ay Действия () и О могут использоваться для управления воспроизведени ем кадров как главной временной шкалы фильма, так и клипа. Более подробно об управлении клипами с помощью сценариев ActionScript мы расскажем в главе 16.

Использование действий Для связывания действия О или с каким-либо объектом выполните следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие. За исключением случаев, когда указан путь к объекту, действие бу дет управлять только клипом или временной шкалой, с которой оно связано.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов откройте подкатегорию Actions Movie Control и двойной щелчок на значке действия или stopO.

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

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

Действие, предназначенное для возвращения головки воспроизведения к пер вому кадру фильма, будет выглядеть так:

} Отключение звукового сопровождения Действие О позволяет отключить все звуковые элементы фильма.

При выполнении данного действия воспроизведение всех звуков будет лено. Звуковое сопровождение остается отключенным до тех пор, пока оно снова не будет включено другим действием. После выполнения действия Sounds О звук начнет воспроизводиться, если он снова встретится на временной шкале. (Более подробно о звуке мы расскажем в главе 21.) Чтобы связать действие О с каким-либо объектом, выполните сле дующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Movie Control и выполните двойной щелчок на значке действия Sounds Действие Sounds О не принимает аргументов и будет выполнено, когда произой дет инициирующее его событие либо при воспроизведении связанного с ним кадра.

Связь с URL С помощью действия можно установить связь с URL непосредственно из Flash-фильма. Связь с URL позволяет выполнять две вещи. Во-первых, вы можете использовать Flash для создания Web-ссылки и загрузки информации в окно браузера из источника, соответствующего указанному URL. Во-вторых, действие можно использовать для передачи данных ресурсу, который находится 238 Глава 12. Базовые действия по определенному URL. Таким ресурсом может быть фильм типа Macromedia Director, сценарий CGI или сценарий другого типа, размещенный на сервере.

Чтобы связать действие необходимо выполнить следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Browser/Net work и выполните двойной щелчок на значке действия getURLO. Действие имеет три параметра, которые должны быть определены: URL, Window (Окно) и Variables (Переменные).

Существует также возможность выражение, в котором описы вается Для этого необходимо установить флажок Expression (Выражение) справа от поля URL. (Более подробно о выражениях мы расскажем в главе 14.) 4. В поле URL необходимо ввести абсолютный или относительный путь к ресур су. Абсолютный путь включает полный адрес URL, например Относительный путь содержит информацию о на хождении файла в пределах файловой структуры, где сохранен Flash-фильм, например такую:

5. Раскрывающийся список Window позволяет определить, в каком окне браузер будет загружать документ, который указывает URL. Вы можете ввести оп ределенное имя фрейма или окна, ввести выражение, которое описывает ме стоположение окна, либо выбрать один из следующих элементов раскрываю щегося списка.

> _self. Документ загружается в текущем окне, где в настоящий момент вос производится фильм.

_blank. Документ загружается в новом окне.

_parent. Данный элемент указывает на текущее окно и позволяет заменить только фрейм, где в настоящий момент воспроизводится фильм.

> _top. Данный элемент целесообразно использовать тогда, когда ваш фильм воспроизводится во фрейме, а новый документ, на который указывает URL, должен заполнить все окно браузера.

Например, чтобы при щелчке на кнопке документ загружался в новом окне браузера, необходимо написать следующий код с указанием отно сительного URL этого документа:

Использование действий 6. Раскрывающийся список Variables (Переменные) используется для передачи переменных на URL, с которым вы устанавливаете связь.

> Don't Send (не передавать). Данный элемент установлен по умолчанию и используется в тех случаях, когда нет необходимости в обмене данными.

Send Using GET (передавать с использованием метода GET). Данный эле мент списка выбирают в тех случаях, когда необходимо передать несколь ко переменных и объем передаваемых данных небольшой.

> Send Using Post (передавать с использованием метода POST). Данный эле мент списка выбирают в тех случаях, когда необходимо передавать боль шой объем информации.

Управление приложением Flash Player Действие используется для управления приложением Flash Player, когда последнее работает в режиме воспроизведения фильма формата Flash projector. Действие также можно использовать для обмена данными с приложением, которое выполняет роль хоста вашего фильма, например с Web браузером или операционной системой компьютера.

Для установки параметров в приложении Flash Player выпол ните следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Browser/Net work и выполните двойной щелчок на значке действия fscommandO.

4. В области отображения выберите один из следующих элементов раскрывающегося списка Commands for standalone player (Команды для авто номного проигрывателя), служащих аргументами действия fscommandO.

Co значением true данный аргумент позволяет фильму типа Flash projector заполнить всю площадь экрана без отображения строки меню. Если установить значение false, то фильм будет воспроизводиться в окне, размеры которого будут соответствовать параметрам Dimensions, ус тановленным в диалоговом окне Document Properties.

> Co значением true данный аргумент позволяет изменять мас штаб отображения кадров анимации. Если установить значение то изменять масштаб кадров анимации будет невозможно.

> Аргумент со значением true позволяет получать доступ к командам контекстного меню посредством щелчка при нажатой клавише Ctrl (Macintosh) или щелчка правой кнопкой мыши (Windows). При уста новке значения false данное меню будет недоступно.

> Данный аргумент позволяет завершить работу приложения.

> Co значением true данный аргумент блокирует любой ввод с клавиатуры. Если ваш фильм должен управляться с помощью мыши, то ввод с клавиатуры желательно заблокировать. Если вы используете этот 240 4 Глава 12. Базовые действия ActionScript аргумент совместно с аргументом со значением убедитесь в наличии элемента, который завершает работу (quit).

> exec. Данный аргумент предназначен для запуска другого приложения.

В качестве его значения необходимо указать путь к приложению, которое необходимо запустить.

Более подробно о командах действия автономных фильмах формата Flash projector и о том, как их использовать для записи Flash-фильмов на ком пакт-диски, мы расскажем в главе 29.

Создание сценариев для нескольких фильмов Во Flash-проекте могут использоваться несколько фильмов. Для управления по следовательностью воспроизведения фильмов используются действия vi e() (Загрузка фильма) и unload (Выгрузка фильма). Такая по зволяет устанавливать воспроизведения серии фильмов, а также размещать кадры одного фильма поверх кадров другого для создания эффекта быстрого переключения между ними. Кроме того, за счет использова ния действий и можно воспроизводить различные фильмы в одном окне браузера, что создает эффект плавного перехода от показа одного фильма к показу другого.

Загрузка фильма Чтобы загрузить дополнительные фильмы в окне приложения Flash Player, вы полните следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Browser/Net work и выполните двойной щелчок на значке действия oadMovi (рис. 12.4).

4. На области отображения параметров в поле URL введите имя SWF-файла, ко торый вы хотите загрузить. Рекомендуется хранить все файлы фильмов в од ном каталоге (основной файл и дополнительные, которые должны быть за гружены).

5. В раскрывающемся списке Location (Расположение) выберите один из элемен тов, Level (Уровень) или Target (Объект).

6. При выборе элемента Level необходимо ввести номер уровня.

> Значение 0 установлено по умолчанию и соответствует уровню фильма, который был загружен первым. Фильм уровня 0 устанавливает частоту смены кадров, фоновый цвет и размер для всех остальных загружаемых фильмов. Если новый фильм загружается на уровень 0, он заменит началь ный фильм и выгрузит все остальные уровни.

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

Использование действий > Чтобы заменить загруженный фильм, необходимо определить его уровень и загрузить новый фильм на этот же уровень.

7. Если в поле списка Location выбран элемент Target, необходимо указать имя клипа, который будет заменен загружаемым фильмом. Левый верхний угол области воспроизведения нового фильма будет позиционирован в точке реги страции клипа на области действия. Новый фильм также унаследует атрибу ты заменяемого клипа (масштаб, вращение и т. д.).

8. По умолчанию в поле списка Variables (Переменные) выбран элемент Don't Send (He передавать). Однако, если вы хотите разрешить передачу перемен ных, выберите один из элементов, Send Using GET или Send Using POST. Об осо бенностях данных методов мы говорили ранее, когда обсуждали действие \.....

Control ) I 1 on { } ' ' '..

.. ' Рис. Действие на панели Actions Выгрузка фильма Чтобы выгрузить фильм из окна приложения Flash Player, выполните следующее.

1. Выберите кнопку, кадр или экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Browser/Net work и выполните двойной щелчок на значке действия (рис. 12.4).

4. В области отображения параметров в раскрывающемся списке Location (Распо ложение) выберите один из Level (Уровень) или Target (Объект).

242 Глава 12. Базовые ActionScript 5. При выборе элемента Level необходимо ввести номер уровня фильма, кото рый вы хотите выгрузить.

6. Если в раскрывающемся списке Location выбран элемент Target, то необходимо указать имя либо путь к экземпляру клипа, который вы хотите выгрузить.

Возможно, вы заметили, что в сценариях действия и иногда пишутся как и В режиме Normal Flash автоматически делает эти изменения. Каждое действие с измененным именем производит практиче ски такую же работу, однако использует другой синтаксис. Действие пере дает аргументы как строку, тогда как действие использует число, чтобы указать уровень, на который будет загружен новый фильм. В режиме Normal действие используется по умолчанию для загрузки фильмов взамен экземпляров кли пов, а действие используется для загрузки фильмов на определенный уровень. (Более подробно о работе с несколькими временными шкалами мы расскажем в главе Установка обработчика для событий клипа В некоторых ситуациях вам может потребоваться сначала указать обработчик события, а затем выбрать действие, которое обработчик будет Чтобы вручную установить обработчик события клипа, используйте действие При выборе данного действия в области отображения сценария появится принятый по умолчанию обработчик события Вы можете изменить обработчик, а затем выбрать действие, которое должно быть инициировано.

Для связывания действия выполните следующее.

1. Выберите экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Movie Clip Control и выполните двойной щелчок на значке действия 4. Принятый по умолчанию обработчик события 1 oad можно изменить в области отображения параметров. Изначально сценарий выглядит так:

} 5. После того как обработчик события выбран, добавьте в сценарий действие, которое он должен инициировать.

6. В области отображения параметров ведите все необходимые значения, если они требуются для добавленного действия.

7. Один может инициировать выполнение нескольких действий.

Чтобы добавить дополнительные действия, повторите шаги 5 и 6.

кнопки Up (Вверх) и Down (Вниз), установите порядок выполнения действий.

Использование действий 4 Управление клипами и другими фильмами Управление клипами во Flash-фильме осуществляется с помощью действия Хотя технически данное действие можно считать устаревшим, его по-прежнему можно эффективно использовать для управления клипами в режи ме Normal. Данное действие может быть связано как с объектами, так и с кадрами.

Например, для остановки клипа можно использовать кнопку, а действие ключе вого кадра может инициировать начало воспроизведения клипа.

Некоторые установки необходимо сделать до использования действия TargetO. Во-первых, ваш фильм должен содержать клип. Кроме того, экземпляр клипа должен иметь уникальное имя. Чтобы присвоить его, выберите экземп ляр клипа, откройте панель Properties, выбрав команду Properties меню Window, и введите имя в поле Instance Name (Имя экземпляра). Имя экземпляра символа может состоять из букв, а также из комбинации букв и цифр. В проектах рекомендуется присваивать экземплярам символов значащие имена, чтобы затем легче было вспомнить назначение каждого экземпляра символа. Кроме того, клип должен находиться в том же кадре, что и элемент (кадр или объект), с по мощью которого вы будете управлять клипом. Кнопка в кадре с 1 не может управлять клипом, находящимся в кадре с номером 2.

Для связывания действия выполните следующее.

1. Выберите экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Deprecated Actions и выполните двойной щелчок на значке действия 4. Чтобы указать нужный экземпляр клипа, щелкните на кнопке Insert a target path (Указать путь к объекту), которая находится в нижней части области отображения параметров. Если кнопка недоступна, выполните щелчок на поле Target (Объект), после чего кнопка станет доступной.

5. В появившемся диалоговом окне Insert Target Path (Указать путь к объекту) будет показана структура расположения кли пов в вашем фильме.

И 6. Переключатель Notation (За пись) установите в положение Dots (Точки). При этом путь к объекту будет записан с ис пользованием современного то чечного синтаксиса (в качест ве разделителей будут использоваться точки). Если вы привыкли к старому синтаксису, где в качестве разделителей используются косые линии, переклю чатель Notation установите в положение Slashes (Косые линии).

244 Глава 12. Базовые ActionScript 7. Переключатель Mode (Режим) установить, какие клипы будут вид ны в окне Insert Target Path.

> При установке переключателя Mode в положение Relative (Относительный) в диалоговом окне Insert Target Path будут отображаться только клипы текущей сцены. В этом режиме наверху структуры вы будете видеть эле мент Слово используется в качестве ссылки на текущую времен ную шкалу или клип.

> При установке переключателя Mode в положение Absolute (Абсолютный) будут отображаться все клипы фильма. В этом режиме наверху структуры вы будете видеть элемент _root. Свойство клипа _root содержит ссылку на главную временную шкалу фильма.

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

8. При выборе клипа в области Target появится имя экземпляра клипа. Щелкни те на кнопке ОК и возвратитесь к панели Actions.

9. После того как экземпляр клипа выбран, необходимо добавить действие, ко торое будет им управлять. Убедитесь, что в области отображения сценария выбрана строка Перейдите к области элементов ActionScript и выберите одно или несколько действий, которые должны управлять клипом посредством действия Конечный сценарий действия, которое ос танавливает воспроизведение экземпляра клипа с именем icon, будет выгля деть так:

Как мы уже говорили, действие tellTargetO считается устаревшим. Однако его по-преж нему можно использоваться при работе в режиме Normal. Более подробно об альтерна тивных действиях, способных выполнять ту же задачу, мы расскажем в главе Изменение свойств клипа Используя действие вы можете создавать сценарии, с помощью ко торых можно манипулировать характеристиками и свойствами экземпляра кли па. Безусловно, свойства и характеристики экземпляра клипа можно при его создании. Однако вы можете предоставить возможность зрителям филь ма динамически изменять свойства клипа, используя интерактивные элементы управления. Необходимо помнить следующее: чтобы можно было управлять клипом с помощью сценария ActionScript, экземпляр клипа должен иметь уни кальное имя.

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

1. Выберите экземпляр клипа, с которым вы хотите связать действие.

2. Откройте панель Actions, выбрав команду Actions меню Window или нажав кла вишу F9.

3. В области элементов ActionScript откройте подкатегорию Actions Movie Clop Control и выполните двойной щелчок на значке действия setPropertyO. Для данного действия необходимо указать три параметра.

> В раскрывающемся списке Property (Свойство) выберите свойство фильма, которое вы хотите изменить.

> В поле Target (Объект) введите имя экземпляра клипа, свойство которого вы хотите изменить. В качестве альтернативы, щелкните на кнопке Insert a target path и в открывшемся диалоговом окне Insert Target Path укажите путь к экземпляру клипа. О том, как работать с диалоговым окном Insert Target Path, мы рассказывали при обсуждении действия Target О.

В поле Value (Значение) введите значение изменяемого параметра в преде лах допустимых величин для свойства. Более подробно о диапазо не значений для свойств клипа мы расскажем в приложении Б.

Альтернатива использованию действия setPropertyO будет рассмотрена в главе 16.

Разработки Поскольку сценарии ActionScript широко используются практически во всех Web-проектах, нам было трудно выбрать какой-либо один в качестве примера.

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

Вашему вниманию мы хотели бы предложить разработку Web-узла Michael Schuster Assosiates, анимация для которого была создана компанией Core Five Creative с использованием действий и клипов Flash. Хотя ко нечный продукт внешне ничем не отличается от других проектов, такая техника позволяет разбить процесс разработки на несколько этапов, а отдельные клипы совместить в конечном продукте. С данным проектом вы можете познакомиться по адресу 246 Глава Базовые действия ActionScript Рис. Web-узел компании Michael Schuster Assosiates Резюме В данной главе вы познакомились с основами языка ActionScript. Вы узнали, на сколько важным является процесс создания сценариев ActionScript. Сценарии позволяют не только управлять воспроизведением фильма, но и обмениваться информацией с другими фильмами или открывать окна браузе ра и определять способ взаимодействия с аудиторией. По мере приобретения опыта работы с ActionScript вы будете создавать все более сложные для интерактивных фильмов и Web-узлов.

Глава Создание интерактивных элементов управления В предыдущей главе вы познакомились с действиями и изучили некоторые базовые компоненты языка ActionScript. Теперь настало время на практике реализовать ваши знания. Вы знаете, что действия позволяют управлять воспроизведением фильма. Однако, чтобы управлять, необходимо иметь элементы управления. Та кими элементами могут быть кнопки или переключатели, созданные специально для инициирования действий, которые и будут управлять фильмом.

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

В данной главе будут рассмотрены следующие темы:

библиотека кнопок;

создание пользовательских кнопок;

предварительный просмотр кнопок;

тестирование кнопок;

редактирование кнопок;

создание кнопок, содержащих несколько слоев;

создание кнопок;

создание многокнопочных интерфейсов;

создание «некнопочных» кнопок.

Управление интерактивными фильмами с помощью простых кнопок Flash позволяет создавать сложные схемы интерактивного взаимодействия, од нако это не всегда необходимо. Иногда для управления фильмом достаточно не сколько простых элементов. Для тех разработчиков и дизайнеров, которые толь ко осваивают Flash и желают сделать управление как можно более простым, достаточно будет создать несколько кнопок для выполнения самых элементарных 248 Глава 13. Создание интерактивных элементов управления действий. Процесс простых элементов управления не требует ка ких-либо особых навыков, а результат может быть вполне удовлетворительным.

Библиотека кнопок Flash предлагает пользователю несколько библиотек стандартных элементов.

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

.

Рис. 13.1. Библиотека кнопок Чтобы открыть окно библиотеки кнопок, выберите команду Window Common Libraries Buttons (рис. 13.1). Эта библиотека выглядит так же, как и все остальные библиотеки Flash. Единственное отличие — ее наполнение. Библиотека содер жит широкий ассортимент кнопок, готовых для использования в фильме.

Более подробно о работе с библиотеками и о совместно используемых компонентах Flash мы рассказывали в главе 7.

Кнопки хранятся в каталогах. Каждый каталог содержит свою группу кнопок.

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

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

1. Откройте окно библиотеки кнопок, выбрав команду Window Common Libraries Buttons.

Управление интерактивными фильмами с помощью простых кнопок 4 2. Откройте каталог группы кнопок, которые вы хотите использовать. Развер нуть и свернуть содержимое каталога можно посредством двойного щелчка на значке каталога (рис. 13.2).

Открытый каталог каталога ' га Закрытый каталог Рис. 13.2. Структура каталогов библиотеки кнопок 3. Выполните одно из следующих действий.

> Откройте библиотеку вашего Flash-фильма, выбрав команду Library меню Window либо нажав клавишу С помощью мыши перетащите кнопку из окна библиотеки кнопок в окно библиотеки фильма.

> С помощью мыши перетащите кнопку из окна библиотеки кнопок средственно на область действия. Значок кнопки автоматически появится в окне библиотеки элементов, используемых в вашем фильме.

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

С созданным экземпляром символа можно связать действие. О том, как связывать различные действия с экземплярами символов, речь шла в главе 12.

Позже, в разделе «Редактирование кнопок», мы расскажем, как можно произво дить редактирование стандартных кнопок и настраивать их для собственных фильмов.

Создание пользовательских кнопок Хотя использовать стандартные кнопки очень удобно, иногда возникает потреб ность в разработке собственных кнопок. В конце концов, вы изучаете Flash именно для того, чтобы получать удовольствие от процесса создания. Однако, кроме удовольствия, применение собственных кнопок дает еще и некоторые пре имущества. Самое большое из них состоит в том, что, создав самостоятельно кнопку, вы получаете именно тот результат, который хотите. Разрабатывая соб ственные кнопки, вы сможете учесть все особенности дизайна и технические 250 Глава 13. Создание интерактивных элементов управления характеристики элементов управления фильмом. Элементы интерактивного управления — важная составляющая Flash-фильма, поэтому они должны точно соответствовать дизайну, а также обладать функциональными воз можностями, соответствующими задачам проекта.

Кнопка во Flash-фильме — это короткий фильм, содержащий всего четыре кадра. Каждый кадр представляет различное «состояние», или внешний вид кнопки, который соответствует определенным действиям пользо вателя. Эти различные состояния сохранены в виде отдельных изображений в ключевых кадрах на временной шкале кнопки. Если вы переместите указатель мыши на изображение кнопки и щелкните на ней, ее внешний вид изменится, так как будет выведено изображение соответствующего ключевого кадра.

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

Как и клипы, кнопки хранятся в библиотеке Flash-фильма в виде символов. Сле довательно, вы можете создать кнопку и многократно использовать ее в фильме.

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

Кнопки имеют следующие четыре состояния.

Up. Первое состояние соответствует внешнему виду кнопки, когда указатель мыши находится за ее пределами. Данное состояние можно рассматривать как «пассивное».

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

Down. Изображение в третьем ключевом кадре соответствует нажатому со стоянию кнопки.

Hit. Внешний контур изображения, находящегося в последнем ключевом кад ре, ограничивает область кнопки, которая будет реагировать на щелчок мыши. Hit можно рассматривать как активную область, на которой необходимо произвести щелчок для выполнения любых связанных с кнопкой сценариев.

В табл. 13.1 содержатся иллюстрации и описания четырех состояний кнопки.

Таблица Четыре состояния обычной кнопки Состояние вид Описание Up Вид кнопки, когда указатель мыши не находится над КНОПКОЙ Over flip кнопки, когда указатель мыши находится над кнопкой Down Вид кнопки в момент щелчка мышью Hit Задание области кнопки, которая реагирует на щелчок мыши Управление интерактивными фильмами с помощью простых кнопок 4 Для создания собственной кнопки выполните следующие действия.

1. Откройте диалоговое окно Create New Symbol, выбрав команду New Symbol меню Insert, либо воспользуйтесь комбинацией клавиш Cmd/Ctrl+F8.

• •... ;

2. Переключатель типа символа установите в положение Button (Кнопка) и вве дите имя символа в поле Name.

3. После щелчка на кнопке ОК вы переключитесь в режим редактирования сим вола (рис. 13.3). Обратите внимание на то, что данный режим характеризует ся некоторыми изменениями в главном окне среды Flash. В строке Scene and Symbol (Сцена и символ) рядом с названием сцены появится имя редактируе мого символа. Кроме того, вместо главной временной шкалы появится вре менная шкала кнопки, содержащая четыре кадра, соответствующие четырем состояниям кнопки. Первый кадр, соответствующий состоянию Up, содержит пустой ключевой кадр.

Рис. 13.3. Временная шкала в режиме редактирования символа кнопки 4. Создайте изображение кнопки, соответствующее состоянию Up, выполнив одно из нижеперечисленных действий.

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

> Импортируете графический файл и переместите кнопки к точ ке регистрации, в центр области действия.

252 4 Глава 13. Создание интерактивных элементов управления > Перетащите из окна библиотеки на область действия графический символ или клип, создав тем самым экземпляр этого объекта в пределах кнопки.

Небольшое перекрестие в центре области действия указывает точку регистра ции кнопки.

можете использовать клипы для отображения состояний кнопок, однако нельзя по мещать кнопки на другие кнопки. При использовании клипов в качестве состояний кно пок можно создавать кнопки. Более подробно об этом мы расскажем в разделе «Создание кнопок» позже в этой главе.

5. Чтобы создать новый ключевой кадр для состояния Over, выполните щелчок на втором кадре и выберите команду Keyframe меню Insert. Flash автоматиче ски поместит изображение первого ключевого кадра в новый ключевой кадр.

6. Используя описанные ранее методы, произведите изменения изображения в кадре с номером 2, которое будет соответствовать состоянию Over.

Предварительный просмотр, тестирование и редактирование кнопок 7. Повторите шаги 5 и 6 для состояний Down и Hit.

Состояние Hit является особенным. Данное состояние определяет область, кото рая будет реагировать на любые щелчки мыши. Изображение в кадре состояния Hit должно быть сплошным, чтобы не допустить «провалов», то есть наличия не активных зон в пределах кнопки. Чтобы пользователи не испытывали никаких неудобств, активная область должна быть достаточно большой для вы полнения на ней щелчка.

СОВЕТ Если вы создаете кнопку в виде фрагмента текста, рисунок в кадре состояния Hit осо бенно важен. Поскольку алфавитные символы содержат «полости», щелчок мыши, на пример в центре буквы «о», не будет воспринят, если в кадре состояния Hit также содер жится изображение буквы «о». Чтобы избежать этого, необходимо в кадре состояния Hit создать изображение сплошного прямоугольника, размеры которого приблизительно соответствуют размерам фрагмента текста. Поскольку изображение в состоянии Hit не видимо, прямоугольник не изменит внешний вид кнопки в фильме, однако пользоваться такой кнопкой будет гораздо удобнее.

8. После создания изображений для всех четырех состояний кнопки выйдите из режима редактирования символа, команду Edit Document, либо вос пользуйтесь для этого комбинацией клавиш либо щелкните на имени сцены в строке Scene and Symbol.

9. С помощью мыши перетащите кнопку из окна библиотеки на область дейст вия, создав тем самым экземпляр кнопки в фильме.

10. Чтобы управлять различными элементами фильма, необходимо связать с кнопкой действие (или действия). Основные действия и способ их связыва ния с объектами мы обсуждали в главе 12. Более подробно о дополнительных действиях для кнопок мы расскажем в главе 16.

В этом разделе мы рассказали об основных этапах создания простых кнопок для Flash-фильма. Эти знания пригодятся вам при разработке сложных и анимиро кнопок. О том, как связывать с кнопками звуки, мы расскажем в главе 20.

В следующем разделе мы обсудим детали процесса тестирования кнопок, а так же расскажем, как вносить в них изменения или редактировать отдельные ком поненты.

Предварительный просмотр, тестирование и редактирование кнопок После создания кнопок необходимо убедиться в их работоспособности и функ циональности. Для тестирования кнопок Flash предлагает два основных способа:

тестирование кнопок в среде Flash и тестирование всего фильма. В зависимости от особенностей проекта вам необходимо будет выбрать один из вариантов. Та ким образом, для овладения навыками эффективной и быстрой работы вы долж ны познакомиться как с одной, так и с другой техникой.

254 Глава 13. Создание интерактивных элементов управления Предварительный просмотр кнопок Существует возможность предварительного просмотра кнопок непосредственно в среде разработки Flash (в режиме разработки). По умолчанию в процессе рабо ты над фильмом Flash сохраняет пассивное состояние всех кнопок. Однако при необходимости вы можете активизировать кнопки и проверить их непосредст венно во время работы над фильмом.

Для тестирования кнопок в режиме разработки активизируйте команду Enable Simple Buttons меню Control. Около имени этой команды появится небольшой фла жок, указывающий на включение данного режима. Чтобы отменить команду, по вторите процесс еще раз.

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

Тестирование кнопок Предварительный просмотр кнопок в режиме разработки дает вам возможность только оценить, как будут выглядеть кнопки в конечном филь ме. Такой режим не просматривать клипы, которые могут являться элементами кнопки. Чтобы полностью оценить работу и внешние характеристики созданных кнопок, необходимо тестировать сцену или фильм. Если вы решили тестировать фильм, выберите команду Test Movie или воспользуйтесь комбинаци ей клавиш Чтобы тестировать сцену, выберите команду Test Scene или воспользуйтесь комбинацией клавиш Enter. Более подробно о тестировании фильма мы расскажем в главе 27.

Редактирование кнопок Если при тестировании кнопки вы установили, что ей нужны некоторые дора ботки, необходимо в режим редактирования символа кнопки. Если в вашем фильме вы использовали несколько экземпляров одного родительского символа кнопки, то для внесения изменений во все экземпляры достаточно дора ботать родительский символ, хранящийся в библиотеке. Все экземпляры данно го символа будут автоматически обновлены. Более подробно о символах и их эк земплярах речь шла в главе 7.

Существуют три способа редактирования кнопок во Flash-фильме: правка кноп ки на области действия («местная правка»), в режиме редактирования символа и редактирование в отдельном окне. Результаты всех способов правки одинаковы.

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

Выполните двойной щелчок на экземпляре символа кнопки.

Предварительный просмотр, тестирование и редактирование кнопок Щелкните правой кнопкой мыши (Windows) или выпол ните щелчок при нажатой клавише Ctrl (Macintosh) и вы берите команду Edit in Place (Правка на месте) раскрывше гося контекстного меню.

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

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

Щелкните на кнопке Edit Symbols (Правка символов), расположенной в пра вой части строки Scene and Symbol, и в раскрывшемся меню выберите имя сим вола кнопки, который вы хотите редактировать.

Выберите на области действия экземпляр символа кнопки, щелкните правой кнопкой мыши (Windows) или выполните щелчок при нажатой клавише Ctrl (Macintosh) и активизируйте команду Edit (Правка) раскрывшегося контекст ного меню.

Выберите на области действия экземпляр символа кнопки, откройте Edit и вызовите команду Edit Symbol (Правка символа).

В окне библиотеки фильма выполните двойной щелчок на значке символа либо выберите символ кнопки, откройте меню библиотеки Options и активизи руйте команду Edit (Правка).

Чтобы отредактировать кнопку в отдельном окне, выделите экземпляр символа кнопки на области действия, щелчок правой кнопкой мыши (Win dows) или нажмите клавишу Ctrl (Macintosh) и выберите команду Edit in New Win dow (Правка в новом окне) раскрывшегося контекстного меню. Новое окно будет открыто непосредственно над главным окном среды Flash.

Кнопка Имя сцены Рис. 13.4. Режим редактирования кнопки Все способы приводят практически к одному и тому же результату: доступу к временной шкале кнопки с четырьмя ключевыми кадрами, соответствующими четырем состояниям кнопки. Получив доступ к этим кадрам, вы можете вносить 256 Глава 13. Создание интерактивных элементов управления любые изменения во внешний вид кнопки. Правку кнопки можно производить с помощью всех доступных инструментов Flash, а также посредством добавления экземпляров клипов и импорта растровых изображений из внешних файлов.

Помните, что изменения родительского символа влияют на все экземпляры это го символа в фильме.

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

Выберите команду Edit Document меню Edit либо воспользуйтесь комбинацией клавиш Щелкните на кнопке Back (Возврат) (рис. 13.4), расположенной в левой части строки Scene and Symbol, либо выполните щелчок на имени сцены, к которой вы хотите вернуться.

Более подробно о работе с главной временной шкалой и о переключении режи мов редактирования различных элементов речь шла в главе 2.

Создание сложных кнопок В предыдущих разделах вы познакомились с техниками создания простых кно пок и использовали их во Flash-фильмах. Обладая этими базовыми знаниями, вы можете приступать к следующему этапу — созданию сложных кнопок, соот ветствующих общему дизайну фильма. Такие кнопки не только выполняют роль элементов навигации, но и позволяют зрителям быстро научиться управлять воспроизведением фильма. Изучив описанные в данном разделе техники, вы поймете, насколько полезны они могут быть при создании Flash-фильмов.

Создание кнопок, содержащих несколько слоев Кнопки — это не только элементы управления фильмом. Они являются графиче скими объектами, от которых значительно зависит общее восприятие фильма.

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

В следующем примере мы расскажем вам, как создавать динамичную кнопку, компоненты которой размещены на нескольких слоях. Исходные файлы для этого примера вы можете найти на прилагаемом компакт-диске.

Файл с именем находится в каталоге Chapter 13.

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

1. Выберите команду New Symbol меню Insert либо воспользуйтесь комбинацией клавиш 2. В появившемся диалоговом окне Create New Symbol (Создание нового симво ла) установите переключатель типа символа в положение Button (Кнопка) и введите имя символа в поле Name, после чего нажмите кнопку ОК.

3. Flash автоматически переключится в режим редактирования символа. На вре менной шкале будут отображаться кадры четырех состояний кнопки: Up, Over, Down и Hit.

Создание сложных кнопок 4. Преимущество разрабатываемой кнопки состоит в том, что каждый графиче ский слой является независимым. Чтобы добавить дополнительный слой, вы берите команду Layer меню Insert либо щелкните на кнопке Insert Layer (Вста вить слой), расположенной в правой части шкалы. В результате на временной шкале появится еще один слой с пустым ключевым кадром со стояния Up.

5. Используя инструменты рисования, создайте изображение кнопки в состоя нии Up в слое Layer 1. Затем выберите слой Layer 2 и создайте дополнительные элементы изображения. Поскольку каждая часть находится в собственном слое, вы можете легко менять изображения различных состоя ний кнопки.

6. Если необходимо, повторите шаги 5 и 6 для создания дополнительных слоев.

7. Закончив создание изображения кнопки для состояния Up, подготовьте изо бражение кнопки для состояния Over. Для этого щелкните ъ слое Layer 1 и вставьте ключевой кадр в кадр для состояния Over, выбрав команду Keyframe меню Insert. Flash автоматически вставит новый ключевой кадр в слой Layer и создаст в нем копию изображения кнопки для состояния Up.

8. Выбрав слой Layer 1, создайте или отредактируйте изображение кнопки для состояния Over. Затем на втором кадре слоя Layer 2, вставьте в него ключевой кадр и внесите необходимые изменения в изображение.

• 9. Повторите процесс, описанный в пунктах 7 и 8, чтобы создать изображение кнопки для состояния Down.

<.,• Up Over...

258 Глава 13. Создание интерактивных элементов управления 10. В этом примере в качестве кнопки используется изображение помидора. Если поместить указатель мыши на кнопку, меняется цвет помидора и его корешка.

При щелчке на кнопке помидор раздавливается и темнеет. Вы можете мани пулировать цветами как самого помидора, так и его корешка, поскольку каж дый из них находится в отдельном слое.

Выберите слой Layer 1 и вставьте последний, четвертый ключевой кадр для состояния Hit. Поскольку изображение в данном состоянии невидимо, необходимо вставлять ключевой кадр только в один слой.

12. По завершении создания кнопки возвратитесь к главной шкале, выбрав команду Edit Document меню Edit. Для предварительного просмотра кнопки активизируйте команду Enable Simple Buttons меню Control. Данный ре жим позволит вам увидеть, как будет меняться изображение кнопки при раз личных манипуляциях мышью.

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

При перемещении указателя мыши над кнопкой ее внешний вид меняется. В мо мент щелчка также происходят изменения внешнего вида кнопки. Вышеописанную идею мы можем использовать при создании анимированных кнопок. В таких кнопках для представления одного из состояний используются клипы или не большие анимации. Обычно анимация используется для отображения состояния Over, хотя любое другое состояние кнопки также может быть Если используется для представления состояния Over, имеется больше шан сов, что на такую кнопку пользователь обратит внимание. Если же анимация ис пользуется для представления состояния Down, то в тот короткий период, когда на кнопке производится щелчок, зритель может не заметить анимацию. Состоя Over представляет активное кнопки, когда указатель мыши нахо дится над ней. Анимация в данном случае привлекает внимание пользователей больше, чем простое графическое изображение.

В следующем примере мы расскажем вам, как можно создать кнопку с использованием клипа. Данный пример вы найдете на при лагаемом компакт-диске. Файл с находится в каталоге Chapter 13.

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

1. На области действия создайте изображение кнопки. Используя инструмент Arrow, выберите все элементы изображения кнопки. Затем преобразуйте дан ное изображение в символ, выбрав команду Convert to Symbol меню Insert или клавишу F8. В диалоговом окне Create New Symbol устано вите переключатель типа символа в положение Graphic (Графический) и вве дите имя символа в поле Name. Щелкните на кнопке ОК.

Создание сложных кнопок 2. Новый символ появится в окне библиотеки. Удалите изображение из области действия. При создании каждого компонента кнопки данный графический символ будет использоваться в качестве отправной точки.

3. Создайте новый символ, выбрав ко манду New Symbol меню Insert либо воспользовавшись комбинацией кла виш Cmd/Ctrl+F8. В появившемся диа логовом окне Create New Symbol уста новите переключатель типа символа в положение Movie Clip (Клип) и вве дите имя символа в поле Name. Flash ' | mm переключится в режим редактирова ния символа.

4. Теперь можно приступать к созданию клипа, который будет использоваться для состояния Over. Находясь в режиме редактирования клипа, перетащите графический символ из окна библиотеки на область действия.

С помощью клавиш управления курсором выровняйте изображение таким образом, чтобы его точка регистрации совпала с точкой регистрации клипа.

В качестве альтернативы для автоматического выравнивания символа вы мо жете использовать панель Align, открыть которую можно с помощью комбина ции клавиш Подробно о панели Align разговор шел в главе 6.

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

5. Используя ключевые кадры, механизм автоматического построения кадров или другие техники Flash (рис. 13.5), создайте анимацию. При необ ходимости внести в изображение символа выберите команду Break Apart Modify либо воспользуйтесь комбинацией клавиш Более подробно о ключевых кадрах и создании анимации разговор шел в главе 9.

* Рис. 13.5. Временная шкала клипа в файле 6. Завершив создание клипа, возвратитесь к главной временной шкале, выбрав команду Edit Document меню Edit.

7. На данном этапе все готово для создания кнопки. У вас есть графическое изо бражение и клип. Теперь их совместить в одном символе. Выбери те команду New Symbol меню Insert либо воспользуйтесь комбинацией клавиш 260 Глава 13. управления Cmd/Ctrl+F8. В появившемся диалоговом окне Create New Symbol установите пе реключатель типа символа в положение Button (Кнопка) и введите имя симво ла в поле Name.

8. Щелкните на кнопке и Flash переключится в режим редактирования сим вола.

9. Находясь в режиме редактирования символа кнопки, перетащите графиче ский символ из окна библиотеки на область действия. С помощью клавиш управления курсором выровняйте изображение таким образом, чтобы его точка регистрации совпала с точкой регистрации кнопки. Обратите внимание на то, что при помещении графического символа на область действия первый кадр, соответствующий состоянию Up, превратился из пустого ключевого в ключевой кадр.

СОВЕТ При позиционировании с помощью клавиш управления курсором объект перемещается на один пиксел при каждом нажатии на клавишу. Чтобы перемещать объект за один раз на 10 пикселов, во время операции нажмите и удерживайте клавишу Shift.

Итак, изображение кнопки для состояния Up готово. Можно перейти к созданию изображения кнопки для состояния Over.

Вставьте в кадр, соответствующий состоя Over, ключевой кадр, выбрав команду Keyframe меню Insert. При вставке ключевого кадра Flash автоматически перенесет графическое изображение первого ключевого кадра в новый ключевой кадр. Вставленное изображение необходимо заменить ранее созданным клипом. Для этого выберите изобра жение в области действия и щелкните на кнопке Swap Symbols панели Pro perties.

С помощью появившегося диалогового окна Swap Symbol вы сможете заме нить экземпляр графического символа экземпляром клипа. Убедитесь, что на панели Properties в поле списка Symbol Behavior (Характеристика символа) вы бран элемент Movie Clip, в противном случае клип работать не будет. Более подробно о замене символов речь шла в главе 7.

Вы, заметили, что элементы кнопки в файле хранятся в не скольких слоях;

сказанное относится как к состоянию Over, так к состоянию Одна ко кнопки можно создавать и с использованием одного слоя.

Основная часть работы проделана. Ваша кнопка уже содержит изображение для состояния Up и анимацию для состояния Over. Следующим шагом будет создание изображения кнопки для состояния Down. Для этого сделайте клю чевым кадр, соответствующий состоянию Down. Flash автоматически продуб лирует изображение предыдущего ключевого кадра в новом ключевом кадре.

Используя любую из ранее описанных техник, вставьте графическое изобра жение, которое будет соответствовать кнопке в состоянии Down.

Создание сложных кнопок 12. Такую же процедуру проделайте для создания изображения кнопки в состоя нии Hit в четвертом кадре. Когда все ключевые кадры получат изображения всех четырех состояний кнопки, кнопка будет готова к ис пользованию.

Up • I 13. Возвратитесь к главной временной шкале, выбрав команду Edit Document меню Edit, и сохраните документ. Поскольку нами был использован клип, вы не сможете проверить работу в режиме разработки. Что бы посмотреть на кнопку в действии, необходимо создать экземпляр этой кнопки в фильме, а затем выбрать команду Test Movie меню Control.

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

Создание многокнопочных интерфейсов Работая с кнопками, вы могли заметить, что, щелкнув на одной из них, вы ино гда продолжаете видеть предыдущее состояние, Over. На первый взгляд это мо жет показаться ошибкой, поскольку указатель находится над изображе нием кнопки, Flash все равно будет реагировать на щелчок корректно.

Существует возможность создания кнопок, при работе с которыми данный эф фект возникать не будет. Кроме того, вы можете разрабатывать многокнопочные интерфейсы или навигационные панели, где каждая отдельная кнопка может вы зывать воспроизведение определенной части фильма и служить в качестве «книж ной закладки».

В следующем примере мы расскажем вам, как создавать навигационную панель с двумя кнопками. Хотя данная задача не является сложной, ис пользуемая техника может быть применена для создания больших и более сложных интерфейсов. Необходимые файлы вы найдете на прилагаемом компакт-диске.

Файл с именем находится в каталоге Chapter 13.

Хотя описываемый процесс достаточно прост, в нем особое внимание уделяется обес печению согласованности элементов панели. Все инструкции необходимо выполнять предельно внимательно!

262 Глава 13. Создание интерактивных элементов управления Чтобы создать навигационную панель с несколькими кнопками, проделайте сле дующее.

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

2. Имея в своем распоряжении кнопку, вы можете приступать к разработке на вигационной панели. С помощью инструмента Rectangle создайте прямоуголь ник на всю ширину области действия. Высота прямоугольника должна быть достаточной для размещения кнопки.

3. Теперь добавить на панель кнопку. Добавьте новый слой, выбрав ко манду New Layer меню Insert. Нет технической необходимости размещать эле менты в различных слоях, однако хорошая организация дела всегда помогает в работе. Присвойте новому слою имя buttons. Более об организа ции содержимого слоя и работе со слоями речь шла в главе 8.

4. С помощью мыши перетащите символ кнопки из окна в левый угол навигационной панели и убедитесь, что экземпляр кнопки был помещен в слой buttons.

5. Повторите шаг 4, создав второй экземпляр кнопки. На этот раз поместите изображение справа от первой кнопки. Эти две кнопки будут служить эле ментами управления навигационной панели.

ц 1 - scene 6. Далее необходимо добавить какой-либо текст, который поможет определять, с какой частью фильма связана та иная кнопка. Создайте новый слой и назовите его text. Используя инструмент Text, создайте надписи, как указано ниже в инструкции.

> Рядом с первой кнопкой создайте текстовое поле и введите в нем над пись Scene 1.

> Рядом со второй кнопкой создайте текстовое поле и введите в нем надпись Scene 2.

Создание сложных кнопок > На панели Properties увеличьте величину знаков и введите надпись Scene в центре области действия. Данное текстовое поле будет использоваться в качестве временного маркера при тестировании кнопок навигационной панели.

Более подробно об использовании инструмента Text мы рассказывали в главе 5.

7. Последним этапом настройки панели будет связывание дей ствия с кадром для корректного воспроизведения сцен фильма. Создайте но вый слой, выбрав команду Layer меню Insert, и назовите его Щелкните в первом пустом ключевом кадре слоя actions и откройте панель Actions, вы брав команду Actions меню Window, или нажмите клавишу F9. Откройте подка тегорию Actions Movie Control и с помощью мыши перетащите действие на область отображения сценария.

8. Создание всех базовых элементов первой сцены завершено. Теперь необходи мо создать еще сцену.

9. Для этого откройте панель Scene, выбрав команду Scene меню Window или воспользовавшись комбинаци ей клавиш Создайте дубликат первой сцены, для чего щелкните на кнопке Duplicate Scene (Дублиро вать сцену) в нижней части панели Scene.

По умолчанию Flash присвоит дубликату имя Scene сору. Щелкните на имени сцены и присвойте ей новое имя 2. Кнопка Duplicate Scene СОВЕТ При создании навигационных панелей дублирование сцен очень полезно. Поскольку новая сцена является точной копией первой сцены, все элементы навигационной пане ли будут расположены в тех же позициях.

10. Используя инструмент Text, исправьте расположенную в центре об ласти действия, на Scene 2. Каждая сцена должна несколько от личаться от предыдущей. При проверке фильма это позволит нам определить, работают все сцены корректно или нет.

И. Теперь необходимо связать с кнопкой действие, чтобы при щелчке на ней осуществлялся переход к новой сцене. Перейдите к сцене Scene 1. Выберите кнопку, расположенную справа. Откройте панель Actions, для чего выберите команду Actions меню Window.

12. Свяжите с кнопкой действие, при выполнении которого будет осуществлять ся переход к первому кадру сцены Scene 2. Код действия будет следующим:

} Более подробно о связывании действий мы рассказывали в главе 12.

264 Глава 13. Создание интерактивных элементов управления 13. Используйте панель Scene для перехода к сцене Scene 2. Повторите те же шаги для кнопки, расположенной слева. Однако код действия должен выглядеть так:

} 14. Вы создали навигационную панель, с помощью которой можно переключать ся между сценами фильма. Чтобы проверить работу кнопок, выберите коман ду Test Movie меню Control.

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

Откройте окно библиотеки, выбрав команду Library меню Window либо нажав клавишу F11.

16. Выполните двойной щелчок на значке кнопки в окне библиотеки, чтобы от крыть данный символ в режиме редактирования. Щелкните на третьем клю чевом кадре (состояние Down).

17. Создайте новый символ, выбрав команду New Symbol меню Insert. В диалого вом окне Create New Symbol переключатель типа символа установите в положе ние Graphic (Графический) и присвойте новому символу имя Щелк ните на кнопке ОК и перейдите к главной временной шкале, выбрав команду Edit Document меню Edit.

18. Используя новый графический символ bookmark, вы можете создать элемент навигационной панели, который будет действовать как закладка. Перейдите к сцене Scene 1 и щелкните на первой кнопке навигационной панели.

19. На панели Properties щелкните на кнопке Swap Symbol (Замена сим вола). В открывшемся диалого вом окне Swap Symbol замените экземпляр символа кнопки Scene на графический символ, который вы только что создали. При этом на область действия вместо кноп ки будет помещен графический символ, который будет испол нять роль закладки в сцене Scene 1.

20. Перейдите к сцене Scene 2 и повторите шаги 18 и 19, однако на этот раз заме ните кнопку, расположенную справа.

21. Итак, создание фильма завершено. Точнее, завершено создание навигацион ной панели. Чтобы проверить ее работоспособность, выберите команду Test Movie меню Control. Обратите внимание на то, как символ bookmark действует в качестве закладки. При щелчке на кнопке для перехода к сце не изображение кнопки не меняется.

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

Для расширения возможностей интерактивных элементов управления в но вой версии Flash MX вы можете использовать объект Button языка Ас Более подробно об объекте Button и об альтернативном методе созда ния навигационных панелей с помощью сценариев мы расскажем в главе 16.

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

По своей природе интерактивные продукты предусматривают наличие како го-либо элемента управления. Зрители должны иметь возможность настраивать изображение в соответствии со своими предпочтениями. В качестве элемента управления обычно используется кнопка. При щелчке на кнопке происходят те или иные изменения в фильме. Такая техника проста и эффективна.

Однако проблема состоит в том, что в некото рых проектах использование кнопок не столь эффективно. Безусловно, для создания навига ционных панелей определенных информацион ных структур кнопки вполне пригодны. Напри мер, если вам необходимо представить большой объем информации, вы можете разбить ее на разделы и использовать кнопки для перехода от одного раздела к другому. Такая схема удобна как для дизайнера, так и для зрителей. Но ино гда бывает необходимо создать презентацию, в которой сам вид кнопки должен заинтересовать зрителя. В таком случае вам не обходимо использовать навигационную структуру наподобие той, что использу ется для газетных интернет-изданий.

В фильме «некнопочная» кнопка должна действовать как обычная кнопка и, кроме того, выражать идею проекта. Кнопки — это элементы, хорошо знакомые зрителям. Они прекрасно работают в качестве элементов навигационных пане лей. Однако в некоторых специальных фильмах простых кнопок может испортить впечатление от всего проекта.

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

Pages:     | 1 |   ...   | 2 | 3 || 5 | 6 |   ...   | 11 |



© 2011 www.dissers.ru - «Бесплатная электронная библиотека»

Материалы этого сайта размещены для ознакомления, все права принадлежат их авторам.
Если Вы не согласны с тем, что Ваш материал размещён на этом сайте, пожалуйста, напишите нам, мы в течении 1-2 рабочих дней удалим его.