Григорьев С.В. Компьютерная графика. Часть I. Программирование Flash API на ActionScript 2.0. Лабораторный практикум

Подождите немного. Документ загружается.

МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РФ

ФЕДЕРАЛЬНОЕ АГЕНТСТВО ПО ОБРАЗОВАНИЮ

ИРКУТСКИЙ ГОСУДАРСТВЕННЫЙ ТЕХНИЧЕСКИЙ УНИВЕРСИТЕТ

КОМПЬЮТЕРНАЯ ГРАФИКА

Часть I. Программирование Flash API на ActionScript 2.0

Лабораторный практикум

ИЗДАТЕЛЬСТВО

Иркутского государственного технического университета

2008

Компьютерная графика. Часть I. Программирование Flash API на

ActionScript 2.0: лабораторный практикум / сост. С.В. Григорьев. – Иркутск:

Изд-во ИрГТУ, 2008. – 39 с.

Содержатся практические задания по программированию компьютерной

графики во Flash API на языке ActionScript 2.0 и типовые методики их

выполнения в приложении Macromedia Flash MX 2004 Professional.

Лабораторный практикум предназначен для студентов специальности

"Автоматизированные системы обработки информации и управления",

изучающих курс "Компьютерная графика".

Библиогр. 12 назв. Ил. 17.

Рецензент: канд. физ.-мат. наук, доцент кафедры вычислительной техники

ИрГТУ К.Д. Кириченко

Оглавление

Предисловие .........................................................................................................4

Лабораторная работа 1. Свободное движение графического объекта.............5

Лабораторная работа 2. Ограниченное движение графического объекта .......9

Лабораторная работа 3. Изменение траектории движения............................11

Лабораторная работа 4. Дублирование графических объектов .......................13

Лабораторная работа 5. Построение геометрических фракталов .................14

Лабораторная работа 6. Программное рисование двумерных объектов.........18

Лабораторная работа 7. Столкновение множества графических объектов..21

Лабораторная работа 8. Моделирование системы гравитации.......................23

Лабораторная работа 9. Моделирование пружинной системы .......................25

Лабораторная работа 10. Программное рисование трёхмерных объектов ....27

Лабораторная работа 11. Моделирование системы освещения .......................30

Лабораторная работа 12. Моделирование полигональных объектов ...............32

Лабораторная работа 13. Текстурирование трёхмерных объектов ...............34

Лабораторная работа 14. Чтение внешних данных методами класса XML ...36

Лабораторная работа 15. Применение методов искусственного интеллекта36

Библиографический список...............................................................................38

Предисловие

Данный лабораторный практикум условно разбит на четыре части,

каждая из которых представляет собой отдельный этап в практическом

освоении методов объектно-ориентированного программирования на языке

ActionScript 2.0 в программном интерфейсе (API) Flash.

По завершению каждого этапа студентами должен быть составлен отчёт

по выполненным лабораторным работам по форме СТО ИрГТУ.005-2007. В

конце каждого этапа представлены вопросы для составления отчёта.

Первая лабораторная работа представляет собой подготовку рабочего

пространства и начало работы, поэтому отдельного отчёта не требует.

В лабораторных работах 2 – 5 (первый этап) рассмотрены основные

методы построения классов в ActionScript 2.0 и их использование для

решения простейших задач компьютерной графики. В лабораторных работах

6-9 (второй этап) рассмотрены вопросы практического использования

классов в более сложных задачах программирования плоской (2D)

геометрии. В лабораторных работах 10 – 13 (третий этап) рассмотрены

методы программирования объёмной (3D) геометрии с помощью ActionScript

2.0. И, наконец, в последнем, четвёртом этапе (лабораторные работы 14 – 15)

рассмотрены вопросы построения приложения с использованием методов

искусственного интеллекта и чтения внешних данных.

Для выполнения работ рекомендуется использовать коммерческое

приложение Macromedia Flash MX 2004 Professional для Microsoft Windows.

Можно также использовать приложения Macromedia Flash 8 (Basic или

Professional) и Adobe Flash CS3 Professional, с настройками компилятора

языка ActionScript 2.0 и проигрывателя компилированных файлов

Macromedia Flash Player 7 или Macromedia Flash Player 8, а также Adobe

Flash Player 9.

Категорически не рекомендуется использовать ранние версии

приложения с поддержкой программирования на ActionScript 1.0

(Macromedia Flash 5 и Macromedia Flash MX), а также более ранние версии

проигрывателя Macromedia Flash Player. Также нежелательно использование

более поздних версий проигрывателя Adobe Flash Player.

Кроме того, можно использовать открытое приложение FlashDevelop для

Microsoft.NET, в котором для выполнения заданий данного практикума

необходимо создавать проекты типа ActionScript 2 > AS2 Project.

Рекомендуемое разрешение экрана монитора – более 800 x 600 пикселей с

частотой обновления не менее 60 Гц; качество цветопередачи – самое

высокое. Для выполнения некоторых заданий требуется

высокопроизводительная система с отдельной видеоподсистемой.

По окончании выполнения каждой работы в приложении Macromedia

Flash MX 2004 Professional получаются файлы четырёх типов: FLP (файл

проекта, XML-формат), FLA (файл документа Flash IDE, бинарный формат),

AS (файл класса или сценария ActionScript 2.0, текстовый формат) и SWF

(компилированный файл Flash-приложения, бинарный формат).

Лабораторная работа 1

Свободное движение графического объекта

Цель работы:

1). Изучить: основные методы работы в графическом приложении

Macromedia Flash MX 2004 Professional; способы создания графических

элементов и определения их типов; принципы построения классов в

ActionScript 2.0; а также основные приёмы объектно-ориентированного

программирования на языке ActionScript 2.0.

2). Создать простое приложение для управления свободным движением

подвижного графического объекта на фоне неподвижного.

Порядок выполнения работы:

1. Откройте приложение Macromedia Flash MX 2004 Professional.

2. Ознакомьтесь с графическим интерфейсом приложения, изучите

положения и свойства панелей Tools, Project, Properties и Color Mixer.

3. Для сброса положения панелей в исходное состояние по умолчанию

используйте команду меню Window > Panel Sets > Default Layout.

4. Командой меню File > New... > Flash Project создайте новый проект,

назовите его "lab01" и сохраните в папке с названием "lab01". Тип файла, в

котором сохраняется проект – FLP, полное название файла – "lab01.flp".

5. Обратите внимание на панель проектов Project (включается командой

меню Window > Project, находится в правой части окна приложения). Кнопка

внизу панели с названием Test Project необходима для компиляции проекта.

При её нажатии открывается окно для отображения файла типа SWF.

6. Для того, чтобы максимизировать панель Project, необходимо в

контекстном меню заголовка панели выбрать команду Maximize Panel.

7. Для того, чтобы добавить папку или файл к проекту, используйте

соответственно две кнопки Add Folder to Project и Add File(s) to Project,

расположенные внизу панели. Третья кнопка Remove from Project работает в

том случае, если выбран элемент для удаления из состава проекта.

8. Командой меню File > New... > Flash Document создайте новый документ.

Командой File > Save As... сохраните его под названием "lab01" в папке

"lab01". Тип сохраняемого файла – FLA, полное название файла – "lab01.fla".

9. Добавьте файл "lab01.fla" к проекту "lab01".

10. На панели свойств Properties (включается командой Window > Properties,

находится в нижней части окна приложения) в документе "lab01.fla"

проверьте или установите следующие свойства: Size – 550 x 400 pixels;

Background – #ffffff; Frame rate – 30 fps; Publish > Settings... > Current Profile

– Default. На вкладке Flash проверьте или установите: Version – Player 7;

Load order – Bottom up; ActionScript version – ActionScript 2.0.

11. На панели инструментов Tools (включается командой меню Window >

Tools, находится в левой части окна приложения) найдите инструмент для

рисования прямоугольников Rectangle Tool и изобразите в рабочей части

окна прямоугольник, предварительно в разделе Colors (нижняя часть панели)

установив следующие значения: Stroke Color – No Color (красное

перечёркивание); Fill Color – #0099ff.

12. Включите панель цветового микшера Color Mixer (команда Window >

Color Mixer, в правой части окна приложения) и установите следующие

параметры градиентного закрашивания прямоугольника: тип закрашивания –

Linear, Color Proxy первый цвет – #000000, второй цвет – #0099ff.

13. Выделите инструментом Selection Tool закрашенный прямоугольник.

Выберите инструмент Fill Transform Tool и поверните направление

закрашивания за правый верхний угол на 90° против часовой стрелки.

Уменьшите размеры закрашивания до размеров прямоугольника.

14. Выделите прямоугольник и установите для него следующие свойства (на

панели Properties): W – 550, H – 400, X – 0, Y – 0.

15. Выделите прямоугольник и командой Modify > Convert to Symbol

переведите его в объект типа Graphic, используя следующие параметры:

Name -"Background"; Behavior – Graphic; Registration – верхняя левая ячейка

(точка); Linkage – Export for ActionScript; Identifier – "Background" (рис. 1).

Рис. 1. Параметры перевода графического элемента в объект

16. Включите панель библиотеки Library (командой Window > Library,

нижняя правая часть окна). Обратите внимание на объект "Background" типа

Graphic, который только что был создан и теперь присутствует в библиотеке.

17. Инструментом Oval Tool изобразите окружность за пределами сцены,

переведите его аналогичным образом в объект типа MovieClip с названием

"Ball" и установите следующие свойства: W – 50, H – 50, X – 0, Y – 0.

18. Проверьте работу проекта (Test Project) и удалите все объекты со сцены.

19. Для того, чтобы создать экземпляры существующих объектов из

библиотеки на сцене, в первом кадре на панели действий Actions (Window >

Development Panels > Actions) (рис. 2) напишите следующий сценарий:

_root.attachMovie("Background", "background", 0);

_root.attachMovie("Ball", "ball", 1);

20. Проверьте работу проекта "lab01".

Рис. 2. Пример записи сценария на панели Actions

21. Командой File > New... > ActionScript File создайте файл класса, имеющий

тип AS и сохраните его под названием "Main" в той же папке где были

сохранены все предыдущие файлы, полное название файла будет "Main.as".

Добавьте этот файл, как и все остальные, к проекту "lab01".

22. В классе Main необходимо описание функции-конструктора, которая

будет вызвана при создании экземпляра класса во внешней среде Flash IDE.

В тело конструктора необходимо перенести строки сценария из первого

кадра сцены. Также необходимо ввести управляющую переменную target

типа MovieClip, через которую будет указан вызывающий объект:

class Main {

var target:MovieClip;

public function Main(target) {

target.attachMovie("Background", "background", 0);

target.attachMovie("Ball", "ball", 1);

}

23. Для того, чтобы создать экземпляр класса Main на сцене, достаточно в

первом кадре написать одну строку создания переменной main типа Main и

передать название вызывающего объекта (this, то есть самого себя).

var main:Main = new Main(this);

24. Документ "lab01.fla" можно закрыть и больше к нему не возвращаться.

25. Если в проекте присутствует более одного файла, то в диалоговом окне

Default Document Required необходимо указать файл запуска приложения по

умолчанию. В данном случае этим файлом будет являться "lab01.fla".

26. Для дальнейшей работы необходимо создать внутренний метод init() в

классе Main, в который нужно перенести следующие строки:

public function Main(target) {

this.target = target;

init();

}

private function init() {

this.target.attachMovie("Background", "background", 0);

this.target.attachMovie("Ball", "ball", 1);

}

27. Создайте новый класс Motion, содержащий методы для движения

графических объектов. Этот класс будет являться наследником класса

MovieClip, что обозначается в заголовке. Для класса необходимо задать

несколько новых глобальных переменных с указанием типа:

class Motion extends MovieClip {

var object:Object;

var target:MovieClip;

var vx, vy:Number;

public function Motion(target, vx, vy) {

this.target = target;

this.target.object = this;

this.vx = vx;

this.vy = vy;

}

private function stepMotion() {

this._x += this.object.vx;

this._y += this.object.vy;

}

public function startMotion() {

this.target.onEnterFrame = this.stepMotion;

}

28. Для того, чтобы воспользоваться методами класса Motion, необходимо

передать ему подвижный объект в виде переменной:

var ball:MovieClip = this.target.attachMovie("Ball", "ball", 1);

29. Для того, чтобы передать объект типа MovieClip классу Motion для

управления, необходимо создать переменную, а затем вызвать для неё метод:

var motion:Motion = new Motion(ball, 4, 4);

motion.startMotion();

30. Самостоятельно перепишите код одного из классов таким образом, чтобы

объект ball передвигался точно по диагонали сцены при любых её размерах.

Контрольные вопросы:

1). В чём заключается разница между объектами типа MovieClip и Graphic?

2). Почему нельзя передать классу Motion имя объекта вместо переменной?

3). Зачем в классе Motion приводится подстановка this.target вместо target?

4). Можно ли в классе Main вызвать функцию stepMotion() из класса Motion?

5). Для чего в классе Motion используется переменная object типа Object?

Лабораторная работа 2

Ограниченное движение графического объекта

Цель работы:

1). Изучить: простейшие методы физики в компьютерной графике на

примере определения момента столкновения подвижного и неподвижного

графических объектов; принципы наследования классов и объектов.

2). Создать приложение для управления ограниченным и бесконечным

движением одного графического объекта внутри другого.

Порядок выполнения работы:

1. Создайте новую папку, новый проект типа Flash Project и новый

документ типа Flash Document с одинаковыми названиями "lab02".

2. В документе "lab02.fla" создайте два объекта "Background" и "Ball" типа

MovieClip с параметрами из предыдущей работы, перенесите их в библиотеку

документа. На первом кадре создайте экземпляр класса Main.

3. Скопируйте классы Main и Motion из предыдущей лабораторной работы.

4. Создайте новый класс Collision, являющийся наследником класса Motion:

class Collision extends Motion {...}

5. Аргументами для конструктора класса Collision будут являться те же

значения, что и для класса Motion, поэтому их необходимо передать с

помощью оператора вызова суперконструктора super():

public function Collision(target, vx, vy) {

super(target, vx, vy);

this.target.stepMotion = this.stepMotion;

}

6. Единственным методом в классе Collision будет метод startMotion(),

который полностью повторяет аналогичный метод класса Motion.

7. Для того, чтобы расширить список вызовов методом onEnterFrame,

необходимо использовать анонимную функцию function(), например:

this.target.onEnterFrame = function() {...};

8. Для того, чтобы сравнить взаимное расположение двух графических

объектов, необходимо присоединить один объект к другому, например:

var background:MovieClip =

Êthis.target.attachMovie("Background", "background", 0);

var ball:MovieClip = background.attachMovie("Ball", "ball", 0);

9. В конструкторе класса Motion переменным bx и by типа Number

присваиваются значения границ неподвижного объекта background:

this.bx = target._parent._width;

this.by = target._parent._height;

10. Для того, чтобы проверить, будет ли объект ball своей нижней точкой

соприкасаться с границей background, в анонимной функции обработки

метода onEnterFrame необходимо написать следующее условие:

if (this._y> this.object.by-this._height) {

this.object.vy *= -1;

}

11. Самостоятельно напишите ещё три условия для проверки столкновения с

остальными границами объекта background (рис. 3), а также вызов метода

метод startMotion() класса Collision.

Рис. 3. Ограниченное движение графического объекта

Контрольные вопросы:

1). Для чего используется метод onEnterFrame класса MovieClip?

2). Зачем используется подстановка для this.stepMotion в классе Collision?

3). В каких случаях используется анонимная функция function()?

4). Как получить доступ к свойствам родительского объекта?

5). Каким образом наследуются методы классов?