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

Пример: Кнопка Play и Stop

1. Первый слой назови – «анимация»
http://uploads.ru/t/I/6/U/I6UP5.jpg

2. На сцене создай анимацию движения объекта из одной точки в другую. Я взяла растровую картинку в качестве объекта. Ты можешь создать простой объект – прямоугольник, окружность(объект должен быть сгруппирован – меню Modify – Group; Модификация - Группировать);
или импортируй в сцену картинку – меню File – Import – Import to stage; Файл – Импорт – В рабочую область .
http://uploads.ru/t/L/O/b/LOb8v.jpg

Кратко о том, как создать анимацию движения:
• Выдели 30 кадр(например) слоя «Анимация».
• Нажми F6 – создание ключевого кадра
• Передвинь объект на сцене в другое место
• Правой клавишей щелкни по серой полоске между 1-м и 30-м кадрами и выбери Motion tween – Анимацию движения. Для CS4 выберите Classic tween – Классическую анимацию движения

• Протестируй мувик Ctrl+Enter
Здорово получилось)

3. Создай второй слой – назови его «Button» (можно по-русски – «Кнопки»)
http://uploads.ru/t/i/M/F/iMFjz.jpg

4. На сцене, где-нибудь в углу создай два объекта – прямоугольник и треугольник – это будущие кнопки Play и Stop.
http://uploads.ru/t/3/n/5/3n51Q.jpg

5. По каждому из созданных объектов щелкни правой клавишей и выбери Convert to Symbol – Преобразовать в символ (F8)

6. Оба символа сделай кнопками - Button.
http://uploads.ru/t/L/b/z/LbzcM.jpg

7. На сцене выдели треугольник и в панели Properties – Свойства в поле Instance name – Имя экземпляра впечатай имя кнопки – «play_btn». Это делается для того, чтобы в дальнейшем была возможность в скрипте ссылаться на эту кнопку. В предыдущем уроке я об этом рассказывала.
http://uploads.ru/t/0/i/U/0iUZw.jpg

8. На сцене выдели прямоугольник и в панели Properties – Свойства в поле Instance name – Имя экземпляра впечатай имя кнопки – «stop_btn».
http://uploads.ru/t/5/T/d/5TdNf.jpg

9. Создай третий слой – назови его «action»

http://uploads.ru/t/r/w/c/rwcoj.jpg

10. В первом кадре слоя «action» щелкни правой и в меню выбери Action – Действия (F9)

11. Напиши такую строчку:

Код:
stop(); //останавливает анимацию в самом начале

12. Протетируй мувик. Все правильно. Ничего не движется

13. Теперь нужно сделать так, чтобы кнопка Play смогла запустить анимацию. И тут придется вспомнить, что такое событие. Ведь нажатие на кнопку – это и есть событие.

Код:
/*создаем слушателя событий для кнопки play_btn. Событие MouseEvent.CLICK – тоесть пользователь делает щелчок на кнопке Play_btn*/
play_btn.addEventListener(MouseEvent.CLICK, playF); 

/*Создаем функцию, которая и будет выполняться запуск анимации при щелчке мышью на кнопке*/
function playF(Event:MouseEvent):void {
play();
}

14. Весь код:

Код:
stop();
play_btn.addEventListener(MouseEvent.CLICK, playF);

function playF(Event:MouseEvent):void {
play();
}

Если ты сейчас протестируешь ролик, то работать будет пока только кнопка Play.

15. Теперь нужно сделать так, чтобы кнопка Stop смогла останавливать анимацию. И снова нам нужно событие. Здесь представлен полный код для 1-го примера:

Код:
stop();

play_btn.addEventListener(MouseEvent.CLICK, playF);
stop_btn.addEventListener(MouseEvent.CLICK, stopF);

function playF(Event:MouseEvent):void {
play();
}
function stopF(Event:MouseEvent):void {
stop();
}

Вот, что получилось!

Отлично. Все работает!!!