Создание кнопки - Уроки для новичков - Школа flash

Главная » Школа flash » Уроки для новичков

Создание кнопки

В этом уроке вы научитесь создавать экземпляр типа кнопка и работать с ним.
В уроке будет использоваться Action Script 2.0 (Поддерживается от flash 6.0 (MX))

Итак, приступим.

1. Создайте новый документ flash произвольных размеров. Например, 150x110.

2. Теперь нам нужно импортировать графику для кнопки. Зайдите в Файл > Импорт > Импортировать в рабочую область, и выберите графчиеский файл, который послужит основой для вашей кнопки.

3. После импортирования расположите ваш графический файл в нужном месте, перетягивая его курсором мыши.

4. Выделите импортированный граф. файл нажатием ЛКМ, затем нажмите на клавиатуре кнопку F8, и в появившемся окне поставьте галочку в чебоксе "Кнопка" (2й с начала) и нажмите ОК.

5. Как мы заметили, кнопка обвелась синей рамкой. Можно протестировать ролик нажатием сочетания клавиш CTRL+ENTER и попробовать навести мышь на кнопку. Как вы видите, при наведении курсор меняется со стрелки на руку. Но кнопка кроме смены курсора больше никак не реагирует на мышь, поэтому в след. шаге мы зададим кнопке определенный стиль при наведении и нажатии.

6. Кликните ЛКМ два раза по кнопке чтобы войти в ее редактирование. После этого обратите внимание на TimeLine, как вы заметили она изменилась на 4 кадра с названиями: Вверх, прохождений, вниз, попаданий. Вот так это выглядит в программе:

Нас интересуют состояния "прохождений" и "вниз", и сейчас мы приступим к их настройке. Выделите кадр "прохождений", нажмите по нему ПКМ и выберите создать пустой ключевой кадр. Импортируйте на него изображение, которое будет заменять изображение с кадра вверх при наведении.
Внимание! Изображение должно быть одинаковых размеров, чтобы кнопка выглядела красиво.
После того как вы импортировали картинку на кадр, выровняйте ее так, чтобы центр картинки был на крестике центровки

. Это нужно чтобы кнопка не смещалась при наведении.
Аналогичную операцию проделайте и над кадром вниз (Необязательно) После выполнения вышеуказанных операций протестируйте ролик (CTRL+ENTER), и попробуйте навести и нажать на кнопку. Обратите внимание на ее при этом поведение.

7. Мы задали кнопки оформление, осталось привязать к ней функционал. Для этого необходимо "приклеить" к кнопке небольшой AS сценарий. В нашем примере мы будем делать переход по указанному веб-адресу при нажатии на кнопку.
Итак, выйдите из окна редактирования стилей кнопки нажав на кнопку

.
Теперь выделите кнопку щелчком мыши, и нажмите кнопку F9, тем самым открыв панель для ввода кодов - "действия". Убедитесь, что ваша кнопка выделена, потому что код нужно привязать именно к кнопке. Если все в порядке, введите следующий код в панель "действия":
on(release) {
getURL("http Адрес", "_blank"); // Вместо "http адрес" укажите нужный Вам URL
}

8. Готово! Протестируйте кнопку, и вы увидите что при нажатии попадаете на указанный вами URL адрес :)

Удачи! С вами была команда школы flash =)