Иллюстрированный самоучитель по Web-разработке на Macromedia Studio MX

Кнопки во Flash MX. Создание кнопки.

Для того чтобы создать кнопку в приложении Flash MX, не нужно быть семи пядей во лбу. Кнопка во Flash – это не более чем клип из четырех кадров. Три кадра содержат изображения кнопки для каждого из состояний – Up, Down и Over. Четвертый кадр определяет активную область кнопки, т.е. то ее место, на котором курсор изменяет свой вид при просмотре в браузере.

Как и в Fireworks, любой графический объект на сцене Flash MX может быть преобразован в кнопку. Аналогично, кнопки с состояниями Up, Down и Over являются символами. В этом разделе мы поговорим о том, как создать и проверить кнопку во Flash MX. Вы узнаете, как, комбинируя приложения FreeHand, Fireworks и Flash, можно создать по-настоящему впечатляющие кнопки.

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

Создание кнопки во Flash MX

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

Для того чтобы создать кнопку во Flash MX, сделайте следующее.

1. Откройте новый документ Flash MX и установите белый цвет сцены. Добавьте слой и назовите его Text.
2. Выделив этот слой, выберите инструмент Text и введите слово Macromedia. Шрифт выберите по своему усмотрению, а размер – 24 пункта. Снимите выделение со слова, еще раз выберите инструмент Text и введите New Riders. Разместите слова на сцене одно над другим и оставьте место для круглой кнопки над каждым словом.
3. Выберите в меню Insert › New Symbol или нажмите клавиши CTRL + F8. Откроется диалоговое окно Create New Symbol. Назовите символ Macromedia и выберите в списке Properties пункт Button. Для редактирования откроется шкала времени кнопки.

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

4. Добавьте ключевой кадр в кадр Up, нарисуйте синий круг и выровняйте его по центру сцены. Добавьте ключевой кадр в кадр Over. Появится символ Up. Измените его цвет на красный и добавьте ключевой кадр в кадр Down.
5. Появится символ Over, измените его цвет на зеленый. Добавьте ключевой кадр в кадр Hit, и появится символ Down. Можете нарисовать квадрат на этом символе для определения активной области, а можете оставить как есть. В зависимости от этого активная зона будет квадратной или совпадать со всей кнопкой.
6. Ваша кнопка должна выглядеть так, как на рис. 17.4. Выделите кнопку в панели Library и выберите в списке Library пункт Duplicate Symbol. Назовите символ New Riders.

   
   Рис. 17.4. Разные состояния кнопки созданы на ее шкале времени

   Совет
   Для того чтобы проверить разные состояния кнопок, выберите в меню Control › Enable Simple Button или нажмите клавиши CTRL + ALT + B. Наведите курсор на каждую из кнопок и щелкните мышью на них. Посмотрите, как изменяются кнопки. Эта функция хотя и полезна, но не очень удобна, так как включив ее, вы не сможете выделить кнопку на сцене. Нужно все время следить за тем, чтобы не отключить эту функцию после очередной проверки кнопок.

7. Дважды щелкните на рисунке символа в панели Library. Откроется окно Button Symbol Editor. Измените цвет обоих состояний и щелкните на кнопке Scene 1. Таким образом, вы перейдете на главную шкалу времени. Выделите 1-й кадр в главной шкале времени и перетащите экземпляр кнопки Macromedia к слову Macromedia на сцене. Повторите то же самое для кнопки New Riders.