Практикум по программированию для Adobe Flash
advertisement
ФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ
ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ВЫСШЕГО
ПРОФЕССИОНАЛЬНОГО ОБРАЗОВАНИЯ
ЮЖНЫЙ ФЕДЕРАЛЬНЫЙ УНИВЕРСИТЕТ
МИХАЙЛИЧЕНКО В.Н.
Учебное пособие
ПРАКТИКУМ ПО ПРОГРАММИРОВАНИЮ ДЛЯ ADOBE FLASH
Для направлений:
09.03.02 Информационные системы и технологии (бакалавриат)
09.04.03 Прикладная информатика в естественнонаучном образовании
(магистратура)
Ростов-на-Дону
2014
Михайличенко В.Н
Практикум по программированию для Adobe Flash
2/55
ОГЛАВЛЕНИЕ
ВВЕДЕНИЕ .............................................................................................................. 5
ЛАБОРАТОРНАЯ РАБОТА №1 ........................................................................... 6
Тема: Создание и программирование кнопок . Свойства объектов
MovieClip и кнопок. ............................................................................................. 6
Элементы программирования Flash ............................................................... 6
Создание кнопок ............................................................................................... 8
ЗАДАНИЕ №1 ................................................................................................ 10
Создание обработчиков событий кнопок .................................................... 10
Создания сценария кнопки ............................................................................ 11
События кнопок .............................................................................................. 11
Свойства кнопок и фрагментов ролика (MovieClip)................................... 12
Координаты и размеры символов ................................................................. 13
ЗАДАНИЕ №2 ................................................................................................ 13
Контрольные вопросы к лабораторной работе №1 ........................................ 17
ЛАБОРАТОРНАЯ РАБОТА №2 ......................................................................... 17
Тема: Управление проигрыванием флеша. Встраивание ролика в вебстраницу. ................................................................................................................ 17
Методы управления проигрыванием флеша ............................................... 17
ЗАДАНИЕ №1 ................................................................................................ 18
Встраивание ролика в html-страницу ........................................................... 19
ЗАДАНИЕ №2 ................................................................................................ 20
ЗАДАНИЕ № 3 ............................................................................................... 21
Контрольные вопросы к лабораторной работе №2 ........................................ 22
ЛАБОРАТОРНАЯ РАБОТА №3 ......................................................................... 22
Тема: Cвойства клипов. Сценарии кнопок и клипов. .................................... 22
Обработка событий MovieClip в стиле ActionScript 1.0 ............................. 22
События мыши ............................................................................................... 24
Свойства объектов MovieClip ....................................................................... 24
ЗАДАНИЕ №1 ................................................................................................ 25
ЗАДАНИЕ №2 ................................................................................................ 26
ЗАДАНИЕ №3 ................................................................................................ 27
ЗАДАНИЕ №4 ................................................................................................ 27
Размеры клипа. Свойства _height, _width, _xscale, _yscale ........................ 28
ЗАДАНИЕ №5 ................................................................................................ 28
ЗАДАНИЕ №6 ................................................................................................ 29
Контрольные вопросы к лабораторной работе №3 ........................................ 29
Михайличенко В.Н
Практикум по программированию для Adobe Flash
3/55
ЛАБОРАТОРНАЯ РАБОТА №4 ......................................................................... 30
Тема: Сценарии клипа и кадра ......................................................................... 30
Использование абсолютной и относительной адресации в сценариях
клипов и кнопок.............................................................................................. 30
ЗАДАНИЕ №1 ................................................................................................ 32
Методы обработки событий ActionScript 2.0 .............................................. 33
Создание методов-обработчиков .................................................................. 34
ЗАДАНИЕ №2 ................................................................................................ 34
ЗАДАНИЕ №3 ................................................................................................ 35
Задание №4...................................................................................................... 35
Контрольные вопросы к лабораторной работе №4 ........................................ 36
ЛАБОРАТОРНАЯ РАБОТА №5 ......................................................................... 36
Тема: Генерация случайных чисел. Функция eval(). Свойство
_currentFrame. Игра крестики-нолики...................................................... 36
Случайные числа ............................................................................................ 36
Округление до целого числа ......................................................................... 37
Определение размеров рабочей области...................................................... 37
ЗАДАНИЕ 1 .................................................................................................... 38
ЗАДАНИЕ 2 .................................................................................................... 38
ЗАДАНИЕ 3 .................................................................................................... 38
Преобразование строк в идентификаторы. Функция eval() .................. 39
ЗАДАНИЕ 4 .................................................................................................... 39
ЗАДАНИЕ 5 .................................................................................................... 39
Определение номера проигрываемого кадра. ............................................. 40
Свойство _currentframe.......................................................................... 40
Обработка хода в игре ................................................................................... 40
Определение положения выбранной клетки ............................................... 40
ЗАДАНИЕ 6 .................................................................................................... 41
ЗАДАНИЕ 7 (дополнительное) ..................................................................... 41
Программирование ходов компьютера ........................................................ 42
ЗАДАНИЕ 8 .................................................................................................... 44
Контрольные вопросы к лабораторной работе №5 ........................................ 44
ЛАБОРАТОРНАЯ РАБОТА №6 ......................................................................... 45
Тема: Программное создание анимации. Событие onEnterFrame.
Функция setInterval() .............................................................................. 45
Событие EnterFrame ....................................................................................... 45
Создание, изменение и удаление методов-обработчиков .......................... 45
ЗАДАНИЕ 1 .................................................................................................... 46
Михайличенко В.Н
Практикум по программированию для Adobe Flash
4/55
ЗАДАНИЕ 2 .................................................................................................... 46
ЗАДАНИЕ 3 .................................................................................................... 47
Функция setInterval ......................................................................................... 47
ЗАДАНИЕ №4 ................................................................................................ 48
ЗАДАНИЕ №5 ................................................................................................ 48
ЗАДАНИЕ №6 ................................................................................................ 50
Обновление экрана ......................................................................................... 50
ЗАДАНИЕ №7 ................................................................................................ 50
ЗАДАНИЕ №8 ................................................................................................ 50
ЗАДАНИЕ №9 (дополнительное) ................................................................. 50
Контрольные вопросы к лабораторной работе №6 ........................................ 51
ЛАБОРАТОРНАЯ РАБОТА №7 ......................................................................... 51
Тема: Программное создание, удаление и поворот экземпляров клипов... 51
Свойство _rotation .......................................................................................... 51
ЗАДАНИЕ №1 ................................................................................................ 51
Функция atan2.............................................................................................. 52
ЗАДАНИЕ №2 ................................................................................................ 53
ЗАДАНИЕ №3 ................................................................................................ 54
ЗАДАНИЕ №4 ................................................................................................ 54
ЗАДАНИЕ №5 (дополнительное) ................................................................ 55
Контрольные вопросы к лабораторной работе №7 ........................................ 55
Рекомендуемая литература .................................................................................. 55
Интернет-ресурсы ................................................................................................. 55
Михайличенко В.Н
Практикум по программированию для Adobe Flash
5/55
ВВЕДЕНИЕ
Предлагаемое учебное пособие представляет собой практикум по
программированию для Adobe Flash, объединяющий семь лабораторных
работ. Каждая из работ включает в себя несколько разделов:
теоретическую часть, с разъяснением основного материала по теме
работы и примерами выполнения заданий;
задания для практического выполнения обучаемыми;
контрольные вопросы по теме работы, на которые необходимо
ответить при ее защите;
Основная задача практикума — последовательно развить базовые
навыки, необходимые для создания высококачественных сложных анимаций,
применимых в информационных ресурсах разного назначения, включая
компьютерные обучающие программы.
Основные вопросы, решаемые практикумом:
создание
интерактивных
анимаций,
управление
их
проигрыванием и создания пользовательского интерфейса,
получение практических навыков создания сценариев на
ActionScript,
свойства и методы основных объектов, объектная модели Flash,
методики обработки событий;
создания сценариев кнопок, клипов, кадров;
использования внешних данных и роликов;
использование встроенных компонентов для реализации
интерфейса.
Технология Flash появилась в середине 1990-х годов и быстро нашла
применение в Интернете. Она позволила решить острую на тот момент
проблему кроссбраузерной и кроссплатформенной совместимости. Это
достигалось путем встраивания в браузер специальной программы (плагина),
называемой — флеш-плейером.
Так как дизайн веб-страниц стал приобретать первостепенное значение,
то флеш-анимаций стали эффектным и эффективным инструментом его
реализации. Флеш-ролики стали активно применяться для повышения
интерактивности пользовательского интерфейса, для создания броской
рекламы, для разработки элементов обучающих программ и т.п..
Динамичность и интерактивность графики в технологии Flash
обеспечивается за счет использования объектно-ориентированного языка
программирования ActionScript, основанного на стандарте ECMAScript 262
(другой популярный его диалект — Javascript). Вместе с объектной моделью
Михайличенко В.Н
Практикум по программированию для Adobe Flash
6/55
документа и продуманной событийной архитектурой этот язык
программирования
обеспечивает
высокую
интерактивность
пользовательского интерфейса.
В последние годы стало распространяться мнение, что актуальность
flash-технологии осталась в прошлом. Это связано, в первую очередь, с
отказом от поддержки проигрывания flash-роликов на некоторых мобильных
платформах. Возникает вопрос об актуальности предлагаемого учебного
пособия.
В роли альтернативы флеш-технологии выступает совокупность
спецификаций, объединенных понятием HTML 5. Действительно, в них
появились возможности для реализации простых анимаций, которые
реализуется стандартными средствами браузеров. Например, некоторыми
стилевыми свойствами CSS3.
Однако, на современном этапе (и на ближайшую перспективу)
выразительные возможности новых технологий заметно уступают Flash, и в
создании сложных анимаций конкурировать не могут. Нужно отметить
также, что компания Adobe — владелец технологии Flash, разработала для
создания анимаций, реализуемых средствами HTML 5, новый инструмент
Adobe Edge, который в основном повторяет среду разработки Adobe Flash.
Пособие построено так, что может применяться не только бакалаврами
и магистрантами в рамках основного учебного процесса, но и для
самостоятельного изучения технологии.
ЛАБОРАТОРНАЯ РАБОТА №1
Тема: Создание и программирование кнопок . Свойства объектов
MovieClip и кнопок.
Отчет: Файлы с выполненными заданиями.
Элементы программирования Flash
ActionScript
—
это
объектно-ориентированный
язык
интерпретируемого типа, основанный как и JavaScript, на стандарте
ЕСМА-262 ActionScript обеспечивает программы для среды Flash
инструментами, позволяющим управлять клипами и эффективно
реализовывать их интерактивность.
Панель Actions
Панель Actions служит для создания кода ActionScript. В ее правой
части находится редактор для написания кода.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
7/55
В левой части панели Actions располагается меню, из которого
можно выбрать любой элемент кода ActionScript. Элементы языка
рассортированы в нем по папкам исходя из выполняемых функций или
иерархической принадлежности. Список всех элементов языка в алфавитном
порядке можно получить, открыв папку Index.
Среда разработки ActionScript обладает возможностью завершения
кода. Когда, написав имя объекта, программист ставит точку (оператор
доступа к свойствам и методам), около курсора ввода появляется
специальное окно, содержащее список всех встроенных методов, событий и
свойств класса объекта. Выбрав из них необходимый элемент, выполните
двойной щелчок мышью или нажмите Tab , и элемент будет автоматически
добавлен в код.
Чтобы не прокручивать длинный список, достаточно набрать
несколько первых букв имени метода или свойства. Список прокрутится
автоматически
и
первой
подходящий
метод
будет
выделен.
Если
выделенный метод не подходит, продолжите набор букв.
Чтобы мастер завершения кода мог активизироваться, идентификатор
должен содержать в конце специальный суффикс. Этот суффикс показывает,
Михайличенко В.Н
Практикум по программированию для Adobe Flash
8/55
к какому классу относится объект. Суффиксы отделяются от имени при
помощи символа подчеркивания. Суффикс _mc является идентификатором
экземпляра клипа, например, s1_mc.
Суффикс _btn является идентификатором экземпляра кнопки,
например, b_btn.
Создание кнопок
Кнопки — это экземпляры символов класса Button. Кнопки должны
храниться в библиотеке.
Чтобы создать новую кнопку в меню Insert выберите пункт New
Symbol… или на панели Library нажмите кнопку
( New Symbol). В меню
Behavior (Type) появившейся панели Create New Symbol выберите пункт
Button. В результате откроется шаблон новой кнопки.
В рабочем поле находится только черный крестик — точка фиксации
символа (начало его системы координат). Вокруг этой точки будет
происходить поворот символа. Сместить ее нельзя,
надо разместить
относительно ее сам графический образ.
Временные диаграммы клипов и кнопок существенно отличаются.
Кадры кнопок по умолчанию отображаются более крупными, их нумерация
отсутствует.
Кадры временной диаграммы кнопки соответствуют ее четырем
возможным состояниям:
♦ Up — стандартный вид кнопки. Объекты, размещенные на данном
кадре, отображаются, если указатель мыши располагается вне кнопки (или ее
активность отключена при помощи свойства enabled);
♦ Over—вид кнопки при наведении на нее указателя мыши. Этот
режим
показывает
пользователю,
что
кнопка
готова
для
нажатия.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
9/55
Дополнительным его признаком является смена формы курсора со стрелки на
очертания руки;
♦ Down—вид кнопки при ее нажатии. Переход в данный режим
осуществляется, если при нажатии левой клавиши мыши ее указатель
располагался в активной зоне кнопки;
♦ Hit — особый кадр, служащий для задания активной зоны кнопки.
Активная зона — это область, чувствительная к наведению курсора мыши и
ее щелчку. Определяют ее объекты, расположенных на этом кадре. Сами
объекты не отображаются, а только определяют фактические границ кнопки.
Активная зона и кнопка как видимый объект могут не совпадать. Однако
обычно кнопка располагается в центре активной зоны. Если на кадре Hit не
имеется объектов, то для формирования активной зоны используются
объекты последнего заполненного кадра.
Чаще всего явно задавать активную зону необязательно. Это стоит
делать, если кнопка имеет сложную форму или отверстия, а также если ее
очертания в разных режимах сильно различаются. Отдельный случай—
кнопки в виде текста. Для них просто необходимо задать активную зону,
иначе их нажатие будет происходить лишь при "прямом попадании" курсора
по букве.
Если вид кнопки во всех режимах одинаков, то создать ее можно
более
просто. Для
этого
необходимо
выделить изображающую
ее
графическую фигуру и нажать <F8>. При этом появится панель Convert to
Symbol. После задания в ней нужных настроек новый символ будет добавлен
в библиотеку, а фигура будет преобразована в экземпляр. На временной оси
этой кнопки будет заполнен только один кадр UP.
Экземпляры
кнопок,
подобно
клипам,
могут
иметь
имена.
Прописываются они в поле Instance Name панели Properties. Для
возможности работы с мастером завершения кода имена кнопок должны
иметь суффикс _btn, например left_btn.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
10/55
ЗАДАНИЕ №1
Создать новый файл и в его библиотеке кнопку со следующими
кадрами Up, Over и Down. Область Hit не определять. Создать экземпляр
кнопки в рабочей области.
Протестировать кнопку во всех состояниях (Up, Over, Down). Какая
зона является активной (Hit).
1.
Создать в библиотеке дубликат первой кнопки. Определить для
дубликата область Hit следующим образом
2.
Добавить в кадр экземпляр второй кнопки. Протестировать ее
работу. Сохранить файл под именем Lab1_1.fla.
Создание обработчиков событий кнопок
В отличие от клипов, кнопки неразрывно связаны со сценариями
ActionScript. Если у кнопки нет обработчиков событий, то ее наличие
просто бессмысленно.
Оработчики событий кнопок можно помещать непосредственно на
сами экземпляры. Такие обработчики находятся в сценарии кнопки в
специальном окне Action Button (Действия кнопки). Создаются они по
следующей схеме:
on(event){ statements }
Михайличенко В.Н
Практикум по программированию для Adobe Flash
11/55
где:
on — ключевое слово, указывающее транслятору, что данная
структура является обработчиком;
event — имя события (press-кнопка нажата, release-отпущена и
т.д.);
statements — код, который должен быть выполнен при
возникновении события.
Создания сценария кнопки
► В кадре выделяем кнопку и переходим в окно ввода кода панели
Actions (F9).
► В левой части панели Actions записываем on.
► Записываем открывающую круглую скобку “ (“.
► Из списка автозавершения кода выбираем событие release. После
двойного щелчка мышки (нажатия клавишиTab) записываем закрывающую
круглую скобку ( “)” ) и получаем код on(release)
► Записываем открывающую фигурную скобку “{“ и нажимаем
Enter. Автоматически добавляется закрывающая фигурная скобка.
on(release){
}
► Осталось описать действия, выполняемые после освобождения
кнопки.
События кнопок
press — клавиша мышки нажата, когда курсор находится в
пределах кнопки;
Михайличенко В.Н
Практикум по программированию для Adobe Flash
12/55
release — клавиша мышки отжата, когда курсор находится в
пределах кнопки;
releaseOutside — клавиша мышки отжата, когда курсор
находится вне пределов кнопки;
rollOver — курсор мыши входит в пределы кнопки;
rollOut — курсор выходит за пределы кнопки;
dragOver — курсор входит в пределы кнопки, при этом была
нажата кнопка, и нажата клавиша мыши;
dragOut — курсор выходит за пределы кнопки, при этом была
нажата кнопка, и нажата клавиша мыши;
keyPress ("клавиша") — была нажата "клавиша". Список клавиш
можно посмотреть в справке по Flash (объект Key), или использовать
панель параметров для ввода нужной клавиши.
Свойства кнопок и фрагментов ролика (MovieClip)
а) _enabled
За активность кнопки отвечает свойство enabled. Если оно равно true,
left_btn._enabled=true;
то кнопка реагирует на мышку (принятое по умолчанию значение). Если же
ему присвоить false, кнопка станет неактивной.
Это означает следующее.
При наведении на кнопку указателя мыши она не будет переходить
в состояние Over. Аналогично, при попытке нажать кнопку
перехода в режимDown не будет.
При попадании в активную зону кнопки вид указателя мыши не
будет меняться со стрелки на руку.
Событий кнопки происходить не будет (кроме onSetFocus и
onKillFocus).
Если отключенная кнопка располагается над активной, то
последняя будет способна к восприятию событий.
б) _visible
Михайличенко В.Н
Практикум по программированию для Adobe Flash
13/55
Будет ли кнопки видна или нет определяет свойство visible. Если
оно равно true,
left_btn._visible =true;
то кнопка видна (принятое по умолчанию значение). Если же ему присвоить
false, кнопка станет невидимой.
Координаты и размеры символов
Координаты символов определяются значениями свойств _x и _y.
Для символов, которые находятся в кадре основной временной оси, _x —
расстояние по горизонтали от левого верхнего угла кадра и _y — расстояние
по вертикали от левого верхнего угла кадра в пикселах .
Если символ входит в другой символ (родительский), то координаты
дочернего символа определяются в системе координат родительского
символа. Для перемещения символа m_mc в точку с координатами
(200;125) надо выполнить следующий код
m_mc._x=200;
m_mc._y=125;
Размеры символов определяются значениями свойств _height (высота)
и _width (ширина) в пикселах. Следующий код сделает размеры символа
m_mc 100х200 пикселов
m_mc._ height=100;
m_mc._ width =200;
Изменение размера можно задавать и в процентах к первоначальному
значению. Чтобы увеличить высоту на 20% и ширину на 10%, надо
выполнить следующий код
m_mc._ xscale=110;
m_mc._ yscale+=20;
ЗАДАНИЕ №2
1. Создайте новый документ и назовите его слой "Небо". Сохраните
файл под именем "Lab1_2.fla".
2. Создайте символ звезды (тип — MovieClip). Экземпляр звезды
назовите s_mc. Создайте луну как символ.
3. В кадре создайте "небо" с одной звездой, которой будем управлять
с помощью кнопок.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
14/55
4. Создайте слой ”Кнопки”. Для размещения кнопок создайте "пульт
управления" в виде серого прямоугольника в нижней части рабочего поля.
Создайте и запрограммируйте серию кнопки для управления звездой s_mc.
4.1 Создадим две внешне одинаковые новые кнопки с надписями
"Start" и "Stop". После нажатия кнопки "Start" начинается перемещение
звезды за курсором мышки, а после нажатия кнопки "Stop" — прекращается.
Создание и программирование кнопок
4.1.1 Нажать кнопку внизу окна Library для Lab1_2.fla.
4.1.2 В окне Create New Symbol ввести имя символа startGrag
и указать тип — Button.
4.1.3 Создать образы для кадров Up, Over и Down кнопки.
4.1.4. Для выхода из режима редактирования символа нажать кнопку
или
. Кнопка startGrag создана.
4.1.5 Создайте дубликат кнопки startGrag:
● выделите в списке библиотечных символов startGrag;
● щелкните правой кнопкой мышки и в контекстном меню
выберите Duplicate;
● введите имя кнопки-копии stopGrag.
4.1.6 Отредактируйте кнопку stapGrag заменив надпись Start на
Stop.
4.1.7 Сделайте надпись Grag и разместите экземпляры созданных
кнопок в кадре.
4.1.8 Запрограммируем созданные кнопки.
Сценарий кнопки startGrag
on(release){
s_mc.startDrag(true);
}
Сценарий кнопки stopGrag
on(release){
Михайличенко В.Н
Практикум по программированию для Adobe Flash
15/55
s_mc.stopDrag();
}
4.1.9 Протестируйте работу кнопок.
4.2 После прекращения режима Grag звезда оказывается за кнопкой.
Чтобы вытащить ее оттуда, создадим кнопки, перемещающие звезду в 4-х
направлениях.
4.2.1 Flash содержит большое количество уже готовых кнопок,
которые хранятся в библиотечном файле Buttons.fla. Чтобы
воспользоваться ими надо в меню Windows выбрать Common Libraries и
затем Buttons.
Кнопки собраны в папки. Просмотрите некоторые папки, но
использовать будем кнопки из папки Key Buttons. Откройте ее.
4.2.2 Перетащите из окна библиотеки кнопки key-left,
key-right, key-up, key-down. Сделайте надпись "Перемещение".
Выровняйте надпись и кнопки.
4.2.3 Созданные кнопки должны изменять координаты звезды,
которые определяются свойствами s_mc._x и s_mc._y. Пусть каждое
нажатие кнопки изменяет значение соответствующей координаты на 20
пикселов. Например, код для кнопки key-left
on(release){
s_mc._x - = 20;
}
4.2.4 Запрограммируйте все четыре кнопки и протестируйте их
работу.
4.3 Создание изменяющих размер звезды кнопок.
4.3.1 Нам нужны кнопки с надписью на них " + " и " – ". Первая будет
увеличивать размер, а вторая — уменьшать.
В папке Key Buttons общей библиотеки кнопок есть кнопка key –
labelled button.
Перетащите ее в список символов библиотеки
Lab1_2.fla.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
16/55
4.3.2 Создайте дубликат key – labelled button под именем key+.
В режиме редактирования замените надпись на нем на " + ".
4.3.3 Создайте дубликат key – labelled button под именем key-.
В режиме редактирования замените надпись на нем на " - ".
4.3.4 Разместите на "пульте управления" экземпляры новых кнопок.
Сделайте надпись "Размеры".
4.3.5 Экземпляр кнопки key+ увеличивает размеры на 20 пикселов.
s_mc._height + = 20;
s_mc._widht + = 20;
Экземпляр кнопки key- уменьшает размеры на 20 пикселов
4.3.6 Запрограммируйте кнопки и протестируйте их работу.
4.4 Создание кнопок, которые "прячут" и "показывают" звезду.
4.4.1 Создайте дубликат key – labelled button под именем key
view. В режиме редактирования замените надпись на нем на " view ".
Для того, чтобы звезда стала видимой, надо свойству _visible
присвоить значение true.
Создайте дубликат key – labelled button под именем key hide. В
режиме редактирования замените надпись на нем на " hide ".
Для того, чтобы звезда стала невидимой, надо свойству _visible
присвоить значение false.
4.4.2 Разместите на "пульте управления" экземпляры новых кнопок.
Сделайте надпись "Видимость". Запрограммируйте кнопки.
4.4.3 Протестируйте работу флеша.
4.5 Перепрограммируйте экземпляры кнопок
так, чтобы они
показывали/cкрывали и звезду и луну.
4.6 Если звезда уже видна – экземпляр кнопки key view надо
дезактивировать. Так в самом начале работы флеша надо заблокировать
работу этой кнопки. А если звезда уже не видна, надо заблокировать кнопку
key hide.
Попробуйте сделать это самостоятельно. Аналогичным образом
можно перепрограммировать кнопки Start и Stop.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
17/55
Контрольные вопросы к лабораторной работе №1
1. Структура панели Action.
2. Возможности автозавершения кода в среде Flash CS3 Professional.
3. Использование библиотечных кнопок. Временная ось кнопок.
4. Создание собственных кнопок. Редактирование кнопок.
5. Окно сценария кнопок. Что может в нем содержаться?
6. Синтаксис обработчиков кнопок.
7. События кнопок.
8. Свойства кнопок и экземпляров MovieClip.
9. Могут ли свойства _xscale
и _yscale принимать
отрицательные значения?
10. Вопросы по коду заданий.
ЛАБОРАТОРНАЯ РАБОТА №2
Тема: Управление проигрыванием флеша. Встраивание ролика в
веб-страницу
Отчет: Файлы с выполненными заданиями.
Методы управления проигрыванием флеша
По умолчанию флеш автоматически проигрываться начиная с первого
кадра. Но иногда требуется запускать или прерывать выполнение анимации
по требованию пользователя, просматривать по кадрам или вернуть на
несколько кадров назад. Такой режим используется, в частности, при
создании флеш-презентации.
Методы
клипа (movie
clip), позволяющие управлять
проигрыванием его анимации:
play() — начинает или возобновляет воспроизведение анимации
клипа;
stop() — останавливает воспроизведение анимации клипа;
gotoAndPlay() — переходит на определенный кадр и продолжает
воспроизведение;
gotoAndStop() — переходит на определенный кадр и останавливает
воспроизведение;
nextFrame() — переходит на следующий кадр и останавливает
воспроизведение;
prevFrame() — переходит на предыдущий кадр и останавливает
воспроизведение.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
18/55
ЗАДАНИЕ №1
1. Создать новый документ и в нем анимацию падения листа по
заданной траектории.
2. Создать новый слой ”Actions”. Остановить автоматическое
проигрывание анимации. Для этого создать сценарий первого кадра слоя
”Actions”. В сценарии всего одна команда — stop();
Для размещения кода создать новый слой "Actions", выделить его
первый кадр и записать в поле кода панели Action комманду. Слой
"Actions" должен быть самым первым.
2. Чтобы анимация проигрывалась, надо создать кнопку,
запускающую проигрывание. В общей библиотеке кнопок Flash в папке
Playback есть кнопки, имеющие стандартные обозначения. Имена кнопок
говорят о их назначении.
Последние две кнопки осуществляют переход на один кадр вперед и
назад.
Кнопки предлагаются без кода, т.е. их действие
не
запрограммировано!
Создайте новый слой "Кнопки". Разместите кнопки в рабочей
области нового слоя. Т.к. кнопки, "болтающиеся" в пространстве не очень
хорошо выглядят, подложите под них "пульт" — прямоугольник.
3. Теперь надо кнопки запрограммировать. При их освобождении
должны выполняться простые комманды:
Михайличенко В.Н
Практикум по программированию для Adobe Flash
19/55
play();
stop();
gotoAndPlay(1);
nextFrame();
prevFrame();
4. Можно дорисовать осенний пейзаж, сделав сероватый фон,
коричневую землю и дерево на заднем плане (на каком слое его надо
рисовать?).
5. Протестируйте флеш.
6. Обозначения на кнопках стандартные, но, возможно, не все их
знают. Поэтому сделайте всплывающие подсказки.
При наведении курсора мышки на кноки рядом с ними должны
появляться надписи "Play", "Stop", "Rewind", "Next frame", "Prev
frame".
Для создания всплывающей подсказки:
двойным щелчком левой кнопкой мышки на кнопке войдите в
режим редактирования,
в кадре "Over" добавьте надпись в нужном месте,
выйти из режима редактирования.
7. Протестируйте флеш.
Встраивание ролика в html-страницу
В меню File выберите пункт Publish Settings…
В окне Publish Settings отметьте флажки Flash и HTML.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
20/55
а) Нажмите кнопку Publish. б) Закройте окно Publish Settings.
в) Просмотрите созданную html-страницу.
9. Откройте созданную html-страницу в любом простом текстовом
редакторе (Блокнот, Far или др.).
<HTML>
<HEAD>
<meta http-equiv=Content-Type content="text/html;
charset=">
<TITLE>Lab7_4</TITLE>
</HEAD>
<BODY bgcolor="#FFFFFF">
<!-- URL's used in the movie-->
<!-- text used in the movie-->
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8444553540000"
codebase="http://download.macromedia.com/pub/shockwave
/cabs/flash/swflash.cab#version=6,0,0,0"
WIDTH="550" HEIGHT="400" id="Lab7_4" ALIGN="">
<PARAM NAME=movie VALUE="Lab7_4.swf"> <PARAM
NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="Lab7_4.swf" quality=high bgcolor=#FFFFFF
WIDTH="550" HEIGHT="400" NAME="Lab7_4" ALIGN=""
TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/go/getflashplay
er"></EMBED>
</OBJECT>
</BODY> </HTML>
Изучите, как флеш вставляется в веб-страницу.
ЗАДАНИЕ №2
1.
Вставьте флеш задания №1 в html-страницу.
2.
Вставьте на страничке перед флешем несколько строчек,
например:
<H1>Управление выполнением флеша </H1> <br>
<H3> Выполнил студент(ы) Фамилия Имя </H3>
<br> <br> <br>
3. Чтобы вокруг флеша была рамка, после <OBJECT > вставьте
border = 1
Михайличенко В.Н
Практикум по программированию для Adobe Flash
21/55
4. Сохраните страничку и просмотрите ее.
Пояснение
В задании №1 мы управляли анимацией, которая находится на
временной оси корневого символа _root. Вообще можно управлять
анимацией любого символа.
ЗАДАНИЕ № 3
1. Создайте новый документ и назовите его слой "Небо". Сделайте
фон документа синим.
2. Создайте символ "звезду".
3. Анимируйте звезду. Она должна пульсировать и менять цвет.
4. Разместите звезды на слое. Сделайте их разного размера и поворота.
5. Нажмите Ctrl+Enter и посмотрите на свое небо.
6. Звезды пульсируют синхронно, что не совсем естественно
выглядит. Чтобы заставить их начинать проигрывать свою анимацию с
разных кадров, необходимо написать соответствующий код.
Чтобы можно было программно управлять звездами, надо дать им
имена. Выделите их по очереди и на панели Свойств (PROPERTIES)
внесите имя в поле, располагающееся под типом.
7. Звезды должны мигать по разному, то есть их анимация должна
начинать проигрываться с разных кадров. Для реализации такого поведения
надо использовать метод gotoAndPlay(номер_кадра).
Никакой кнопки для начала проигрывания анимации звезд с разных
кадров не надо. Если код записать в сценарии кадра, то он будет выполнен
сразу при переходе на кадр.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
22/55
Для перехода в окно сценария кадра надо на временной оси выделить
нужный ключевой кадр и нажать клавишу F9.
Контрольные вопросы к лабораторной работе №2
1. Методы
клипа (movie clip), позволяющие управлять
проигрыванием его анимации.
2. Создание всплывающихъ подсказок.
3. Как встроить флеш в html-страничку?
4. Управление проигрыванием основного ролика.
5. Управление проигрыванием анимации символа типа MovieClip.
6. Создание сценария кадра.
7. Вопросы по коду заданий.
ЛАБОРАТОРНАЯ РАБОТА №3
Тема: Cвойства клипов. Сценарии кнопок и клипов
Отчет: Файлы с выполненными заданиями.
Обработка событий MovieClip в стиле ActionScript 1.0
ActionScript 2.0 поддерживает создание сценариев клипов и кнопок
(стиль ActionScript 1.0).
Сценарии кнопок
Создание сценариев
лабораторной работе.
кнопок
рассматривалось
в
предыдущей
При обращении к свойствам основного ролика (_root), в сценарии
кнопки, расположенной непосредственно в _root, имя объекта можно
опускать
on(press){
_xscale+=10;
}
//эквивалентно
_root._xscale
Если же кнопка, для которой пишется сценарий, находится внутри
другого объекта, то отсутствие имени объекта будет означать обращение к
родительскому объекту.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
23/55
on(press){
_xscale+=10;
//эквивалентно _parent._xscale
}
Указатель this является указателем на родительский объект.
При ссылке на объекты можно опускать имя родительского объекта,
общего для кнопки со сценарием и этого объекта. Например, объект clip и
кнопка b_btn находятся внутри клипа m_mc. В обработчике кнопки b_btn к
объекту clip можно обратиться m_mc.clip и просто clip.
Сценарии клипов
Код сценария клипа размещается в самом клипе и имеет вид
onClipEvent(событие){
действия
}
Для открытия окна сценария клипа надо выделить клип и открыть
окно Actions.
}
В его заголовке появится Actions — Movie Clip.
Кроме этого можно применять обработчики событий on, которые
применяются для кнопок.
on(событие){
действия
}
При обращении к свойствам фрагмента ролика, для которого пишется
сценарий, имя объекта можно опускать.
onClipEvent (mouseDown) {
_х+=10
//”хозяин” сценария перемещается вправо
}
Указатель this является указателем на фрагмента ролика, для
которого пишется сценарий.
При ссылке на вложенные объекты надо опускать имя родительского
объекта или использовать указатель this. Например, фрагмента ролика
clip_mc находится внутри фрагмента ролика m_mc.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
24/55
В сценарии фрагмента ролика m_mc к объекту clip_mc можно
обратиться this.clip_mc, _root.m_mc.clip_mc или просто clip. При
обращении m_mc.clip_mc на самом деле будет подразумеваться объект
m_mc.m_mc.clip_mc.
События мыши
Событие press наступает при нажатии кнопки мыши над объектом, а
событие mouseDown — при нажатии кнопки мышки в любом месте.
Событие release наступает при отпускании кнопки мышки над
объектом, releaseOutside — при отпускании кнопки мышки вне объекта,
а mouseUp — при отпускании кнопки мышки в любом месте. Событие
rollOver наступает при вхождении указателя мышки в область объекта,
rollOut — когда указатель мышки выходит за пределы объекта.
Событие rollOver наступает при вхождении указателя мышки в
область объекта, rollOut — когда указатель мышки выходит за пределы
объекта.
Если нажать кнопку мышки в области объекта и вывести указатель
мышки за пределы объекта, то наступает событие dragOut. Если после этого
ввести указатель в область объекта (не отпуская кнопку мышки), то для
объекта наступит событие dragOver.
Свойства объектов MovieClip
Свойства _x и _y определяют координаты объекта в системе
координат родительского клипа.
Ось X клипа направлена вправо, а ось Y — вниз. Первоначально
направление осей вложенного и родительского клипов совпадают. При
повороте клипа поворачиваются оси его локальной системы координат
относительно осей координатной системы родительского клипа. Угол
поворота определяется свойством клипа _rotation.
Размеры символов определяются значениями свойств _height
(высота) и _width (ширина) в пикселах. Следующий код сделает размеры
символа m_mc 100х200 пикселов
m_mc._ height=100;
m_mc._ width =200;
Размеры символов определяются в системе координат самого
символа.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
25/55
Изменение размера можно задавать и в процентах к первоначальному
значению. Чтобы увеличить высоту на 20% и ширину на 10%, надо
выполнить следующий код
m_mc._ xscale=110;
m_mc._ yscale+=20;
ЗАДАНИЕ №1
1. Cоздайте два символа типа MovieClip в виде квадрата с
стороной 50 пикселов и треугольника с нижним основанием 50 и высотой
75. Точка регистрации обоих символов в центре.
2. Затем создайте новый символ, содержащий экземпляр квадрата с
именем rec_mc и экземпляр треугольника с именем tri_mc. Координата _y
внутренних объектов rec_mc и tri_mc должна равняться нулю. Координата
_x у квадрата равна -30, а у треугольника +30.
Cоздайте экземпляр нового символа с координатами (300;200) и
назовите outer_mc.
3. Создайте кнопку, при нажатии которой выполняются следующие
действия:
вывод координаты клипа outer_mc и вложенного в него rec_mc;
перемещение outer_mc на 50 пикселов по горизонтали и по
вертикали;
вывод координаты клипов outer_mc и rec_mc после
перемещения;
// вывод координат родительского outer_mc и
//дочернего rec_mc клипов
trace("Начальные координаты");
trace("_root.outer_mc._x=" + _root.outer_mc._x +
" _root.outer_mc._y=" + _root.outer_mc._y);
trace("_root.outer_mc.rec_mc._x="+_root.outer_mc.rec_m
c._x + " _root.outer_mc.rec_mc._y=" +
_root.outer_mc.rec_mc._y);
// перемещение клипа outer_mc
_root.outer_mc._x+=50;
_root.outer_mc._y+=50;
//вывод координат клипов после перемещения
trace("Координаты после перемещения outer_mc");
Михайличенко В.Н
Практикум по программированию для Adobe Flash
26/55
trace("_root.outer_mc._x=" + _root.outer_mc._x +
" _root.outer_mc._y=" + _root.outer_mc._y);
trace("outer_mc.rec_mc._x=" + outer_mc.rec_mc._x +
" _root.outer_mc.rec_mc._y=" +
_root.outer_mc.rec_mc._y);
4. При тестировании флеша, в окне Output появится:
Начальные координаты
_root.outer_mc._x=300
_root.outer_mc._y=200
_root.outer_mc.rec_mc._x=-30 _root.outer_mc.rec_mc._y=0
Координаты после перемещения outer_mc
_root.outer_mc._x=350
_root.outer_mc._y=250
_root.outer_mc.rec_mc._x=-30 _root.outer_mc.rec_mc._y=0
Координаты внешнего объекта outer_mc задаются относительно
основного клипа _root, поэтому при перемещении outer_mc его свойства _x
и _y изменились. Расположение внутренних объектов outer_mc
относительно его точки регистрации при перемещении всего outer_mc не
изменилось, следовательно локальные координаты внутреннего клипа rec_mc
не должны измениться.
ЗАДАНИЕ №2
1. К заданию №1 добавьте кнопку, нажатие которой вызывает
перемещение внутреннего объекта rec_mc по горизонтали вправо на 50
пикселов и вывод координаты.
_root.outer_mc.rec_mc._x+=50;
trace("Коорд. после перемещения внутрен. объекта rec_mc")
trace("_root.outer_mc._x=" + _root.outer_mc._x +
" _root.outer_mc._y=" + _root.outer_mc._y);
trace("_root.outer_mc.rec_mc._x="+_root.outer_mc.rec_mc._x
+" _root.outer_mc.rec_mc._y=" +
_root.outer_mc.rec_mc._y);
5. После тестирования увидим в окне Output следующее:
Координаты после перемещения внутренего объекта rec_mc
_root.outer_mc._x=300 _root.outer_mc._y=200
_root.outer_mc.rec_mc._x=20 _root.outer_mc.rec_mc._y=0
Михайличенко В.Н
Практикум по программированию для Adobe Flash
27/55
Так как точка регистрации outer_mc не изменилась, координаты
родительского объекта остались прежними. Смещение внутреннего объекта
привело к изменению его локальных координат.
ЗАДАНИЕ №3
Посмотрим, что происходит с координатами при повороте (свойство
_rotation).
Добавим кнопку, нажатие которой вызывает поворот внешнего объекта
outer_mc на 45о и вывод координат outer_mc и rec_mc.
_root.outer_mc._rotation+=45;// поворот по часовой
стрелке
trace("Координаты после поворота outer_mc");
trace("_root.outer_mc._x=" + _root.outer_mc._x +
" _root.outer_mc._y=" + _root.outer_mc._y);
trace("_root.outer_mc.rec_mc._x=" +
_root.outer_mc.rec_mc._x +
" _root.outer_mc.rec_mc._y=" +
_root.outer_mc.rec_mc._y);
В окне Output увидим, что не изменились координаты ни outer_mc,
ни rec_mc.
Координаты после поворота outer_mc
_root.outer_mc._x=300 _root.outer_mc._y=200
_root.outer_mc.rec_mc._x=20 _root.outer_mc.rec_mc._y=0
ЗАДАНИЕ №4
Добавим кнопку для поворота квадрата rec_mc на 45о . Вывести
координаты outer_mc и rec_mc до и после поворота.
Координатами объекта являются координаты его точки регистрации.
Поворот осуществляется вокруг точки регистрации, она же является и
началом координат. Поэтому координаты объектов не изменяются при
повороте.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
28/55
Размеры клипа. Свойства _height, _width, _xscale, _yscale
Высота клипа определяется его свойством _height, а ширина —
_width. Значения этих свойств определяются в системе координат
родительского клипа и зависят от масштаба ее осей.
Узнать или изменить масштаб координатных осей клипа можно с
помощью свойств _xscale и _yscale. Измеряются значения этих свойств в
процентах по отношению к масштабу осей недеформированного клипа.
Ширина и высота клипа не могут принимать отрицательные значения.
Масштаб _xscale и _yscale может быть и отрицательным! При
отрицательном
масштабе
происходит
изменение
направления
соответствующих осей на противоположное.
ЗАДАНИЕ №5
1. Создать символ clip, который содержит два внутренних символа:
круг с именем circle и квадрат с именем square. Начало его системы
координат расположить в центре круга.
2. Создать кнопку, нажатие которой выводит в Output координаты и
размеры родительского клипа clip и дочернего sguare. Затем в два раза
растягиваем родительский клип по оси X и повторяется вывод.
3. Создать дубликат символа clip. Сместить круг и квадрат таким
образом, чтобы координата х круга была равна 100.
Разместить экземпляры символов clip и его отредактированного
дубликата друг над другом. Провести через центры кругов линию.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
29/55
Создать кнопки, нажатие которых сжимает оба экземпляра по
горизонтали в два раза, растягивает в два раза и восстанавливает
первоначальные размеры.
Почему после сжатия или растяжения один сместился относительно
второго. Изменились ли координаты?
ЗАДАНИЕ №6
1. Создать новый документ Flash.
2. Назвать его слой "Клип".
3. Создать любой символ и назвать его экземпляр clip_mc.
4. В сценарии клипа запрограммировать следующее его поведение:
при щелчке мышкой clip_mc растягивается по оси Х на 10%;
при нажатии кнопки мышки clip_mc поворачивается на 15о,
при отпускании — возвращается в прежнее положение ;
при движении мышки над клипом он "бледнеет" на 10%, при
уходе мышки из области клипа — восстанавливает свой цвет.
5. Протестировать флеш.
Контрольные вопросы к лабораторной работе №3
1. Как интерпретируется ссылка this в сценарии кнопки?
2. Как интерпретируется ссылка this в сценарии символа
MovieClip?
3. Как интерпретируется ссылка this в сценарии кадра?
4. Если перед именем свойства не указано имя объекта, то к какому
объекту будет относится это свойство в сценарии символа MovieClip?
Михайличенко В.Н
Практикум по программированию для Adobe Flash
30/55
5. Если перед именем свойства не указано имя объекта, то к какому
объекту будет относится это свойство в сценарии кнопки?
6. Если перед именем свойства не указано имя объекта, то к какому
объекту будет относится это свойство в сценарии кадра?
7. Когда для объекта наступает событие press и когда событие
mouseDown?
8. Изменяются ли координаты родительского объекта при изменении
координат дочернего объекта?
9. Изменяются ли координаты дочернего объекта при изменении
родительского координат объекта?
10. Изменяется ли свойство _rotation родительского объекта при
изменении его у дочернего объекта?
11. Изменяется ли свойство _rotation дочернего объекта при
изменении его у родительского объекта?
12. Изменяются ли размеры родительского объекта при изменении
размера дочернего объекта?
13. Изменяются ли размеры дочернего объекта при изменении
размера родительского объекта?
14. Вопросы по коду задания.
ЛАБОРАТОРНАЯ РАБОТА №4
Тема: Сценарии клипа и кадра
Отчет: Файлы с выполненными заданиями.
Использование абсолютной и относительной адресации в
сценариях клипов и кнопок
Абсолютную адресацию можно использовать всегда, но она может
оказаться довольно длинной. Относительная адресация в разных местах кода
используется по разному.
Сценарии кнопок
При обращении к свойствам основного ролика (_root), в сценарии
кнопки, расположенной непосредственно в _root, имя объекта можно
опускать
on(press){
_xscale+=10;
}
// эквивалентно
_root._xscale
Михайличенко В.Н
Практикум по программированию для Adobe Flash
31/55
Если же кнопка, для которой пишется сценарий, находится внутри
другого объекта, то отсутствие имени объекта будет означать обращение к
родительскому объекту.
on(press){
_xscale+=10;
}
//эквивалентно
_parent._xscale
Указатель this является указателем на родительский объект.
При ссылке на объекты можно опускать имя родительского объекта,
общего для кнопки со сценарием и этого объекта. Например, объект clip и
кнопка b_btn находятся внутри клипа m_mc. В обработчике кнопки b_btn к
объекту clip можно обратиться m_mc.clip и просто clip.
Сценарии клипов
Код сценария клипа размещается в самом клипе и имеет вид:
onClipEvent(событие){
действия
}
Для открытия окна сценария клипа надо выделить клип и открыть
окно Actions. В его заголовке появится Actions-Movie Clip.
Кроме этого можно применять обработчики событий on, которые
применяются для кнопок.
on(событие){
действия
}
При обращении к свойствам фрагмента ролика, для которого пишется
сценарий, имя объекта можно опускать.
onClipEvent (mouseDown) {
_х+=10
// ”хозяин” сценария перемещается вправо
}
Михайличенко В.Н
Практикум по программированию для Adobe Flash
32/55
Указатель this является указателем на фрагмента ролика, для
которого пишется сценарий.
При ссылке на вложенные объекты надо опускать имя родительского
объекта или использовать указатель this. Например, фрагмента ролика
clip_mc находится внутри фрагмента ролика m_mc.
В сценарии фрагмента ролика m_mc к объекту clip_mc можно
обратиться this.clip_mc, _root.m_mc.clip_mc или просто clip. При
обращении m_mc.clip_mc на самом деле будет подразумеваться объект
m_mc.m_mc.clip_mc.
ЗАДАНИЕ №1
1.1 В новом флеш-документе создать два символа типа MovieClip в
виде прямоугольника и треугольника. Разместить их в виде стрелки и дать
имена tri_mc и rec_mc. Выделить оба символа и создать новый символ
outer. Дать его экземпляру имя outetr_mc.
Выделить outer_mc и написать
содержащий следующие действия:
для
него
сценарий
клипа,
при нажатии кнопки мышки tri_mc перемещается вправо на 10
пикселов;
при отпускании кнопки мышки rec_mc также перемещается
вправо на 10 пикселов;
при щелчке мышкой по outer_mc он поворачивается по часовой
стрелке на 15 градусов;
Надо использовать обработчики onClipEvent(mouseDown),
onClipEvent(mouseUp), on(press).
Протестируйте флеш, щелкая мышкой в разных местах рабочего поля
окна флеша. Когда для клипа наступают события mouseDown, mouseUp и
press.
1.2 В символе outer для символа tri_mc напишите следующий
сценарий: при нажатии треугольник растягивается по оси х на 20%
Михайличенко В.Н
Практикум по программированию для Adobe Flash
33/55
.
Создать еще один экземпляр символа outer, у которого нет сценариев.
Методы обработки событий ActionScript 2.0
Хотя ActionScript 2.0 и поддерживает сценарии клипов и кнопок, но
предпочтительнее создавать сценарии кадров, которые помогают
централизовать код. Можно собрать весь код обработчиков событий кнопок
и клипов в одном сценарии ключевого кадра. Обработчики событий объекта
в сценарии кадра создаются как метобы объекта.
Методы обработки событий ActionScript 2.0 и
обработчики ActionScript 1.0
Метод
ActionScript 2.0
Обработчик
ActionScript 1.0
onPress
on(press)
onRelease
on(release)
onReleaseOutside
on(releaseOutside)
onRollOver
on(rollOver)
onRollOut
on(rollOut)
onDragOver
on(dragOver)
onDragOut
on(dragOut)
onKeyDown
on(keyPress "Name")
onClipEvent(keyDown)
onKeyUp
onClipEvent(keyUp)
onSetFocus
Нет
Применение Применение
для клипов для кнопок
Да
Да
Да
Да
Да
Да
Да
да
да
Да
Да
да
да
да
да
да
да
да
да
нет
нет
нет
Михайличенко В.Н
Практикум по программированию для Adobe Flash
onKillFocus
Нет
onLoad
onClipEvent(load)
onUnload
onClipEvent(unload)
onEnterFrame
onMouseDown
onClipEvent(enterFrame
)
onClipEvent(mouseDown)
onMouseUp
onClipEvent(mouseUp)
onMouseMove
onClipEvent(mouseMove)
34/55
Да
Да
Да
Да
нет
нет
нет
нет
Да
Да
Да
нет
нет
нет
Создание методов-обработчиков
Обработчик чаще всего является анонимной функцией, ссылка на
которую присваивается методу клипа.
clip_mc.onPress = function() {
this._x+=10; //при нажатии клип перемещается горизонтально
}
Можно создать именованную функцию и присвоить ее имя
методу-обработчику.
function horizont _move() { this._x+=10;
clip_mc.onPress = horizont _move;
}
Функция-обработчик может ссылаться на вызвавший ее объект через
ссылку this. Если именованная функция вызывается непосредственно, то this
будет указывать на хозяина временной оси, но которой находится сценарий
кадра.
Абсолютная и относительная адресации в сценарии кадра
используются так же, как и в сценарии кнопки. Обработчики, как и остальной
код, желательно размещать на первом кадре основной временной шкалы.
Когда обработчик события выполнит свою задачу и станет не нужен,
его можно удалить помощи оператора delete:
delete clip.onEnterFrame;
В случае часто происходящих событий (onEnterFrame,
onMouseMove) это позволит освободить оперативную память и несколько
уменьшить нагрузку на процессор.
Обработчики, созданные в сценарии клипа, удалить нельзя.
ЗАДАНИЕ №2
Выполните задание №1 с использованием сценария кадра.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
35/55
ЗАДАНИЕ №3
Создайте 2 символа:
прямоугольник, в центре которого символ-круг (circle);
звезда, в центре которого находится такой-же символ-круг.
При вхождении указателя мышки в область круга символ,
содержащий этот круг поворачивается на 15 градусов.
Возможны 2 варианта эффективного написания кода:
1. На временной оси основного ролика создать именованную
функцию поворота родительского объекта и присвоить ее обработчикам
события RollOver обоих желтых кругов.
2. При создании символа-круга circle на его временной оси создать
сценарий кадра
this.onRollOver=function(){
this._parent._rotation+=15;
}
Выполнить оба варианта и добавить в рабочее поле еще один круг.
Проанализировать поведение дополнительных кругов.
Задание №4
1. Создать новый fla файл. На его единственный кадр "перетащить " из
библиотеки файла задания №3 символ circle. Протестировать файл.
2. Создать символ звездочку в центре которой экземпляр circle.
Разместить в кадре экземпляр звездочки. Протестировать файл.
В чем удобство символов с кодом?
Михайличенко В.Н
Практикум по программированию для Adobe Flash
36/55
Контрольные вопросы к лабораторной работе №4
1. Создание методов-обработчиков событий.
2. Удаление методов-обработчиков событий.
3. Использование именованных функций для создания методовобработчиков событий.
4. Использование указателя this в функциях и обработчиках
событий.
5. Размещение кода на временной оси символа.
6. Объяснить код, использованный для выполнения задания.
ЛАБОРАТОРНАЯ РАБОТА №5
Тема: Генерация случайных чисел. Функция eval(). Свойство
_currentFrame. Игра крестики-нолики
Отчет: Файлы с выполненными заданиями.
Случайные числа
Случайных чисел в ActionScript генерируются методом random()
объекта Math (Math.random()). Данный метод возвращает случайное число в
диапазоне от 0 до 1. Вероятность выпадения каждого из 1 000 000 000 000
000 возможных чисел одинакова и ничтожно мала.
На практике обычно бывает необходимо получать случайные
значения в некотором промежутке от А до В, где А и В отличны от 0 и 1.
Общая формула для получения случайных чисел в промежутке от А до В
(А<В) имеет вид:
(B - А) * Math.random() + А.
Например, чтобы сгенерировать случайное число от 0 до 100, нужно
набрать:
trace(100*Math.random());
Случайное число в промежутке от –10 до 20 дает следующий код:
trace(30*Math.random()-10); /
Иногда
необходимо
генерировать значение из какого-то
ограниченного множества целых величин. Например, расставляя корабли в
игре «Морской бой», генерировать необходимо целые числа от 1 до 100.
Чтобы решить эту задачу, метод Math.random() нужно использовать
совместно с одним из методов округления.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
37/55
Округление до целого числа
Многие свойства, параметры и характеристики выражаются целыми
числами. Для округления до целых в ActionScript имеются три метода.
Метод Math.round() проводит округление до ближайшего целого. Если
дробная часть числа больше или равна 0.5, то округление проводится в
сторону увеличения (для отрицательных чисел – увеличения абсолютной
величины):
trace(Math.round(1.5)); // Выводит: 2
trace(Math.round(3.6)); // Выводит: 4
trace(Math.round(3.4)); // Выводит: 3
trace(Math.round(-1.5)); // Выводит: -1
trace(Math.round(-3.6)); // Выводит: -4
trace(Math.round(-3.4)); // Выводит: -3
Метод Math.floor() округляет число до наименьшей ближайшей
целой величины.
Например:
trace(Math.floor(2.99999999));
// Выводит: 2
trace(Math.floor(-2.99999999)); // Выводит: -3
//(-3 меньше, чем -2.99999999)
Метод Math.ceil() противоположен методу Math.floor(). Он
возвращает ближайшее целое число, большее данного:
trace(Math.ceil(2.99999999)); // Выводит: 3
trace(Math.ceil(-2.99999999)); // Выводит: -2
Довольно часто возникает необходимость проводить округление не до
целых, а до некоторого десятичного разряда. Однако метода, который
позволял бы решать эту задачу, в ActionScript нет. Но при необходимости его
можно создать.
Так, чтобы округлить число до n десятичных знаков, его нужно
умножить на 10n, провести операцию округления, а затем поделить на 10n
результат. Например:
function n_round(number, n) {
var f = Math.pow(10, n);
return Math.round(number*f)/f;
}
trace(n_round(10.19876784,3)); // Выводит: 10.199
Определение размеров рабочей области.
Каждый кадр имеет некоторое
графическом холсте, названном Stage.
содержание, которое показано на
Михайличенко В.Н
Практикум по программированию для Adobe Flash
38/55
Свойства _width и _height присущи и основной временной
диаграмме _root. Причем их значения для _root определяются точно по
таким же принципам, как и для обычных клипов. Распространенной ошибкой
является попытка определить размер поля фильма как высоту и ширину
_root.
Чтобы правильно решить эту задачу, нужно воспользоваться
свойствами width и height объекта Stage (записываются без символа
подчеркивания!):
trace([_root._height, _root._width]); // 0, 0 , если _root пустой
trace([Stage.height, Stage.width]);
// 400 550 — размер рабочей области
ЗАДАНИЕ 1
1. Создать новый Flash-документ.
2. Создать в нем слои Actions и Clip.
3. Создать символ MovieClip в виде квадрата 60х60.
4. Разместить экземпляр созданного символа в единственном кадре
слоя Clip. При нажатии экземпляра он должен "убегать" в случайном
направлении на случайное расстояние из диапазона 60-120 по каждой из
осей. Квадрат не должен убегать за пределы рабочей области.
ЗАДАНИЕ 2
Создать поле для игры в крестики нолики
1. Создать новый Flash-документ с двумя слоями: Actions и Game.
2. Каждая отдельная клетки поля для игры представляет квадрат,
имеющий три состояния: пусто, крестик и нолик. Создать символ MovieClip
с тремя соответствующими кадрами. Дать символу имя cell.
3. В центре рабочей области слоя Game разместить 9 экземпляров
клетки.
4. Протестировать флеш.
ЗАДАНИЕ 3
1. В каждой клетке поля игры непрерывно меняются кадры.
Необходимо остановить проигрывание анимации у клипов-клеток методом
stop().
Михайличенко В.Н
Практикум по программированию для Adobe Flash
39/55
Для программного управления дать клеткам следующие имена c00,
c01, c02, c10 и т.д. Индексы состоят из номеров строки и столбца клетки.
Преобразование строк в идентификаторы. Функция eval()
Функция eval() позволяет динамически преобразовывать строки в
идентификаторы объектов, клипов и функций.
row=1; col=2;
eval("c"+row+col+"_mc")._x=100; //
c12_mc._x=100;
Довольно часто имена объектов используются как строки. Методы
программного создания клипов требуют указания их имени в качестве строки
(хотя они и возвращают ссылку на созданный объект).
for (var i = 0; i<100; i++)
_root.attachMovie("ball", "ball"+i, i);
В подобных случаях часто используется функция eval(). Чтобы
остановить проигрывание i-го клипа, надо записать
eval("ball"+i).stop();
Если необходимо динамически создать идентификатор вложенного
клипа, то его полный адрес должен быть получен в скобках функции eval().
Частой ошибкой является ее использование в качестве метода, например:
big_ball.eval("ball"+n)._x=100; // Нельзя
Чтобы получить доступ к расположенному на временной диаграмме
клипа big_ball клипу balln, нужно набрать следующий код:
eval("big_ball.ball"+n)._x=100;
Функция eval() не совместима с оператором присваивания (точнее,
выражение с ней не может являться левым операндом оператора " ="). Для
того чтобы создать переменную или свойство с динамически формируемым
именем, нужно использовать функцию set() или оператор []:
eval("per"+i)="ActionScript"; //Ошибка
set("per"+i, "ActionScrip "); //Правильно, но устарело
this["per"+i]=" ActionScrip"; //Оптимально
ЗАДАНИЕ 4
1. В сценарии кадра закомментировать код остановки проигрывания
клипов-клеток и переписать его в виде цикла.
ЗАДАНИЕ 5
1. Остановить автоматическое проигрывание клипов методом stop(),
размещенным на первом кадре символа.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
40/55
Определение номера проигрываемого кадра.
Свойство _currentframe
Cвойство _currentframe хранит номер текущего кадра.
switch (this._currentframe) {
case 1:
trace("Клетка пуста"); break;
case2:
trace("В клетке крестик"); break;
case 3:
trace("В клетке нолик"); break;
}
Обработка хода в игре
Обработчик события нажатия клетки (onPress) для каждой клетки
один и тот же. Придется писать одну и ту же функцию несколько раз.
c00_mc.onPress=function() {…}
…
c22_mc.onPress=function(){…}
Если бы обработчики создавались как сценарии клипов, то другого
варианта не было бы. Но при создании обработчиков-методов можно
написать именованную функцию, содержащую все действия обработчика
function hod(){…}
Имя функции hod является ссылкой на саму функции, поэтому методу
onPress можно присвоить имя функции.
c00_mc.onPress=hod;
…
c22_mc.onPress= hod;
Причем
используя
функцию
eval
последовательность операций присвоения в цикле.
можно
записать
for(row=0;row<=2;row++)
for(col=0;col<=2;col++)
eval("c"+row+col+"_mc").onPress=hod;
//или _root["c"+row+col+"_mc"].onPress=hod
В функции hod можно ссылаться на вызвавший объект через
указатель this.
Определение положения выбранной клетки
В обработчике события нажатия клетки можно узнать ее имя с
помощью свойства _name.
var clip_name: String
clip_name=this._name
Михайличенко В.Н
Практикум по программированию для Adobe Flash
41/55
В имени клетки зашито ее положение. Второй и третий символы —
номера ее строки и столбца.
Строки имеют метод substring(start,end), который возвращает
подстроку, начинающуюся с индекса start и заканчивающуюся перед
индексом end. Для получения номера столбца надо получить его строковое
представление и преобразовать в число.
row=Number(clip_name.substring(1,2))
col=Number(clip_name.substring(2,3))
ЗАДАНИЕ 6
6.1 Запрограммировать игру следующим образом:
два игрока по очереди проставляют свои ходы щелчками мышки
на выбранных клетках — один крестиками другой ноликами;
щелчок уже заполненной клетки игнорируется.
Указания.
Создать переменную player, которая может принимать два значения
— "х" и "0" или 2, 3 (номера соответствующих кадров клетки). Значение ее
меняется при каждом ходе и определяет кадр, на котором останавливается
нажимаемый клип-клетка.
6.2 Добавить кнопку, нажатие которой начинает новую игру (очищает
все клетки).
ЗАДАНИЕ 7 (дополнительное)
Символ cell имеет три кадра: пустая клетка, крестик, нолик.
Поместить на второй и третий кадры экземпляры анимированных символов.
Крестик и нолик должны не просто появляться, а прорисовываться.
Как сделать, чтобы крестик и нолик прорисовывались только один
раз?
Анимацию нолика проще делать покадровой из 6-10 кадров.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
42/55
Программирование ходов компьютера
Гораздо более интересен вариант игры с компьютером, для которого
выполняются следующие правила.
1. Кто будет делать первый ход определяется случайным образом
(первый игрок ходит крестиками).
2. Алгоритм игры компьютера должен автоматически выбирать
оптимальный для текущей ситуации ход.
Оценка и выбор хода осуществляется исходя из следующих
соображений:
Наивысшим приоритетом обладает ход, который может победно
завершить игру. Она возникает, если в соответствующем рядке компьютером
уже закрыты две клетки и есть свободная.
Если нет хода, который приведет к немедленной победе, то нельзя
допустить победу противника на следующем ходе. Второй по приоритету
должна быть комбинация двух знаков противника и свободной клетки в
одном рядке.
Третье место должна занимать позиция, когда в рядке имеется
один знак компьютера и две свободные клетки. Если противник не заметит,
то через один ход получим ситуацию с наивысшим приоритетом.
Четвертую позицию в приоритете необходимо отдать
комбинации знак противника плюс две свободные клетки.
Пятое место в иерархии ценности позиций необходимо отдать
строке из пустых клеток.
Последняя по ценности позиция соответствует сочетанию знака
противника, знака компьютера и пустой клетки.
Когда наступает очередь хода компьютера, он должен проверить
ценность позиции каждой пустой клетки. Для каждой клетки надо проверить
от двух до четырех рядов. Итогом "мыслительной" деятельности компьютера
является обнаружение клетки с наивысшим приоритетом.
Содержимое клетки, стоящей в строке row и столбце col определяется
номером кадра клипа eval("c"+row+col+"_mc"). Если в клетке стоит
символ компьютера, то ее можно оценить 100, если символ пользователя —
10, а пустую можно оценить единицей.
curClip=eval("с"+i+j+"_mc")
switch (curClip._currentframe){
case comp_hod:
cell=100; break;
case user_hod:
cell=10; break;
default:
cell=1; break;
}
Просматривая ряды и собирая сумму оценок клеток, компьютер
всегда сможет оценить ситуацию. Если получится сумма 201, то это означает,
Михайличенко В.Н
Практикум по программированию для Adobe Flash
43/55
что в ряду уже есть два символа компьютера и одна пустая клетка (ситуация
с наивысшим приоритетом!).
Если сумма 111 — один символ
компьютера, один символ
пользователя и одна пустая клетка. Если 21 — два символа пользователя и
одна пустая. Приоритет ряда с суммой 21 должен быть выше приоритета
ряда с суммой 111. Поэтому надо определить по вычисленным суммам
рейтинги рядов, например следующим образом
switch (sum){
case 201: return 1000;
//2 символа компьютера и пустая клетка
case 21:
return 100;
//2 символа пользователя и пустая клетка
case 102: case 12: return 20;
//один символ компьютера и две пустые клетки
//один символ пользователя и две пустые
клетки
case 3: return 7; // пустой ряд
case 111: return 3;
// по одному символу компьютер,
пользователь, пусто
case 30: return "user_victory";
// три символа пользователя ― он выиграл
}
Для клетки cij надо вычислить сумму по строке i и столбцу j. Если
i = j, то клетка находится на главной диагонали и понадобится анализ
суммы d1.
d1=c00+c11+c22
Если i +j = 2, клетка находится на вспомогательной диагонали и
надо добавить сумму d2.
d2=c02+c11+c20
Таким образом, для выбора хода компьютера надо:
1) Определить состояние рабочего поля — вычислить суммы по всем
рядкам: строкам, столбцам и диагоналям. Написать функцию обсчета поля..
2) Написать функцию, которая для клетки вычисляет ее рейтинг,
состоящий из суммы всех рядов, в которые она входит. При этом до
сложения, надо повысить приоритет выигрышных состояний и понизить его
для мало перспективных.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
function ocenka(ves:Number)
switch (ves) {
case 201: return
case 21:
return
case 102: return
case 12:
return
case 3:
return
case 111: return
case 30:
return
}
}
44/55
{
1000;
100;
50;
20;
7;
3;
"user_victory";
1) Проверить, может пользователь уже выиграл? Для этого оценить
суммарный рейтинг клетки последнего хода пользователя.
2) Для каждой свободной клетки определить ее рейтинг и выбрать для
хода клетку с наибольшим рейтингом. Если рейтинг окажется >=1000, то
компьютер нашел победный ход!
ЗАДАНИЕ 8
Запрограммировать ходы компьютера.
Создать комментарии результата игры (”Вы выиграли”, “Вы
проиграли”, “Ничья”.
Запретить делать ходы после определения результата игры.
Сделать задержку хода компьютера для имитации "обдумывания".
Как запретить пользователю делать ход до окончания "обдумывания" хода
компьютером?
Сделать кнопку для начала новой игры.
Контрольные вопросы к лабораторной работе №5
1. Генерация случайных чисел в заданном диапазоне.
2. Методы округления до целого числа.
3. Определение размеров рабочей области.
4. Функция eval().
5. Определение номера проигрываемого кадра.
6. Определение положения выбранной клетки
7. Программирование хода пользователя в игре.
8. Программирование хода компьютера в игре.
9. Разыгрывание первого хода.
10. Объяснить код задания.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
45/55
ЛАБОРАТОРНАЯ РАБОТА №6
Тема: Программное создание анимации. Событие onEnterFrame.
Функция setInterval()
Отчет: Файлы с выполненными заданиями.
Событие EnterFrame
Вообще говоря, не существует события EnterFrame, но вызов метода
с именем onEnterFrame отправляется всем клипам, его имеющим, при
загрузке нового кадра. Точнее, вызову соответствует момент времени, когда
смена кадров должна произойти. Поэтому метод — обработчик работает,
даже если в фильме имеется только один кадр.
Частота вызовов функции-обработчика onEnterFrame определяется
установленной в фильме частотой смены кадров. Если код в теле
обработчика не успеет выполниться за отведенный промежуток времени, то
новое событие onEnterFrame не произойдет до тех пор, пока он не будет
завершен. Вызовы события onEnterFrame также не будут осуществляться,
пока не выполнится та часть кода, которая должна быть проделана
непосредственно при загрузке кадра.
Создание, изменение и удаление методов-обработчиков
Обработчик чаще всего является анонимной функцией, ссылка на
которую присваивается методу клипа.
clip_mc.onEnterFrame = function() {
this._x+=10; //при нажатии клип перемещается горизонтально
}
Можно создать именованную функцию и присвоить ее имя
методу-обработчику.
function horizont _move() { this._x+=10;
clip_mc.onEnterFrame = horizont _move;
}
Именованная функция может ссылаться на вызвавший ее объект через
ссылку this.
Когда обработчик события выполнит свою задачу и станет не нужен,
его можно удалить помощи оператора delete.
delete clip.onEnterFrame;
В
случае часто происходящих событий (onEnterFrame,
onMouseMove) это позволит освободить оперативную память и несколько
уменьшить нагрузку на процессор.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
46/55
ЗАДАНИЕ 1
1. Создать новый Flash-документ.
2. На первом кадре единственного слоя поместить следующий код:
var n:Number;
_root.onEnterFrame=function(){
n++;
trace("вызов №"+n);
}
3. Протестировать флеш. Хотя флеш состоит всего из одного кадра и
не содержит анимации, событие onEnterFrame наступает с указанной
частотой смены кадров.
ЗАДАНИЕ 2
1. Переименовать слой Layer 1 в Actions
2. Создать новый слой с именем Clip.
3. Нарисовать на единственном кадре нового слоя вытянутый эллипс и
преобразовать его в символ MovieClip. Дать экземпляру имя clip_mc.
4. Закомментировать старый обработчик _root.onEnterFrame.
Создать обработчик для clip, который заставит clip непрерывно
вращаться.
5. Создать кнопку, нажатие которой прекращает вращение clip_mc.
6. Протестировать флеш.
Если обработчик написан в виде анонимной функции, то для
восстановления его после удаления необходимо заново написать весь код
анонимной функции, каким бы длинным он не был.
start_btn.onPress=function(){
clip.onEnterFrame= function(){this._rotation+=10;} }
Но если обработчику присваивалась ссылка на именованную
функцию, то достаточно заново присвоить только ссылку.
start_btn.onPress=function(){
clip.onEnterFrame= func_name;
}
Если обработчику onEnterFrame присвоить имя другой функции, то
clip будет выполнять другую анимацию.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
47/55
ЗАДАНИЕ 3
1. Создать новый флеш-документ.
2. Создать два слоя с именами Actions и Clip.
3. Создать символ в виде вытянутого эллипса.
В слое Clip разместить экземпляр символа и три кнопки.
При нажатии кнопки rotate символ начинает непрерывно
вращаться. При нажатии кнопки move символ начинает перемещаться вправо
на расстояние не более 100, при достижении предельной точки начинает
двигаться влево и т.д. Кнопка stop прекращает всякое движение.
Функция setInterval
Обработчик события onEnterFrame позволяет программировать
повторяющиеся операции с объектом, но частота их повторения жестко
привязана к используемой в фильме частоте смены кадров. Эту частоту
нельзя сделать различной для различных клипов, так как частота смены
кадров устанавливается сразу для всего фильма. Это очень неудобно в
случае многокадровых фильмов и наличия нескольких анимированных
клипов, так как согласовать скорость проигрывания мультипликации с
частотой вызовов кода порой совсем непросто.
Функция setInterval() позволяет осуществлять периодические
вызовы функции или метода, причем период вызовов можно задавать
произвольно и он может иметь разные значения для разных функций и
методов. Ее использование для периодического вызова функции имеет
следующий синтаксис:
setInterval(func, time, [param1, param2, ..., paramN])
где:
► func – имя функции, которая должна периодически вызываться.
► time — период времени, через который должна вызываться
функция;
► [param1, param2, ..., paramN] — необязательные параметры для
передачи возможных аргументов функции func.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
48/55
Имя вызываемой функции не должно заключаться в кавычки.
Интервал time измеряется в миллисекундах. Значение time=1000
соответствует одному вызову в секунду. Среда Flash вызывает функцию по
возможности ближе к заданному интервалу, но возможны отклонения. На
точность вызовов влияет работа самого компьютера (точность отсчета
интервала) и другие факторы (вызов функции должен ждать завершения
текущих операций и т.д.).
ЗАДАНИЕ №4
1. Создать новый Flash-документ.
2. В окне Actions ввести следующий код
function test(){ trace(getTimer());}
ID=setInterval(test,100);
3. Протестировать при частоте смены кадров 12 fps, 10fps и 1fps.
Учитывая, что время измеряется в миллисекундах, отклонения
незначительны, особенно если период смены кадров кратен интервалу вызова
функции.
Если функция setInterval() должна вызываться "короткую"
функцию, то последнюю можно определить при вызове setInterval :
setInterval(function(par){trace(par);},100,"Hello!!!");
Функция setInterval() имеет иной синтаксис для периодического
вызова метода объекта
setInterval(objRef:Object, methodName:String,
interval:Number,
[param1, param2, ..., paramN]) : Number)
где:
► objRef — имя объекта или ссылка на него (не строка!);
► methodName — имя метода в виде строки;
► interval — интервал времени, через который метод должен
вызываться;
► [param1, param2, ..., paramN] — параметры, передаваемые методу.
ЗАДАНИЕ №5
1. Создать новый Flash-документ.
2. Создать в нем два слоя с именами Actions и Clip.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
49/55
3. Создать символ в виде подсвеченного шарика и поместить его
экземпляр c именем clip на слой Clip.
4. При щелчке мышки объект clip должен постепенно двигаться по
направлению к указателю мышки. Для программирования данного действия
описать следующие переменные уровня основной временной шкалы
Xstart и Ystart — координаты clip в момент щелчка мышки,
targetX и targetY — координаты положение мышки.
k — угловой коэффициент прямой, по которой
происходит
движение.
Dx=2*(targetX-Xstart)/Math.abs(targetX-Xstart) — шаг
изменения х.
Метод moveToMouse осуществляет перемещение шарика по
направления к (Xstart ;Ystart) на один шаг.
Написать обработчик clip.onMouseDown, в котором эти параметры
вычисляются и вызывается функция setInterval для метода moveToMouse
объекта clip c интервалом 100.
ID=setInterval(this,"moveToMouse",100);
Обратите внимание, что при вызове при помощи setInterval()
метода объекта имя метода должно быть представлено строго в строковом
виде, имя объекта — в виде идентификатора.
5. После события MouseDown начинаются периодические вызовы
функции moveToMouse, являющейся методом объекта clip
clip. moveToMouse = function() {
this._x += Dx;
//задаем изменение координаты x
this._y =…; }
// вычисляем координату y
6. Протестировать флеш.
В созданном фильме шарик непрерывно двигается по направлению
указателя мышки в момент щелчка и не останавливается, достигнув его.
Поэтому надо дописать функцию проверки конца движения. Если
координаты clip по абсолютной величине достаточно близки к
запомненным координатам мышки в момент щелчка, последовательность
вызовов метода moveToMouse надо прекратить.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
50/55
Работу setInterval() прерывает функция clearInterval(),
принимающая в качестве параметра порядковый номер последовательности
вызовов, возвращенный setInterval().
ID=setInterval(this,"moveToMouse",100);
…
clearInterval(ID);
ЗАДАНИЕ №6
Доработать флеш, чтобы шарик останавливался .
Обновление экрана
Все изменения, программно внесенные в фильм, отображаются на
экране только при загрузке нового кадра или с интервалом времени,
соответствующим частоте смены кадров. Поэтому результатом работы цикла
for(var i=1; i<=100; i++) this._x+=1;
будет не плавное перемещение клипа вправо, а резкий скачок сразу на 100
пикселов.
Если частота смены кадров 1fps (интервал времени между кадрами 1000
миллисекунд) а значение интервала у функции setInterval() 100
миллисекунд,
setInterval(func,100);
то на экране будет отображаться результат 10 последовательных вызовов
функции func. При такой частоте смены кадров объект clip будет
двигаться скачками.
Немедленное обновление экрана вызывает глобальная функция
updateAfterEvent(). Использовать ее можно быть только в функциях,
вызываемых setInterval, и обработчиках событий. При размещении в
других местах updateAfterEvent() просто игнорируется системой.
ЗАДАНИЕ №7
Добавить во флеш обновление экрана после каждого перемещения
шарика.
ЗАДАНИЕ №8
Создать
аналогичный
флеш,
но
с
использованием
обработчика
onEnterFrame.
ЗАДАНИЕ №9 (дополнительное)
Создать
поведением:
флеш,
содержащий
шарик,
обладающий
следующим
Михайличенко В.Н
Практикум по программированию для Adobe Flash
51/55
при нажатии, его можно перетаскивать мышкой:
если шарик отпустить, он станет совершать затухающие колебания
относительно начального положения.
Контрольные вопросы к лабораторной работе №6
1. Создание непрерывной анимации. Можно ли использовать цикл?
2. Когда наступает событие EnterFrame в однокадровом и
многокадровом роликах?
3. Функция setInterval(). Периодический вызов функции и метода.
4. Что возвращает функция setInterval()?
5. Определение координат мышки.
6. Программирование движения в заданном направлении.
7. Остановка движения объекта в заданном месте.
8. Обновление экрана.
9. Вопросы по коду задания.
ЛАБОРАТОРНАЯ РАБОТА №7
Тема: Программное создание, удаление и поворот экземпляров
клипов
Отчет: Файлы с выполненными заданиями.
Свойство _rotation
Свойство _rotation определяет угол поворота оси Х объекта
относительно оси Х родительского объекта. Положительные значения
соответствуют повороту по часовой стрелке, отрицательные — против
часовой стрелки. Может принимать значения от -180о до 180о. Если
присвоить значение вне этого диапазона, то для отрицательных значений
будет добавляться по 360о до тех пор, пока значение не попадет в
допустимый интервал, для положительных значений – 360о вычитается. Так
значение 181о будет преобразовании в –179 о, а –372 о — в –12о.
ЗАДАНИЕ №1
1. Создать новый символ mc1 (MovieClip — фрагмент ролика) в
виде стрелки с точкой регистрации в ее левом конце.
2. Создать из двух стрелок новый символ
координат".
mc2
— "систему
Михайличенко В.Н
Практикум по программированию для Adobe Flash
52/55
3. Создать копию символа mc1 – символ mc3. Изменить цвет, длину
и толщину стрелки.
4. Поместить символ mc3 в символ mc2 следующим образом.
Дать внутреннему символу (красной стрелке) имя in_mc.
5. Разместить в рабочем поле экземпляр символа mc2 с именем
parent_mc и кнопку с именем btn_btn.
В сценарии кадра повернуть parent_mc на -30о и написать
обработчик нажатия кнопки
var n=0;
btn_btn.onPress=function(){
n+=30;
parent_mc.in_mc._rotation=n
trace("n="+n+"
_rotatioin="+parent_mc.in_mc._rotation);
}
Проследить, что выводится в окно OutPut.
Функция atan2
Если надо повернуть объект clip с координатами (Ха,Уа) таким
образом, чтобы его ось Х была направлены на в точку с координатами
(Хо,Уо), то вычисляем
Михайличенко В.Н
Практикум по программированию для Adobe Flash
53/55
dX=Xo-Xa;
dY=Yo-Ya;
var alpha=Math.atan2(dY,dX)/(Math.PI/180);
Функция atan2(dY,dX) возвращает угол (в радианах), на который
надо повернуть объект clip , чтобы его ось Х смотрела в точку (Хо,Уо):
clip._rotation= alpha;
После выполнения третьего пункта
следующим образом:
объект clip будет повернут
Если же надо, чтобы ось У была направлена на точку с координатами
(Хо,Уо), то надо повернуть еще на 90 градусов.
clip._rotation =Math.atan2(dY,dX)/(Math.PI/180)+90;
ЗАДАНИЕ №2
На рабочем поле расположить экземпляр красного жука и кнопку.
Масштаб жука увеличить в два раза.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
54/55
При нажатии кнопки в произвольном месте поля появляется новый
красный жук произвольного размера (масштаб по осям 0х и 0y независим и
принимает значения от 25% до 125%) и с произвольным углом поворота.
Первоначальный жук должен располагаться поверх всех копий!
Кнопка также не должна исчезать под жуками.
ЗАДАНИЕ №3
Жук-прообраз должен поворачиваться к каждой своей создаваемой
копии.
ЗАДАНИЕ №4
Добавить кнопку, нажатие которой приводит к уничтожению всех
копий красного жука. Кнопка также не должна исчезать под жуками.
Желтый жук "пожирает" красных жуков. Желтый жук находится над
всеми объектами.
Перед уничтожением жуков-копий желтый жук поворачивается к ним
и перемещается на их место. Уничтожение начинается с самих верхних
копий в порядке, обратном их появлению.
Красный жук при этом поворачивается к уничтожаемой копии.
Жуки уничтожаются со скоростью смены кадров.
После уничтожения последней копии желтый жук исчезает.
После уничтожения всех копий можно опять их генерировать.
Михайличенко В.Н
Практикум по программированию для Adobe Flash
55/55
ЗАДАНИЕ №5 (дополнительное)
После нажатия кнопки
”Уничтожить” выполняется анимация
последовательного перемещения желтого жука к копиям красного жука, при
этом исходный красный жук поворачивается (следит) за желтым. При
достижении красной копии происходит ее уничтожение.
Контрольные вопросы к лабораторной работе №7
1. Свойство _rotation.
2. Что возвращает функция atan2? Аргументы функции.
3. Как повернуть объект, расположенный под углом к оси Х, чтобы
он имел нужное направление.
4. Как создать анимацию постепенного поворота красного жука?
5. Как создать анимацию непрерывного движения желтого жука от
первого уничтожаемого жука к последнему?
6. Вопросы по коду задания.
Рекомендуемая литература
1. Ульрих К. Flash CS3 Professional для Windows и Macintosh. — ДМК
Пресс: Москва, 2009. — 576 с.
2. Adobe Flash CS5. Официальный учебный курс. — Эксмо: Москва,
2011. — 448 с.
3. Джонсон С. Flash CS5. Руководство разработчика. — СПб: Питер,
2012. — 550 с.
Интернет-ресурсы
1. Форум FLASHER.RU международный клуб флэшеров. —
url: http://www.flasher.ru/
2. For Coder. Книги по ActionScript и Flash. —
url: http://forcoder.ru/actionscript-flash/
3. Как создать игру на Adobe Flash Cs5? —
url: http://akak.ru/recipes/13890-kak-sozdat-igru-na-adobe-flash-cs5
