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

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

Лабораторная работа 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 {...}

получаем:

class Collision extends Motion {// Constants:

public static var CLASS_REF = Collision;

public function Collision() {// constructor code}

}

5. Аргументами для конструктора класса Collision будут являться те же значения, что и для класса Motion, поэтому их необходимо передать с помощью оператора вызова суперконструктора super():

public function Collision(target, vx, vy) {

super(target, vx, vy);

this.target.stepMotion = this.stepMotion;

}

т.е. получаем:

class Collision extends Motion{// Constants:

public static var CLASS_REF = Collision;

public function Collision(target, vx, vy)

{

super(target, vx, vy);

this.target.stepMotion = this.stepMotion;

}

6. Единственным методом в классе Collision будет метод startMotion(), который полностью повторяет аналогичный метод класса Motion.

получаем:

class Collision extends Motion{// Constants:

public static var CLASS_REF = Collision;

public function Collision(target, vx, vy)

{

super(target, vx, vy);

this.target.stepMotion = this.stepMotion;

}

public function startMotion()

{

this.target.onEnterFrame = this.stepMotion;

}

7. Для того, чтобы расширить список вызовов методом onEnterFrame, необходимо использовать анонимную функцию function(), например:

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

получаем:

class Collision extends Motion{// Constants:

public static var CLASS_REF = Collision;

public function Collision(target, vx, vy)

{

super(target, vx, vy);

this.target.stepMotion = this.stepMotion;

}

public function startMotion()

{

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

}

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

var background: MovieClip = this.target.attachMovie(" Background", " background", 0);

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

этими строками заменить строки в main.as: this.target.attachMovie(" Background", " background", 0);

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

9. В конструкторе класса Motion создать переменные bx и by типа Number и присвоить им значения границ неподвижного объекта background:

this.bx = target._parent._width;

this.by = target._parent._height; получаем:

public function Motion(target, vx, vy)

{ this.target = target;

this.target.object = this;

this.vy = vy;

this.vx = vx;

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.

условия:

this.target.onEnterFrame = function()

{

this.stepMotion();

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

{

this.object.vy *= -1;

}

if (this._x > this.object.bx - this._width)

{

this.object.vx *= -1;

}

if (this._y < 0)

{

this.object.vy *= -1;

}

if (this._x < 0)

{

this.object.vx *= -1;

};

}

вызов в main.as в функции init

private function init()

{

var background: MovieClip = this.target.attachMovie(" Background", " background", 0);

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

var collision: Collision = new Collision(ball, 4, 4);

collision.startMotion();

}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Цель работы:

1). Изучить: основные методы работы в графическом приложении Flash; способы создания графических элементов и определения их типов; принципы построения классов в ActionScript 2.0; а также основные приёмы объектно-ориентированного программирования на языке ActionScript 2.0.

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

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

1. Откройте приложение Flash.

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. Выделите инструментом Selection Tool закрашенный прямоугольник. Включите панель цветового микшера Color Mixer (команда Window > Color Mixer, в правой части окна приложения) и установите следующие параметры градиентного закрашивания прямоугольника: тип закрашивания – Linear, Color Proxy первый цвет – #000000, второй цвет – #0099ff.

13. Выделите инструментом Selection Tool закрашенный прямоугольник. Выберите инструмент Free 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".

21. Командой File > New... > ActionScript File создайте файл класса, имеющий тип AS и сохраните его под названием " Main" в той же папке где были сохранены все предыдущие файлы, полное название файла будет " Main.as". Добавьте этот файл, как и все остальные, к проекту " lab01".

22. В классе Main необходимо описание функции-конструктора, которая будет вызвана при создании экземпляра класса во внешней среде Flash IDE. В тело конструктора необходимо перенести строки сценария из первого кадра сцены. (т.е удалить все что там было).Также необходимо ввести управляющую переменную target типа MovieClip, через которую будет указан вызывающий объект:

class Main {

var target: MovieClip;

// Constants:

public static var CLASS_REF = Main;

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 {

// Constants:

public static var CLASS_REF = Motion;

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);

т.е добавить в тело процедуры init:

private function init()

{

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

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

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

}

29. Для того, чтобы передать объект типа MovieClip классу Motion для управления, необходимо создать переменную, а затем вызвать для неё метод:

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

motion.startMotion();

т.е добавить в тело процедуры init:

private function init()

{

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

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

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

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

12 3 Следующая ⇒