WebMIEM
ВебМИЭМ

Flash AS 3.0 - Урок 2: Работа с событиями и функциями

Flash AS 3.0 - Урок 2: Работа с событиями и функциями

Сообщение PETERs602 » Ср мар 31, 2010 7:36

Adobe Flash ActionScript 3.0 - Урок 2: Работа с событиями и функциями
Системные требования: Adobe Flash CS3 или CS4
Lesson02.zip
Adobe Flash ActionScript 3.0 - Урок 2: Работа с событиями и функциями
(628.87 Кб) Скачиваний: 607


Создание слушателей событий и функций их обработки.
Прослущивание событий и реагирование на них в ActionScript делится на две части. Одна часть кода - метод addEventListener() - прослушивает определённое событие от определённого объекта. Другая часть кода, которая называется функцией для обработки события, реагирует на произошедшее событие.

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

1. Создайте новый слой над слоем text и назовите его buttons.
2. На 2 кадре слоя buttons добавьте ключевой кадр.
3. Откройте панель Components(Windows->Components).
4. Выберите компонент Button в списке User Interface на панели Components и перетащите два экземпляра компнента Button в правый нижний угол 2 кадра слоя buttons.
5. Открыть панель Component Inspector (Window->Component Inspector) и найти свойство label.
6. В поле справа от label написать Home и нажать клавишу Enter(Return в MacOS). Вы увидете, что после этого на кнопке появится слово Home. таким образом вы сможете писать текст на стандартных кнопках.
7. Выделить вторую кнопку и по аналогии(пункты 5-6) назвать её Flash Support.
8. Теперь мы присвоим названия кнопкам, которые мы будем использовать в ActionScript для индификации и обращению к этим кнопкам.
Выделите кнопку Home и на панели Properties напишите home_btn в поле <Instance Name>.
9. Выделите кнопку Flash Support и аналогичным способом назовите её help_btn.

Добавление функций для реагирования на щелчки мыши.
1. Выберите кадр 2 в слое actions, а затем на панели Actions вставьте новую строку ниже существующего кода.
2. Введите следующий код:
Код: Выделить всё
home_btn.addEventListener(MouseEvent.CLICK, goHome);
help_btn.addEventListener(MouseEvent.CLICK, goHelp);

Данный код будет вызывать функции при нажатии мышкой на кнопку.
3. Затем после только что написанного кода добавьте:
Код: Выделить всё
function goHome(e:MouseEvent):void {
   gotoAndStop("home");
}
function goHelp(e:MouseEvent):void {
   navigateToURL(new URLRequest("http://www.adobe.com/support/flash"));
}

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

4. Сохраните файл и протестируйте ролик.

Добавление кнопки повтороного запуска.
Теперь можно добавить функцию для возможности повтороного запуска анимации.

1. Добавьте ключевой кадр на 50 кадре слоя buttons.
2. Выделите кнопку Home на сцене.
3. При выделенной кнопке Home откройте Component Inspector и замените текст с Home на Restart.
4. Не снимая выделение с компонента Restart, переключитесь на окно Properties и измените имя экземпляра кнопки с home_btn на restart_btn.
5. Выберите кадр home на слое actions и добавьте следующий код:
Код: Выделить всё
restart_btn.addEventListener(MouseEvent.CLICK, goStart);
function goStart(e:MouseEvent):void {
   gotoAndPlay("loop");
   count=1;
}

6. Сохраните файл и протестируйте ролик.
Обратите внимание, что когда воспроизведение дойдет до кадра home, надпись Home на кнопке изменится на Restart.

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

1. Выберите кадр loop в слое actions.
2. Найдите на панели Actions строку:
Код: Выделить всё
info_txt.text = String(count);
и замените её на:
info_txt.text = "The animation has played " + String(count) + " x.";

Для того чтобы сформировать предложение, с помощью знаков «+», выполняется конкатенация (объединение) введеных текстовых строк (в кавычках) со значением переменной count.

3. Сохраните файл и протестируйте ролик.

Добавление кнопок для выбора языка.
1. Добавьте на слой buttons три кнопки с названиями: English, German и Spanish. На панели Properties дайте им названия english_btn, german_btn и spanish_btn.
2. Выберите кадр 1 на слое actions и добавьте следующий код:
Код: Выделить всё
var language:String = "English";

3. Найдите во 2 кадре слоя actions следующую строку:
Код: Выделить всё
info_txt.text = "The animation has played " + String(count) + " x.";

и замените её на:
Код: Выделить всё
function setLanguage():void {
   if(language == "English") {
   info_txt.text = "The animation has played " + String(count) + " x.";
} else if(language == "German") {
   info_txt.text = "Die Animation wurde "  + String(count) + "x abgespielt.";
} else if(language == "Spanish") {
   info_txt.text = "La animación ha jugado "  + String(count) + "x."  ;
}
}
setLanguage();

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

4. Теперь мы добавим следующий код для отслеживания нажатий кнопок:
Код: Выделить всё
english_btn.addEventListener(MouseEvent.CLICK, setEnglish);
german_btn.addEventListener(MouseEvent.CLICK, setGerman);
spanish_btn.addEventListener(MouseEvent.CLICK, setSpanish);

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

5. Добавьте следующий код:
Код: Выделить всё
function setEnglish(e:MouseEvent):void {
   language = "English"
   setLanguage();
}
function setGerman(e:MouseEvent):void {
   language = "German"
   setLanguage();
}
function setSpanish(e:MouseEvent):void {
   language = "Spanish"
   setLanguage();
}

6. Сохраните файл и протестируйте ролик.

Самостоятельные задания:
1. Добавьте русский язык.
2. Переведите текст на кадре home, чтобы он менялся взависимости от выбранного языка, как во время воспроизведения анимации.
3. Используя такойже код, как и для кнопки Flash Support, добавьте другие кнопки, с помощью которых можно будет перейти к разным ресурсам.
4. С помощью похожего на используемый код для кнопки Home добавьте кнопки для перехода к определенным кадрам анимации и для остановки проигрывания на них.
Аватара пользователя
PETERs602
Site Admin
 
Сообщения: 810
Зарегистрирован: Ср сен 06, 2006 0:42
Откуда: Д123

Вернуться в Общий

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 4

cron
line
www.WebMIEM.ru © 2006-2010