В этом уроке мы продолжаем работать с событиями мыши. Только тут я уже расскажу, как привязать эти события к кнопкам.
Пример: Кнопка Play и Stop
1. Первый слой назови – «анимация»
2. На сцене создай анимацию движения объекта из одной точки в другую. Я взяла растровую картинку в качестве объекта. Ты можешь создать простой объект – прямоугольник, окружность(объект должен быть сгруппирован – меню Modify – Group; Модификация - Группировать);
или импортируй в сцену картинку – меню File – Import – Import to stage; Файл – Импорт – В рабочую область .
Кратко о том, как создать анимацию движения:
• Выдели 30 кадр(например) слоя «Анимация».
• Нажми F6 – создание ключевого кадра
• Передвинь объект на сцене в другое место
• Правой клавишей щелкни по серой полоске между 1-м и 30-м кадрами и выбери Motion tween – Анимацию движения. Для CS4 выберите Classic tween – Классическую анимацию движения
• Протестируй мувик Ctrl+Enter
Здорово получилось)
3. Создай второй слой – назови его «Button» (можно по-русски – «Кнопки»)
4. На сцене, где-нибудь в углу создай два объекта – прямоугольник и треугольник – это будущие кнопки Play и Stop.
5. По каждому из созданных объектов щелкни правой клавишей и выбери Convert to Symbol – Преобразовать в символ (F8)
6. Оба символа сделай кнопками - Button.
7. На сцене выдели треугольник и в панели Properties – Свойства в поле Instance name – Имя экземпляра впечатай имя кнопки – «play_btn». Это делается для того, чтобы в дальнейшем была возможность в скрипте ссылаться на эту кнопку. В предыдущем уроке я об этом рассказывала.
8. На сцене выдели прямоугольник и в панели Properties – Свойства в поле Instance name – Имя экземпляра впечатай имя кнопки – «stop_btn».
9. Создай третий слой – назови его «action»
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(); }
Отлично. Все работает!!!