Классы MovieClip и Sprite в ActionScript 3. Создание класса документа

Возможно, Вам никогда и не придется создавать суперкласс, а затем подкласс, который его расширяет. Но, если Вы серьезно настроены работать с AS3, т.е. решили пойти дальше простого размещения кода в кадре на шкале времени, то Вы обязательно столкнетесь с расширением таких классов, как MovieClip и Sprite.

В этом уроке Вы узнаете:

  1. О классах MovieClip и Sprite в ActionScript 3, а также в чем главное отличие второго от первого;
  2. Как расширять эти классы;
  3. Как создается класс документа и для каких целей служит;
  4. Как создавать простое приложение в ActionScript 3 (практический пример).

Класс MovieClip — это шаблон для всех свойств и методов ActionScript 3, являющихся частью объекта MovieClip. Он содержит свойства, с которыми Вы уже, возможно, хорошо знакомы, такие как х и y, определяющие местоположение объекта на сцене, его масштаб и т.д.

Кроме MovieClip в AS3 существует класс Sprite. Его главное отличие от MovieClip следующее: у него отсутствует шкала времени. В большинстве случаев, когда Вы манипулируете объектами только с помощью кода, вам не приходится иметь дела со шкалой времени и кадрами. Поэтому, в таких ситуациях имеет смысл использовать более «легковесный» класс Sprite.

Если Вы создаете класс ActionScript, который расширяет MovieClip или Sprite, то он автоматически наследует все свойства и методы, которые могут быть наследуемы от этих классов. Затем Вы можете добавить специфические методы и свойства, которые будут принадлежать только тому типу объекта, который Вы создаете.

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

  • должен быть оформлен графически;
  • иметь свое положение на сцене;
  • перемещаться определенным образом;
  • вращаться;
  • слушать события ENTER_FRAME для его анимации;
  • слушать события мыши и клавиатуры для взаимодействия с пользователем.

Все эти вещи способны делать как MovieClip, так и Sprite, поэтому можно расширять любой из этих классов.

Затем Вы можете добавить в расширяющий класс такие уникальные свойства, как:

  • скорость;
  • запас топлива;
  • степень повреждения;

а также методы:

  • стартовать;
  • стрелять;
  • повредить;
  • самоуничтожиться и пр.

Давайте создадим такой класс:

package {
  // импортируем класс Sprite
  import flash.display.Sprite;
  // создаем класс SpaceShip, расширяющий Sprite
  public class SpaceShip extends Sprite {
    // декларируем свойства этого класса
    // скорость
    private var speed:Number = 0;
    // повреждения
    private var damage:Number = 0;
    // запас топлива
    private var fuel:Number = 1000;
    // декларируем методы этого класса
    // начать движение 
    public function takeOff():void {
      // . . .
    }
    // получить повреждение
    public function crash():void {
      // . . .
    }
    // стрелять
    public function shoot():void {
      // . . .
    }
    // самоуничтожиться
    public function selfDestruct():void {
      // . . .
    }
  }
}

Заметьте! Первое, что Вы должны сделать — это импортировать класс Sprite, который находится в пакете flash.display. Если Вы решите расширять MovieClip, то вам все равно сначала нужно импортировать этот класс из того же самого пакета: flash.display.MovieClip.

Создание класса документа

Вы уже получили достаточно информации о классах ActionScript 3 для того, чтобы создать такой класс, который был бы действительно полезен. Я уже говорил о том, насколько важны классы при создании swf-файла, который управляется AS3. Главная причина этого — в ActionScript 3 существует концепция класса документа (document class). Говоря простым языком, класс документа расширяет Sprite или MovieClip и используется в качестве главного класса Вашего SWF. После загрузки такого SWF будет Вызван его конструктор. Это станет начальной точкой, после которой будет происходить все, что Вы захотите:

  • создание дополнительных видео-клипов;
  • рисование графики;
  • загрузка последующих материалов и т.д.

Если Вы работаете во Flash CS3-CS6, то у Вас есть возможность использовать класс документа как дополнительную опцию. Вы также можете записывать код прямо в кадре на шкале времени.

Итак, давайте посмотрим на пример такого класса документа:

package {
  import flash.display.Sprite;
  public class Example extends Sprite {
    public function Example() {
      init();
    }
    private function init():void {
      // здесь Вы записываете Ваш код
    }
  }
}

Пока ничего нового, правда? Все это Вы уже видели в предыдущем уроке, но здесь вся информация собрана в одном месте:

  • используется пакет ActionScript по умолчанию;
  • импортируется класс Sprite;
  • расширяется класс Sprite.

В конструкторе мы записываем строчку, которая вызывает метод init. Вы можете поместить весь код непосредственно в конструктор и это не будет ошибкой, но принято считать хорошей практикой ограничение количества кода в нем. Поэтому мы перенесем наш код в другой метод (функцию), а уже его вызовем в конструкторе. На протяжении этого урока и последующих, если я буду показывать Вам в качестве примера какой-то небольшой кусок кода для тестирования, Вы должны будете вставлять его в этот метод init. После компиляции и запуска флеш-ролика (swf-файла) будет Вызван конструктор, который и будет управлять Вашим кодом. Все просто.

Теперь давайте научимся подключать класс документа к swf-файлу.

Создание простого приложения в ActionScript 3.0

На сегодняшний день существует 3 инструмента, способных создавать swf-файл, который, фактически, и является приложением или программой, написанной на ActionScript 3:

Все три продукта созданы американской компанией Adobe. Два первых являются платными, третий — бесплатный, с открытым кодом (open source).

В этом курсе мы будем работать только во Flash Professional (далее, просто Flash).

Итак, давайте создадим класс, задачей которого будет нарисовать красный круг на сцене. Сделать это просто, опираясь на знания, полученные в этом и предыдущих уроках курса «Основы анимации в ActionScript 3.0».

Плюс, мы познакомимся с новым для нас классом Graphics, содержащим набор методов, с помощью которых можно создавать векторные фигуры.

К числу объектов отображения, поддерживающих возможности рисования, относятся объекты Sprite и Shape. Каждый из этих классов включает свойство graphics, являющееся объектом Graphics.

package {
  import flash.display.Sprite;
  public class Test extends Sprite {
    public function Test() {
      init();
    }
    private function init():void {
      graphics.beginFill(0xff0000);
      graphics.drawEllipse(100, 100, 100, 100);
      graphics.endFill();
    }
  }
}

Заметьте, что этот класс является точной копией того, что мы записывали, обсуждая тему создания класса документа. Здесь мы лишь добавили несколько команд рисования в метод init.

Кстати, создать класс документа легче всего именно во Flash. Для этого сохраните этот класс в выбранной Вами папке под именем Test.as. Затем, создайте во Flash новый fla-файл и сохраните его в той же самой папке. Убедитесь, что у fla-файла установками по умолчанию при публикации будут Flash Player 10 и AS3. В панели свойств (Properties) найдите поле Class. Просто введите туда имя Вашего класса: Test.

Класс документа в ActionScript 3

Заметьте, что Вы должны ввести имя класса, а не имя файла, поэтому нет нужды добавлять расширение .as в конце. Однако, если Ваш класс находится внутри пакета с определенной структурой, то укажите полный путь к нему, например, ru.urokiflashas3.Test.

Класс документа в AS3

Теперь Вы должны опубликовать Ваш ролик тем же способом, что и обычно. Flash найдет Ваш класс и включит его в итоговый swf-файл. Когда SWF будет запущен, конструктор и метод init сработают — на экране появится красный круг.

Если Вы используете в своем приложении класс документа, то не вставляйте код на шкалу времени (даже простые комментарии) — это Вызовет конфликт с тем кодом, который добавляет компайлер и, соответственно, проблемы с корректной компиляцией и последующим воспроизведением ролика.

Масштабирование флеш-ролика

Еще один момент на заметку прежде чем мы приступим к реальному программированию: если Вы тестируете свой ролик в среде разработки Flash или в автономном Flash Player’е, то он будет отображаться в размерах, установленных Вами в поле Size панели Свойства (Properties).

Поле Size панель Свойства Flash

Но если Вы тестируете в браузере или какой-либо другой программе, которая способна воспроизводить swf-файлы, то существует вероятность того, что ролик заполнит все доступное пространство, исказив изначально определенный размер. Когда подобное происходит, то просто добавьте следующие две строчки в метод init() Вашего класса:

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

Этот код исключает некорректное масштабирование ролика и помещает его в левый верхний угол окна, которое его отображает. Если Вы решите использовать этот код, то прежде не забудьте импортировать классы flash.display.StageScaleMode и flash.display.StageAlign. Примеры, которые будут разбираться в этом курсе такой код не используют, т.к. он не всегда уместен. Поэтому, просто помните о его существовании и применяйте там где нужно.

Итоги

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

Контрольные вопросы по материалу урока

  1. В чем заключается основное отличие класса Sprite от MovieClip?
  2. Какие свойства этих классов Вы знаете?
  3. Что такое класс документа и для чего он нужен?
  4. Какие классы в ActionScript 3 поддерживают возможность векторного рисования?
  5. Можно ли вставлять код на шкалу времени, если Вы используете класс документа?

Если какая-то часть этого урока требует более развернутого объяснения, то напишите об этом в комментариях ниже.

Ну, и задавайте вопросы, если что-то непонятно. Отвечу на все.