Программирование на ActionScript 3.0 — начало

Если Вы работаете с Flash и используете его пока что только для рисования и простой анимации, создание роликов или баннеров, но ни разу не занимались программированием в нём, то вероятно Вам очень хотелось узнать эту сторону flash-а.

Что такое ActionScript? Как можно писать код на flash-е? Как можно полноценно программировать во flash? Какие инструменты для этого лучше всего использовать? В данной статье приводятся ответы на подобные вопросы.

Эта статья послужит хорошим руководством новичка в программировании под flash на ActionScript 3.0 и поможет выбрать лучшие инструменты для этого.

Что такое ActionScript?

Action Script — это объектно-ориентированный язык программирования, который добавляет интерактивность, обработку данных и многое другое в содержимое Flash-приложений.

С помощью Action Script можно создавать интерактивные мультимедиа-приложения, игры и веб-сайты.

Если Вы работаете с графической средой разработки Flash IDE (например Adobe Flash Professional CS5), но ни разу не интересовались где там можно писать программный код, то вероятно Вас уже волнует вопрос «Где же он прячется, этот AS3?».

AS3 во Flash IDE.

Создадим новый проект File — New — ActionScript 3.0 (рис. 1).

Скрин создания нового проекта flash в flashdevelop
Рис 1. Создание нового проекта AS3.

Появится пустая сцена с пустым кадром на одном слое. Теперь можно выделить кадр и нажать F9, тем самым открыть окно «Actions», в котором и находится область редактирования программного кода данного кадра.

Давайте напишем в открывшемся окне следующий код:

var s: String = "its my AS3 code trace!";
trace(s);
Пример кода actionscript, написанный в редакторе Flash IDE.
Рис. 2. Код, написанный в редакторе Flash IDE.

Теперь можно запускать флешку (Ctrl+Enter). Данный код создаёт переменную s типа String (строка) и присваивает ей начальное значение — строку «its my AS3 code trace!«. Далее, функцией trace(), аргументом которой выступает ново созданная переменная, данная строка (а точнее уже значение переменной s) выводится во вкладку output, которая по умолчанию в интерфейсе IDE располагается рядом с вкладкой timeline.

Рис. 3. Отображение результата функции trace() в окне OUTPUT при запуске flash-ки.
Рис. 3. Отображение результата функции trace() в окне OUTPUT при запуске flash-ки.

Таким образом можно открывать и закрывать(на F9) редакторы кода для любого кадра флеш-приложения.

Вроде картина выходит не плохая — можно создавать разные объекты с анимациями (MovieClip), либо статичные картинки (Sprite) и у каждого объекта будут кадры и в каждом кадре можно запрограммировать всё что угодно. Выглядит удобно и гибко. Но это лишь на первый взгляд. Представьте что у Вас десятки объектов с десятками кадров и всем им нужно описать кодом различную или схожую логику поведения. Во втором случае (схожая логика) — это вообще означает сотни схожих строк кода, которые можно будет замучиться даже копировать из кадра в кадр. А представьте что в процессе разработки вам понадобится что-то изменить. Нет — это не дело! Не для этого хаоса был задуман язык AS3!

В добавок, если Вы поработаете редактором кода Flash IDE и, к примеру, работали в какой-нибудь другой среде программирования (Delphi, Visual Studio), то сразу заметите, что данный редактор, мягко говоря, удручает своей не удобностью и недоделанностью.

Что же делать, спросите Вы? Искать сторонние редакторы кода.

Альтернативные редакторы кода.

Самый лучший вариант для ОС Windows — это FlashDevelop (FD). Скачать свежую версию можно с сайта www.flashdevelop.org.

Для iOS хорошей альтернативой является FDT. Ознакомиться можно на оф. сайте fdt.powerflasher.com.

FlashDevelop.

Т.к. я на данный момент преимущественно обитаю в Windows, то расскажу о редакторе именно под эту ОС. В будущем, когда наберусь опыта в FDT, то напишу и о нём.

В установке нет ничего сложного, качайте свежую версию с оф. сайта и устанавливайте. Редактор совершенно бесплатный и для компиляции использует Flex SDK. Во время стандартной установки FD сам позаботится об установке последнего. Всё что надо установить для FD самому — это Java.

FD имеет массу удобств и особенностей среди которых: горячие клавиши, хорошая авто подстановка, шаблоны классов, возможность создавать свои шаблоны и редактировать имеющиеся.

После установки можно создать новый проект (Project — New Project…), откроется диалог создания проекта, как показано на рис. 4.

Рис. 4. Диалог создания нового проекта во FlashDevelop.
Рис. 4. Диалог создания нового проекта во FlashDevelop.

Как можно заметить, FD позволяет создавать не только AS3 проекты. Но сейчас нас интересует именно AS3 проект, я предпочитаю выбирать заготовку для проекта с Preloader-ом, который и выбран на рис. 4. Далее введите имя проекта (поле Name) и назначьте директорию проекта (поле Location), если стоит галочка «Create directory for project», то в директории Location будет создана папка с именем проекта (Name) и в неё уже поместятся файлы проекта, если галочка не стоит, то файлы поместятся в указанную директорию Location.

После создания проекта справа Вы увидите структуру файлов и папок проекта, откройте папку src и откройте двойным щелчком файл Main.as. После чего Вы должны наблюдать код примерно такой же, как на рис. 5.

Рис. 5. Код класса Main нового проекта во FlashDevelop.
Рис. 5. Код класса Main нового проекта во FlashDevelop.

Попробуем написать какой-нибудь код, например примерно тот же, который пробовали в Flash IDE. Писать можно после комментированной строки «// entry point» т.к. это точка где сцена уже точно создана. напишем команду trace(), на рис. 5. я уже позволил себе это деяние :]

Теперь можно скомпилировать проект (F8) или сразу запускать для тестирования (F5), после запуска в окне Output вы увидите результат работы функции trace() — вывод строки.

Результаты команды trace() можно наблюдать только во время запуска приложения из под IDE, в которой компилируется и запускается код.
При запуске файла .swf в браузере или в обычном flash-плеере результат (а т.е. отображение окна output) не будет виден никому.

Теперь я уверен, что Вам уже не терпится сделать свой первый проект на AS3! А для этого нужно приступить к изучению самого языка.

Изучение языка AS3.

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

Лучшая книга: Колин Мук«ActionScript 3.0 для Flash. Подробное руководство».

Хорошее дополнение к знаниям: Джои Лотт «ActionScript 3.0. Сборник рецептов».

Читал в своё время ещё такую книгу: Рич Шуп «Изучаем ActionScript 3.0. От простого к сложному». Написано хоть и не сильно много и подробно, но для новичков сойдёт, если под рукой нет Мука.

Этих книг весьма достаточно для бодрого старта! Читайте и практикуйтесь, практикуйтесь и читайте. Нет необходимости сесть и читать эти книги от корки до корки, т.к. в процессе чтения важно закреплять знания практикой, да и Вам самим будет приятно сделать что-нибудь как можно скорее :]

Во время быстрого поиска документации в инете очень помогает оф. документация от Adobe.

Для дальнейшего развития, для хорошего осознания ООП и шаблонов проектирования (а это очень важно для хорошей ООП структуры) Вам будет незаменима следующая книга: Уильям Сандерс, Чандима Кумаранатунг «ActionScript 3.0. Шаблоны проектирования».

На этом сайте вы так же найдёте не мало аспектов программирования на AS3, накопленных моим опытом.

К примеру, теперь вы можете узнать как использовать графику созданную в Flash IDE в своих флеш-проектах на FD, прочитав статью: Рисуем во Flash IDE, а кодим во FlashDevelop-е.

Или попробовать сделать свой первый прелоадер прочитав статью: Preloader своими руками.

Всего доброго и успешных проектов!