Flash — Flash + ActionScript


Содержание

Flash — Flash + ActionScript

Прошлая статья была посвящена анимации. Мы создавали анимацию на основе motion tweening, shape tweening и просто составляли движение из отдельных кадров. Думаю, пора перейти к более сложной теме — рассмотрению инструмента, который создает основу для большинства качественных Flash-фильмов.

Этот инструмент — ActionScript: событийно-управляемый язык, встроенный во Flash. Последняя версия ActionScript, которая присутствует во Flash 5, существенно отличается от предыдущей. Если в прошлой версии это был ограниченный набор команд, позволяющий осуществлять лишь основные действия и вводимый с помощью не очень удобного интерфейса, то новый ActionScript — это мощный язык с увеличенным набором команд, поддержкой классов, наследования (!) и гораздо более удобным интерфейсом.

ActionScript делает ваши страницы интерактивными. Вы можете реагировать на события с мышки или с клавиатуры, можете выполнить какие-либо действия при проигрывании определенного кадра.

Для того чтобы овладеть ActionScript в полной мере, желательно уже иметь опыт программирования (предпочтительно на С++, JavaScript, etc.). Однако одним из достоинств языка Flash является то, что вам не нужно быть профессионалом во Flash, или полностью знать ActionScript, чтобы писать на нем качественный код. Вы можете использовать лишь те возможности языка, которые сочтете необходимыми для своей работы.

Так как эта статья посвящена основам языка, в ней мы рассмотрим:

  • Панель действий (Actions panel), на которой происходит практически все общение с ActionScript.
  • Кнопки — как их заставлять работать так, как нам требуется.
  • Пути — как обращаться к нужным объектам?
  • Основные действия с Flash-мультиками (movie clips) — мы будем управлять процессом проигрывания фильма, как нам угодно.
  • Отладку в ActionScript — окошки Output и Debugger.

Цель этой статьи — дать вам возможность почувствовать ActionScript и показать, что этот язык может служить как для создания весьма внушительных программ, так и для выполнения элементарных действий, которые сделают вашу страницу гораздо привлекательней.

Термины

Прежде чем мы перейдем к конкретным действиям, несколько терминов из области ActionScript:

  • Действия (Actions) — это инструкции, которые говорят Flash-мультику, что делать. От них произошло название языка — ActionScript (дословно — сценарий действий). Давайте договоримся, что в рамках этой статьи мы будем использовать термин «инструкция», дабы не путать их с настоящими действиями, которые будем производить.
  • События (Events) — это действия, которые происходят, когда проигрывается мультик. События, например, могут происходить, когда заканчивается загрузка какого-то кадра, когда мы достигаем какого-то кадра, когда пользователь нажимает клавишу на клавиатуре или курсор мышки оказывается над нашим объектом.
  • Выражения (Expressions) — это любая часть инструкции, которая порождает значение. Следующие примеры являются выражениями: 2 + 2, 2 * 2, a + b, 2*pi*r, (15 + k) * random(10).
  • Функции (Functions) — это блоки кода, которые можно многократно использовать. Функциям можно передавать значения и получать от них результат. Например, number = get_color(15, 24). 15 и 24 являются аргументами (или параметрами) функции get_color, возвращаемое значение которой записывается в переменную number.
  • Классы ( >Эти термины мы будем использовать при обсуждении ActionScript. Итак.

Панель действий (Actions Panel)

Панель действий служит для отображения и ввода ActionScript-программ (рис. 1). Существует два режима работы с панелью — нормальный (для «чайников») и экспертный. В экспертном режиме список команд — это простое поле для ввода текста. В нормальном же режиме мы не можем напрямую редактировать команды. Для этого используется панель параметров.

Добавить инструкцию можно, нажав на кнопку «+» (см. рис. 1) или выбрав соответствующую инструкцию в списке элементов языка. Кроме того, для всех действий во Flash имеются последовательности клавиш, с помощью которых это можно сделать гораздо быстрее. Они приведены справа от каждого действия в меню кнопки «+». Например, чтобы добавить функцию stop(), нужно нажать Esc+st (последовательно: Esc, затем «s», затем «t»).

Удалить инструкцию можно, выбрав ее и нажав кнопку «-» (или просто клавишу Delete).

Я рекомендую вам не начинать сразу же пользоваться экспертным режимом, если у вас нет опыта программирования на Java-подобных языках (С++, Java, JavaScript). У нормального режима есть большое достоинство, делающее его незаменимым для новичков — в этом случае гораздо меньше шансов ошибиться с синтаксисом языка. Новичкам это поможет быстрее понять тонкости ActionScript.

Рис. 1 — Панель действий

В панели действий отображаются действия объекта либо кадра, выбранного в данный момент.

Кнопки

Первое, что хочется, когда начинаешь изучать интерактивность Flash — сделать что-нибудь, что бы откликалось на действия пользователя, «оживить» ваше творение, добавить обратную связь. Самый простой способ сделать это — кнопки. Поэтому с них-то мы и начнем.

Как вы знаете, во Flash существует специальный тип символа для создания кнопок — Button (см. Macromedia Flash ч. 2). Будем считать, что вы уже научились создавать кнопки, теперь научимся отслеживать нажатия на эти кнопки.

Кнопки в Macromedia Flash обладают обширным списком событий, на которые мы можем реагировать:

  • press — клавиша мышки нажата, когда курсор находится в пределах кнопки;
  • release — клавиша мышки отжата, когда курсор находится в пределах кнопки;
  • releaseOuts >К сожалению, Flash "понимает" только левую клавишу мыши. Правая используется для вызова контекстного меню (щелкните правой клавишей на каком-нибудь Flash мультике). Способов отлавливать во Flash среднюю клавишу или "колесико" (mouse wheel) я пока не встречал; думаю, что их не существует.

Перехватываются эти события с помощью директивы on(). Синтаксис ее таков:

Ниже вы можете сами попробовать вызвать некоторые события:

Очень часто используемый пример - переход по ссылке при нажатии на кнопку:

Чтобы проверить этот сценарий, выделите вашу кнопку, нажмите Ctrl+Alt+A и введите программу.

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

Основные действия с Movie Clips

Огромная доля творчества во Flash приходится на манипуляцию символами. Практически все базовые приемы, все трюки и эффекты невыполнимы без этих действий.

С помощью сценариев на ActionScript вы можете выполнять практически любые действия над символами. Надо только помнить, что выполнить эти действия можно только либо в ответ на действие пользователя, либо при наступлении какого-то кадра на временной шкале.

Итак, что же у нас есть? Я перечислю только основные (на мой взгляд) инструменты. Остальное вы найдете в списке элементов языка или в помощи.

Функции клипов (movie clip), которые можно вызывать:

  • play() - начинает или возобновляет воспроизведение клипа;
  • stop() - останавливает воспроизведение клипа;
  • gotoAndPlay() - переходит на определенный кадр (сцену) и продолжает воспроизведение;
  • gotoAndStop() - переходит на определенный кадр (сцену) и останавливает воспроизведение.

Свойства (параметры) клипов, которые можно считывать/изменять:

  • _x, _y - координаты клипа (в пикселях);
  • _xscale, _yscale - масштаб клипа (в процентах), соответственно по горизонтали и по вертикали;
  • _w >Это далеко не все, что можно делать с клипами. Используйте другие параметры, экспериментируйте, творите!

Имена

Для того, чтобы обращаться к клипам, нам потребуется разобраться с понятием имени объекта (instance name) и пути до объекта (target path). Договоримся, что клип (movie clip) и объект для нас - одинаковые вещи.

Имя объекта - это имя конкретного экземпляра символа. Скажем, у нас может быть символ - машинка, а экземпляры этого символа будут называться "Машинка1", "Машинка2", "Pickup", "Запорожец".

Для того чтобы дать имя объекту, нужно выделить объект и в панели Instance (Window->Panels->Instance, Ctrl+I) в графе Name ввести имя объекта (рис. 2). Имена могут состоять только из букв, цифр и символа подчеркивания ("_"), причем имя не может начинаться с цифры.

Рис. 2 - Панель Instance

Путь до объекта - это запись имени объекта с учетом иерархии. Попытаюсь объяснить, что это такое.

Вы знаете, что во Flash объекты можно "вкладывать" друг в друга, составляя таким образом иерархию. Так вот, эта вложенность обеспечивает не только удобство в обращении с объектами, она еще и ограничивает видимость имен объектов. Видимость ограничивается своим уровнем. Объект может напрямую (по имени) обращаться только к объектам, входящим в него, стоящим на 1 уровень ниже в иерархии.

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

Путь включает в себя объекты, через которые нужно "пройти" по дереву иерархии, чтобы добраться до нужного нам объекта. Имена объектов перечисляются через точку. Кроме того, существует несколько указателей (можно их назвать "виртуальными объектами"), которые часто очень полезны:

this - указатель на "самого себя" (т.е. на текущий объект). Бывает нужен, например, для передачи в функцию указателя на объект, из которого эта функция вызывается.

_parent - указатель на "родителя". Указывает на объект, стоящий в иерархии одним уровнем выше.

_root - "корень". Это начало иерархии. Без него не обойтись при указании абсолютного пути.

Путь выглядит так:

leaf.play(); - у подобъекта leaf (лист) вызывается функция play();

_parent.tree.leaf.stop(); - подразумевается, что на одном уровне имеется объект tree, у которого есть объект leaf, у которого и вызывается функция stop();

_root.banner._visible = false; - сделать клип banner, находящийся на 1-м уровне, невидимым.

Рис. 3 - Иерархия клипов

Для иллюстрации возьмем иерархию из 5-ти объектов (рис. 3). Объекты 1-4 находятся на 1-м слое, объект 5 - на 2-м слое. Объект 2 вложен в объект 1, а объект 3 вложен в объект 2. Объекты на рисунке визуально вложены друг в друга, но это ни в коем случае не означает, что так должно быть и "в жизни". Здесь они так сгруппированы для наглядности. Так как имя объекта не может начинаться с цифры, пусть объекты у нас называются obj1-obj5.

Теперь займемся путями. Для начала посмотрим, какие объекты могут обращаться друг к другу по имени. obj1 может обращаться к obj2, а obj2 - к obj3, но при этом obj1 не может обратиться к obj3 напрямую, т.к. тот содержится не в obj1, а в obj2.

Например, первому объекту нужно, чтобы объект 3 начал заново воспроизводиться с 1-го кадра. Вот как это делается:

Чтобы 4-му объекту сделать 1-й объект (заметьте - со всеми подобъектами!) полупрозрачным, ему нужно в своем сценарии написать следующее:

Так как obj4 у нас находится на первом уровне иерархии, то для него _root и _parent - одно и то же.

Теперь для объекта 3 напишем скрипт, который сделает объект 5 невидимым при нажатии клавиши мыши. В сценарии для объекта 3 пишем:

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

Надеюсь, я прояснил момент с путями.

Приведенные выше примеры показали не только как выглядят пути, но и как вызываются функции и присваиваются значения свойствам.

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

Одними из самых важных являются функции управления ходом воспроизведения клипа (play(), stop(), gotoAndPlay(), gotoAndStop()). Функции play() и stop() вызываются без параметров, в то время как в goto нужно указывать кадр, и, возможно, сцену.

Отладка в ActionScript

Последнее, что мы рассмотрим в этой статье - окна Output (вывод) и Debugger (отладчик). Это инструменты, служащие для отладки сценариев ActionScript.

Окошко Output пришло из Flash 4, где оно было единственным инструментом для отладки. Существует директива trace(), которая выводит сообщения в это окошко. Туда же выводятся сообщения об ошибках.


Использовать trace очень просто:

В 5-м Flash появился специальный инструмент - окошечко Debugger. Чтобы им пользоваться, нужно проверять свои фильмы не как обычно (Test movie, Ctrl+Enter), а с помощью Debug movie (Ctrl+Shift+Enter). Окошко Debugger (рис. 4) можно скрыть/показать с помощью Window->Debugger.

Рис. 4 - Окно Debugger

В одной части окна Debugger находится иерархический список объектов, используемых в фильме. Выбрав объект, можно просматривать его свойства (закладка Properties).

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

И, наконец, можно добавить любые переменные в список просмотра (Watch list) и наблюдать за их значениями (закладка Watch).

Debugger позволяет отслеживать практически любые параметры Flash-фильмов. Тем не менее, я считаю, что свое применение есть и у окошка Output, и у Debugger-a.

Вот и все на этот раз. Это - последняя статья из цикла. К счастью, сейчас появилось много материалов и руководств по основам Macromedia Flash 5. Статьи по различным аспектам Flash постепенно переводятся/сочиняются на русском языке и появляются на наших сайтах. Последующие материалы по Flash будут посвящены его "продвинутым" аспектам. Так же есть идея написания руководств по другим программам, производящим Flash-фильмы (в частности трехмерные).

Удачи вам! У вас есть великолепное средство делать сеть (и не только сеть) красивее! Пользуйтесь им, доставляя удовольствие посетителям ваших творений и самим себе.

Появился обещаный список ссылок на Flash-ресурсы:

Теперь все мои материалы (с примерами на Flash) можно найти здесь:

Flash ActionScript учебный курс, изд-во 'Питер' 2001г.

  • Возможности ActionScript
    • Система ActionScript как интеллектуальная среда
    • ActionScript как модульный язык
    • ActionScript и ООП
  • Назначение сценариев
    • Клипы
    • Кнопки
    • Свойства экземпляра
    • Свойства кадра
  • Создание сценариев ActionScript
    • Панель операций
    • Обработка событий
    • Редактирование выражений
  • Клипы и пути в ActionScript
    • Независимые киноленты
    • Пути
  • Что нового мы узнали?

ActionScript — это язык сценариев, который позволяет разработчикам макси-мально реализовать потенциал фильмов в формате Flash. В этом уроке вы познакомитесь с рядом простейших объектов, применяемых в сценариях ActionScript, и узнаете о роли, которую играют различные элементы этого языка в его структуре.

Возможности ActionScript

Если вы уже сталкивались с фильмами в формате Flash, то никак не могли обойтись без средств языка ActionScript. Скажем, кнопки Stop (Остановка) и Play (Воспроизведение) всегда связаны со сценариями ActionScript. Этот язык призван обслуживать потребности Flash, и все команды ActionScript связаны с соответствующими объектами фильмов Flash. В частности, команды Play и Stop соответственно обеспечивают воспроизведение и остановку клипа или киноленты (timeline). В других языках сценариев и в большинстве языков программирования упомянутые команды носят более общий характер и для их надлежащей реализации может потребоваться дополнительная информация. При использовании ActionScript в фильмах Flash команда Stop совершенно недвусмысленно предписывает необходимость остановить воспроизведение фильма на текущем кадре. Язык ActionScript настолько прост и универсален, что его можно использовать как бы исподволь, незаметно для себя, — это коренным образом отличает его от других языков сценариев и от языков программирования иного типа.

Познакомившись в общих чертах с простейшими командами ActionScript, вы поневоле должны задаться вопросом: «А что вообще можно сделать в формате Flash без сценариев ActionScript?» Ответ: «Почти ничего (особенно если речь идет об интерактивных фильмах)». Разумеется, даже большой фильм можно сделать исключительно пассивным, лишив его обратной связи со зрителем. Но пассивные клипы хороши только для случайно заглянувших на ваш сайт зевак: они готовы просто посмотреть ваш фильм от начала до конца и им не придется к нему возвращаться.

Средства ActionScript позволяют предусмотреть в клипе возможность для принятия пользователем определенных решений, то есть сделать пользователя активным участником просмотра. Вы включаете в сценарий ряд условий, пользователь выбирает одну из предоставленных возможностей, а система воспроизведения Flash адекватно реагирует на его действия. Вы можете, к примеру, ввести в фильм сценарий ActionScript, который позволит пользователю сделать три попытки дать правильный ответ на поставленный вопрос. После третьей неудачной попытки сценарий автоматически отправит пользователя освежить память, перенося его к метке Refresher-Course, — здесь находится кадр, содержащий информацию, относящуюся к текущему вопросу, Простейший механизм, пригодный для реализации системы вопросов с несколькими попытками дать ответ, — это цикл в кадре (frame loop), то есть последовательность команд сценария ActionScript, в которой обеспечивается подсчет количества попыток, произведенных пользователем. Когда максимальное число попыток исчерпано, пользователя следует отправить к кадру с именем RefresherCourse.

Сходным образом, если вы хотите создать «игровой автомат» (arcade), фильм Flash должен будет быстро и четко реагировать на целый массив событий. Обычные старые фильмы в формате Flash, в которых не применяются средства языка ActionScript, вообще не способны реагировать на действия пользователя. Язык ActionScript дает возможность проигрывателю Flash узнавать местонахождение указателя мыши и других объектов на экране, а также устанавливать зависимости между действиями игрока и различными объектами, определять оставшееся время и уровень подготовки игрока. При этом система Flash может постоянно вести счет игры. Все эти задачи решаются средствами ActionScript весьма эффективно.

Если вы создаете фильмы главным образом для Web-страниц, сценарии Action-Script могут действовать также в качестве посредников. Когда пользователь в ходе работы с фильмом вводит какие-либо данные, они могут передаваться соответствующим Web-страницам и влиять на поведение последних. Возможна и обратная картина, когда информация Web-страницы передается фильму. Еще более важной является возможность получать с помощью сценариев Action-Script ту или иную информацию и передавать ее непосредственно серверу для сохранения и обработки в базе данных. Это обеспечит ваш Web-сайт динамическим пользовательским интерфейсом на основе Flash. Пользователь сможет, например, ввести в клипе свое имя, адрес и номер кредитной карточки; полученные данные можно передать Web-серверу, отвечающему за обработку заказов.

Разработчики языков сценариев и языков программирования, как правило, бывают потрясены, когда узнают, что пользователи умудрились найти в том или ином языке больше возможностей, чем предусмотрено разработчиком. Язык ActionScript создавался прежде всего как средство, призванное обеспечить взаимодействие с пользователями фильмов в формате Flash; при этом конкретные виды и объем такого взаимодействия ограничены лишь рамками воображения автора.

Система ActionScript как интеллектуальная среда

В предыдущих версиях пакета ActionScript вся работа со сценариями была сосредоточена в небольшом окне, где необходимые операции выбирались в меню. На экране представлялся лишь небольшой фрагмент исходного текста, и создать в таких условиях мало-мальски интересный сценарий было задачей, мягко говоря, сложной. В версии Flash 5 язык ActionScript превратился в абсолютно самостоятельный объектно-ориентированный язык сценариев. Он во многом схож с JavaScript, но последовательное формирование сценария и данной системе осуществляется путем выбора мышью необходимых языковых конструкций. Предназначенный для опытных пользователей экспертный режим позволяет вручную вводить код, как в обычном текстовом редакторе; предусмотрены также механизмы автозавершения и выбора для вставки в текст сценария различных языковых конструкций: команд, функций, операторов и объектов — с помощью мыши. Окно редактора ActionScript, доступное через панели Object Actions (Операции объекта) и Frame Actions (Операции кадра), в обычном режиме помогает начинающим в изучении и применении языка ActionScript. Этот режим используют начинающие пользователи; опытные создатели фильмов, как правило, не прибегают к его услугам.

ActionScript как модульный язык

ActionScript — модульный язык программирования. Это значит, что сценарии на этом языке являют собой небольшие модули, которые выполняют строго определенные функции, например остановку или воспроизведение клипа. Модули относительно автономны, однако ни один из них не является независимым от всех прочих компонентов фильма. В общих чертах ваша задача как автора фильмов сводится к тому, чтобы связать сценарии ActionScript с соответствующими кнопками, клипами и кадрами; когда при воспроизведении фильма пользователь щелкает на какой-то кнопке или просто наступает черед кадра или клипа, с которым связан определенный сценарий ActionScript, этот сценарий автоматически запускается. Это вовсе не значит, что сценарии ActionScript не могут быть изощренными, сложными. Модульность языка предполагает лишь то, что в большинстве случаев работа программиста над фильмом сводится к написанию небольших по объему сценариев для кнопок, клипов и кадров.

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

ActionScript и ООП

Приятным сюрпризом для опытных программистов (и обстоятельством, чрезвычайно полезным для повышения профессионального уровня прочих разработчиков) является тот факт, что язык ActionScript построен на принципах объектно-ориентированного программирования (ООП). Если не вдаваться в технические нюансы ООП (чтобы не прогневить ненароком богов информатики), можно сказать, что сущность объектно-ориентированного подхода состоит в интерпретации всех элементов программы как объектов. Сцена, кадр, текстовый блок, рисунок, символ — все это объекты языка ActionScript. У объектов имеются атрибуты (attributes), или свойства (properties), — поля, значения которых могут изменяться сценариями; у каждого объекта есть уникальный идентификатор (unique ID), который позволяет ссылаться на этот объект в тексте сценариев ActionScript. Допустим, у вас есть клип с именем Cecil. У объекта Cecil наличествует атрибут Rotation, позволяющий задать угол поворота данного объекта. В этом случае сценарий ActionScript может «сообщить» объекту Ceci 1 о необходимости повернуться на 90 градусов (табл. 1.1).

Таблица 1.1. Характеристика клипа

Объект Атрибут Уникальный идентификатор Сценарий ActionScript
Клип Rotation Cecil "Повернуть объект Cecil на 90 градусов"

Объекты могут образовать иерархическую структуру — любой объект может состоять из других объектов. Например, клип может включать в себя графические символы, рисунки, кнопки и даже другие клипы, находящиеся в разных слоях (layers). Некоторые из указанных объектов в свою очередь могут состоять из других объектов. Рассмотрим следующую структуру:

  • zoo (зоопарк) — основная кинолента, корень структуры;
  • lion (лев) — клип на основной киноленте;
  • teeth (зубы) — клип, являющийся частью клипа lion;
  • Color (цвет) — свойство клипа teeth (в данный момент цвет белый — значение этого свойства представляется шестнадцатеричным числом FFFFFF). Объект, именуемый zoo, представлен на основной киноленте, или в корневом слое. Объект zoo содержит клип 1 ion. В свою очередь, 1 ion содержит объект teeth. Если какой-либо объект изменяется, это изменение отражается и на других объектах. Допустим, цвет (color) зубов (teeth) у нашего льва (lion) изменился с белого на золотистый (меняется значение свойства Color объекта teeth). В результате меняется и внешний вид зоопарка (zoo): первоначально объект zoo содержал объект lion, представляющий льва с белыми зубами, а сейчас у этого льва зубы золотистые. Запишем наш пример на языке ActionScript.

toothColor=new Color(_root.lion.teeth); toothColor.setRGB(FF9900);

Такое изменение можно произвести в сценарии, обрабатывающем щелчок на какой-либо кнопке, в сценарии определенного кадра, или клипа teeth, или другого клипа. Пока существует соответствующий объект (как правило, клип), все прочие объекты, содержащие сценарии ActionScript, могут направлять этому объекту различные команды. Однако во всех командах следует указывать соответствующий путь; необходимо также соблюдать ряд других синтаксических ограничений. В нашем случае иерархия объектов отражается в следующей форме: root.lion.teeth

Сценарий ActionScript вне зависимости от того, где он находится, может изменять данные в любой иерархической структуре объектов. Сценарий может воздействовать как на модель поведения того объекта, к которому он относится, так и на поведение и свойства другого объекта. Скажем, у объекта клипа с именем child (ребенок), находящегося на основной киноленте, может быть сценарий, отдающий объекту grandchild (внук), представляющему другой клип, расположенный в иной иерархической структуре, команду перейти к кадру 34 и воспроизвести его. При этом может быть также отдана команда увеличить изображение кадра 34 в два раза. В свою очередь, кадр 34 также может содержать сценарий, распоряжающийся объектами, которые принадлежат какому-то третьему клипу.

Работать со сценариями и объектами в иерархической структуре не так сложно, как это может показаться. Средства ООП в системе Flash предоставляют в распоряжение разработчика модульную архитектуру; программа состоит из коротких сценариев, относящихся к отдельным кадрам, кнопкам и клипам; создать такой набор модулей проще, чем написать одну большую программу длиной 29 876 строк. При создании фильма в формате Flash как с помощью сценариев ActionScript, так и без таковых важно правильно разбить данные на части и продумать способ применения механизма ключевых кадров. Объектно-ориентированная среда требует также строгого планирования, которое помогает эффективно разобрать фильм Flash на отдельные компоненты, реализуемые средствами ActionScript. Таким образом, ActionScript можно охарактеризовать как простейший, однако весьма эффективный язык объектно-ориентированного программирования, позволяющий упростить работу над фильмами и сделать ее не такой утомительной.

Назначение сценариев

Предельно упрощая, можно считать, что сценарии ActionScript встраиваются в экземпляры клипов, кнопок и кадров, однако следует иметь в виду, что на состояние этих клипов, кнопок и кадров влияет множество самых разных условий. Перед написанием сценария необходимо четко продумать те ситуации, связанные с различными клипами, кнопками и кадрами, при которых этот сценарий будет использоваться в вашем фильме.

Клипы

Клипы Flash 5 могут иметь собственные сценарии. В предыдущих версиях языка ActionScript сценарии могли быть только у кнопок и кадров. Поскольку именно клипы (и только они) являются теми объектами, свойства которых могут изменяться при изменении сценариев, они в настоящее время являются наиболее важными объектами формата Flash 5 и языка ActionScript. Вообще говоря, объекты могут также изменяться при переходе к фрагментам киноленты, где кадрируемые (tweened) объекты находятся в процессе трансформации или обновляются в ключевом кадре. Однако только клипы располагают свойствами, которые можно адресовать и изменять с помощью сценариев ActionScript. Для создания клипа следует выполнить следующую последовательность шагов.

  1. Выполните команду File > New (Файл > Создать) или воспользуйтесь комбинацией клавиш Ctrl+N (Windows) либо Cmd+N (Macintosh), чтобы открыть новую страницу Flash..
  2. Выберите инструмент Rectangle (Прямоугольник) в наборе инструментов, нарисуйте прямоугольник на странице и выделите его с помощью инструмента Arrow (Стрелка), захватив в формируемую (при нажатой кнопке) мышью область выделения весь прямоугольник.
  3. Выполните команду Insert t Convert to Symbol (Вставка > Преобразовать в символ) или нажмите клавишу F8, чтобы открыть окно свойств символа. В раскрывающемся списке Behavior (Модель поведения) выберите вариант Movie Clip (Клип), назовите свой клип МуМС и щелкните на кнопке ОК.
  4. Выполните команду Window > Panels > Instance (Окно > Панели > Экземпляр) или воспользуйтесь комбинацией клавиш Ctrl+I (Windows) либо Cmd+N (Macintosh). Когда на экране появится панель Instance (Экземпляр), наберите строку sample в поле Name (Имя), как показано на рис. 1.1.

Рис. 1.1. В панели Instance можно ввести имя экземпляра клипа

Ваш клип готов к работе. На рисунке представлены вновь созданный клип и панель Instance (Экземпляр), играющая одну из ключевых ролей в организации работы сценариев. Имя экземпляра, введенное в поле Name (Имя), фактически более важно, чем имя символа, показанное над раскрывающимся списком Behavior (Модель поведения).

Кнопки

До выхода Flash версии 5 кнопки были единственными символьными объектами, где могли размещаться сценарии. И несмотря на то что в настоящее время клипам также можно назначать сценарии ActionScript, кнопки по-прежнему играют в этом языке ключевую роль. Пользователям фильмов Flash хорошо известно, что символ кнопки внешне может вообще мало походить на кнопку. Символ кнопки может быть частью большого графического изображения, спокойно ожидающей «своего часа» — момента, когда пользователь осуществит какие-то операции с фильмом. Например, символ кнопки может представлять собой изображение человека, сидящего вместе с другими людьми за столом в кабинете для совещаний. Когда пользователь щелкает на кнопке с изображением человека, фильм переходит к кадру, представляющему ту или иную информацию о служебных обязанностях данного человека.

Чтобы создать символ кнопки в системе Flash, выполните следующие шаги.

  1. Выберите команду File > New (Файл > Создать) или воспользуйтесь комбинацией клавиш Ctrl+N (Windows) либо Cmd+N (Macintosh), чтобы открыть новую страницу Flash.
  2. Сделайте двойной щелчок на имени слоя Layer 1 в окне киноленты и переименуйте этот слой в RealButton. Возможность изменить имя появляется при двойном щелчке на имени нужного слоя.
  3. Выберите инструмент Circle (Окружность) [Строго говоря, такого инструмента нет. Есть инструмент Oval (Овал). Если вам нужна именно окружность, используйте этот инструмент при нажатой клавише Shift. — Примеч. перев.] и нарисуйте окружность в рабочей зоне (stage).
  4. Щелкните на имени RealButton в списке слоев в окне киноленты. При этом вновь созданная окружность будет выделена.
  5. Выберите команду Insert > Convert to Symbol (Вставка > Преобразовать в символ) или нажмите клавишу F8.
  6. В окне свойств символа установите переключатель Button (Кнопка) в группе Behavior (Модель поведения) и введите имя RealButton в поле Name (Имя), как показано на рис. 1.2. Для нового символа на киноленте автоматически создаются кадры Up (кнопка отжата), Over (указатель мыши над кнопкой), Down (кнопка нажата) и Hit (срабатывание). Эти кадры не имеют большого значения для самого сценария ActionScript, но определяют условия активизации сценария с помощью мыши.

Вы можете также выбрать одну из готовых кнопок, поставляемых вместе с пакетом Flash, обратившись к команде Window > Common Libraries > Buttons (Окно > Общие библиотеки > Кнопки). При этом на экран будет выведено окно библиотеки кнопок, позволяющее выбирать стандартные кнопки. Выбранная кнопка дублируется в этом окне в области предварительного просмотра. Нужную кнопку достаточно перетащить мышью в рабочую зону. Вы можете создавать произвольное количество копий одной и той же кнопки. Копии называются экземплярами (instances). Однако следует учитывать, что для работы с несколькими экземплярами одного символа для каждого экземпляра необходимо создать отдельный слой. (Теоретически фильм в формате Flash может нормально функционировать даже при наличии нескольких экземпляров кнопки в одном слое, но управление ими может превратиться для вас в серьезную проблему.)

Рис. 1.2. Диалоговое окно Symbol Properties при создании символа кнопки

Свойства экземпляра

Каждый экземпляр символа соотносится с определенным способом применения последнего. Строго говоря, конкретная кнопка представляет собой экземпляр символа, обладающего специфическими характеристиками кнопки. Основные свойства кнопки немногочисленны, но имеют исключительно большое значение для сценариев ActionScript. Чтобы познакомиться со свойствами того или иного экземпляра, выделите его мышью, а затем выполните команду Modify > Instance (Модифицировать > Экземпляр). Можете также воспользоваться командой Window > Panels > Instance (Окно > Панели > Экземпляр) или комбинацией клавиш Ctrl+I (Windows) либо Cmd+I (Macintosh). В результате выполнения любого из перечисленных действий на экране появится панель Instance (Экземпляр). На рис. 1.3 вы можете увидеть образец этой панели, в котором представлены свойства типичной кнопки. Обратите внимание на различия между панелями Instance (Экземпляр), представленными на рис. 1.1 и 1.3.

Рис. 1.3. Панель Instance для экземпляра символа кнопки


Как нетрудно видеть, на рис. 1.3 в раскрывающемся списке Behavior (Модель поведения) выбран пункт Button (Кнопка), а в списке Options (Параметры) — вариант Track as Button (Отслеживать как кнопку). Подобные элементы чрезвычайно важны для сценария ActionScript. Выбор варианта Button в раскрывающемся списке Behavior играет ключевую роль в указании на тот факт, что соответствующий экземпляр действительно будет использоваться в качестве кнопки; Те же параметры устанавливаются и при создании новых символов. Однако учтите, что вне зависимости от того, как первоначально был определен тот или иной символ — Graphic (Графика), Button (Кнопка) или Movie Clip (Клип), — при принятии определенных мер предосторожности конкретный экземпляр этого символа может обладать любой моделью поведения.

Как на рис. 1.1, так и на рис. 1.3 в правом нижнем углу окна находится значок с изображением стрелки — кнопка Edit Actions (Редактировать операции). Щелчок на этом значке позволяет перейти в режим, в котором можно создать новый или отредактировать существующий сценарий ActionScript, связанный с данной кнопкой. На рис. 1.4. представлен типичный (и чрезвычайно простой) сценарий, написанный на языке ActionScript.

Рис. 1.4. К числу свойств экземпляра кнопки относится ее сценарий

Чтобы почувствовать принцип работы механизма свойств кнопки, попробуйте провести следующий эксперимент.

  1. Создайте кнопку, как описано выше. Назовите ее RealButton.
  2. Откройте панель Instance (Экземпляр).
  3. В раскрывающемся списке Behavior (Модель поведения) выберите пункт Graphic (Графика). Экземпляр символа кнопки отныне будет вести себя как экземпляр символа графики. Выделите этот экземпляр графики.
  4. Щелкните на значке Edit Actions (Редактировать операции), чтобы открыть панель Object Actions (Операции объекта), и выберите одну из операций ActionScript. Обратите внимание, что все команды в тексте сценария формируются автоматически, текст не нужно редактировать вручную. Хотя значок в панели Symbol (Символ) по-прежнему указывает, что мы имеем дело с кнопкой, экземпляр этого символа был определен нами как символ графики, а у символов графики нет свойств, которые можно было бы изменять с помощью сценариев. Иными словами, для символов графики нельзя создавать сценарии. Чтобы действия пользователя можно было обрабатывать через механизм событий мыши, модель поведения экземпляра должна быть определена как Movie Clip (Клип) или Button (Кнопка).

Как мы видели, экземпляр символа кнопки вполне может быть преобразован в символ другого типа; обратное также верно. Если вы создадите некий символ графики или клипа, а затем определите для его экземпляра модель поведения кнопки, установив переключатель Button (Кнопка) в группе Behavior (Модель поведения), то станет доступной панель Object Actions (Операции объекта) и у вас появится возможность работать над сценарием. На рис. 1.5 представлен символ с именем Graphic. Меню выбора языковых конструкций в панели Object Actions (Операции объекта) доступно, однако при этом подразумевается, что текущий экземпляр действительно является кнопкой и поддерживает сценарии. Аналогичным способом можно осуществлять подобные преобразования и для символов клипа.

Рис. 1.5. Экземпляр графического символа превращается в кнопку

Изменение модели поведения экземпляра в фильме

В фильмах в формате Flash типы объектов могут меняться. Для тех, кто знаком с технологией Flash, это не новость, однако теперь тип экземпляра произвольного символа можно изменять «на лету» — экземпляры графики способны превращаться в кнопки и клипы. Скажем, используемый в кадре 1 экземпляр графики вполне может быть преобразован в кнопку в кадре 10, а в кадре 40 он может применяться уже как клип. От подобных преобразований в большинстве случаев рекомендуется воздерживаться, но автор считает своим долгом указать на данную возможность, поскольку ее следует иметь в виду при поиске ошибок: можно случайно изменить модель поведения объекта и получить неожиданные результаты.

Свойства кадра

Еще одна «родная» для сценариев область фильма — это кадры (frames). Для ключевых кадров (keyframes), для пустых ключевых кадров (empty keyframes) и даже для самых обычных кадров предусмотрена возможность назначения сценариев. Однако реально используются только сценарии, связанные с ключевыми кадрами и пустыми ключевыми кадрами. Сценариями ActionScript, находящимися в обычных кадрах, «владеют» соответствующие ключевые кадры. Попробуйте выполнить описанную ниже последовательность действий, чтобы познакомиться с взаимоотношениями сценариев и ключевых кадров.

  1. Выполните команду File > New (Файл > Создать) или воспользуйтесь комбинацией клавиш Ctrl+N (Windows) либо Cmd+N (Macintosh). Откроется новая страница; на киноленте окажется единственный слой Layer 1, а ключевым станет первый кадр.
  2. Переименуйте слой Layer 1 в FrameTest (проверка кадра). Лучше с самого начала приобрести полезную привычку давать всем элементам Flash значимые имена. Еще более важно следовать этому принципу в сценариях ActionScript.
  3. Однократным щелчком выделите кадр 40. Выделенные кадры идентифицируются на экране цветом.
  4. Выполните команду Insert > Frame (Вставка > Кадр) или просто нажмите клавишу F5. Вы получите 40 рабочих кадров.
  5. Выделите кадр 20 и выполните команду Modify > Frame (Модифицировать > Кадр). Для этой команды существует клавиатурное соответствие — Ctrl+F (Windows) либо Cmd+F (Macintosh). На экране появится панель Frame (Кадр).
  6. Щелкните на значке Show Actions (Показать операции) в правом нижнем углу рабочей зоны, а затем щелкните на пункте Basic Actions (Основные операции) в списке доступных языковых конструкций открывшейся панели Frame Actions (Операции кадра). Выполните двойной щелчок на строке Stop (Остановить) в списке операций.

Обратите внимание на маленькую букву а, которая присутствует на киноленте над начальным ключевым кадром (рис. 1.6). Она указывает на то, что данный кадр содержит сценарий ActionScript. Но мы ведь ввели сценарий в кадре 20. Теперь нам необходимо довести наш эксперимент до логического завершения. Для этого вам понадобится произвести следующие действия.

  1. Сделайте ключевым кадр 10. Для этого надо щелкнуть на кадре. 10 на киноленте, а затем нажать клавишу F6 или воспользоваться командой Insert > Keyframe (Вставка > Ключевой кадр).
  2. Выделите кадр 20 и выполните команду Modify > Frame (Модифицировать > Кадр). На экране появится панель Frame (Кадр).
  3. Щелкните на кнопке Object Actions (Операции объекта). Сценарий, который отображался в панели Frame Actions (Операции кадра), исчез.

Рис. 1.6. Ввод сценария кадра

В том, что случилось, нет ничего таинственного, но здесь работают механизмы, принцип действия которых важен для понимания возможностей языка ActionScript. Когда пользователь создает сценарий для обычного, неключевого, кадра, этот сценарий назначается ближайшему ключевому кадру, находящемуся слева от текущего. Если назначить сценарий нескольким ключевым кадрам и просмотреть кадры, расположенные между ними, вы обнаружите тот же сценарий в каждом из них. Если вы измените сценарий, находящийся в кадре 5, содержимое ключевого кадра, расположенного слева от этого кадра, также изменится. Сходным образом при изменении сценария ActionScript в любом из обычных кадров, находящихся между двумя ключевыми, будут модифицированы сценарии, назначенные всем обычным кадрам в этом промежутке. В случае модификации сценария ключевого кадра будут изменены все кадры, расположенные справа от него, вплоть до следующего ключевого кадра.

Напрашивается вывод о том, что все кадры, находящиеся между двумя ключевыми кадрами или между ключевым кадром и концом киноленты, автоматически перенимают сценарий ближайшего ключевого кадра, расположенного слева. Несмотря на кажущуюся логичность, подобное заключение ошибочно. Если бы это было так, фильмы Flash были бы совершенно неподходящей средой для сценариев ActionScript. На самом деле все команды, составляющие сценарий, выполняются только ключевыми кадрами. В противном случае команды сценария многократно дублировались бы всеми обычными кадрами. Например, в нашем эксперименте с кадрами в текст сценария была помещена команда Stop, которая автоматически оказалась в ключевом кадре. Допустим, в одном из ключевых кадров вашего фильма вызывается команда остановки Stop. После остановки пользователь щелкает на кнопке Play (Воспроизвести), чтобы продолжить просмотр фильма. Если бы команда Stop присутствовала во всех обычных кадрах до следующего ключевого, пользователю пришлось бы постоянно щелкать на кнопке Play, и просмотр такого «дерганого» фильма был бы чрезвычайно утомительным и затяжным делом. Поэтому, хотя никто не запрещает вводить сценарии в обычных кадрах, лишь ключевые кадры могут запускать сценарии ActionScript.

Метки кадров

Структура полей свойств кадров чрезвычайна проста по сравнению с кнопками. В поле Label (Метка) панели Frame (Кадр) вы имеете возможность задавать метки кадров и комментарии.

Чтобы ввести метку, выделите ключевой кадр и наберите в поле Label (Метка) строку метки. Если вы хотите ввести не метку, а комментарий, предварите строку двумя косыми чертами (//). Метки представляют собой эффективный механизм, позволяющий значительно улучшить качество сценариев Action-Script. При работе над сценариями регулярно возникает необходимость перейти к конкретному кадру и выполнить различные действия. Здесь необходим хороший механизм адресации кадров. Применяя метки, вы значительно облегчаете себе задачу. На рис. 1.7 представлена метка BusStop, в имени которой содержится намек на то, что произойдет, когда пользователь перейдет к соответствующему кадру. В сценарии ActionScript можно использовать команду перехода к метке BusStop, чтобы избежать необходимости долго и мучительно вспоминать конкретный номер нужного кадра. (Кадр 83? Или 82? Или 84? А может, 48?)

Рис. 1.7. Метка кадра

СОВЕТ

О КОМАНДАХ ПЕРЕХОДА И ОБ ОБЪЕКТНО-ОРИЕНТИРОВАННОМ ПРОГРАММИРОВАНИИ.
Если вы программист, то не можете не знать, что применение команд перехода всячески осуждается современной теорией как действия, несовместимые с концепцией структурного программирования, и считается верным признаком дурного стиля. Но здесь мы имеем дело с хорошо организованной системой передачи управления между модулями, где переходы между кадрами соотносятся лишь с кинолентой Flash, но не со структурой программы. В конечном счете все элементы программирования сосредоточены в объектах и определенных позициях киноленты. Когда необходимо отойти от линейной последовательности кадров, заданной кинолентой, переход лучше всего производить с помощью меток. С другой стороны, явно заданная метка — одно из сущностных свойств объекта в языках сценариев.

Комментарии к кадрам

Комментарии призваны помочь лучше видеть на этапе разработки, что происходит в программе. Они никак не влияют на ход ее выполнения. Однако, так же как метки, комментарии определяются в панели Frame (Кадр). Поскольку для ввода комментариев используется то же поле, что и для меток, необходимо удостовериться, что установлена соответствующая модель поведения. На рис. 1.8 представлена кинолента, где в слое BusStop присутствуют как метки, так и комментарии. Комментарии просто напоминают программисту о том, что будет происходить в фильме, пока кинолента переходит к следующему ключевому кадру.

Рис. 1.8. Комментарии и метки ключевых кадров отображаются на киноленте

Создание сценариев ActionScript

Для людей, далеких от программирования, язык ActionScript, пожалуй, следует признать наиболее легким и простым средством создания сценариев. Профессиональных программистов этот язык, как правило, поначалу просто шокирует. Программисты похожи на коров, привыкших к свободному выпасу: им подавай бескрайние просторы текстового файла, где можно написать любую программу, любой сценарий. Сценарии ActionScript от начала и до конца «пишутся» в режиме выбора нужных языковых конструкций с помощью мыши.

Панель операций

Панели Frame Actions (Операции кадра) и Object Actions (Операции объекта) по существу представляют собой одну и ту же контекстно-зависимую панель операций, внешний вид которой меняется в зависимости от того, выделен в настоящий момент кадр или объект. В этой панели имеется поле редактора ActionScript, с помощью которого можно вводить исходный текст сценариев. Чтобы открыть панель Frame Actions или Object Actions, выполните команду Window > Actions (Окно > Операции). Для открытия этой панели можно также использовать комбинацию клавиш Ctrl+Alt+A (Windows) или Cmd+Option+A (Macintosh) либо щелкнуть на соответствующей кнопке в правом нижнем углу панели Instance (Экземпляр). Чтобы список операций был доступен, следует предварительно выделить какой-либо клип, кнопку или кадр. Существует несколько различных способов ввода операций и других элементов сценария ActionScfipt. Вы можете выбрать любой из них.

  • Перетаскивание мышью. Выделите нужный элемент сценария и перетащите его из списка языковых конструкций в окно редактора.
  • Двойной щелчок. Дважды щелкните на соответствующем элементе, и он появится в окне редактора.
  • Меню. Этот способ привычен тем, кто работал со сценариями ActionScript в пакете Flash 4. Щелкните на кнопке +, находящейся в левой части панели операций, и выберите нужный элемент сценария в открывшемся меню.
  • Ручной набор. Возможно, программистам, которые жить не могут без текстового редактора, лучше всего подойдет экспертный режим. Он позволяет вводить исходный текст вручную. Теоретически данный метод можно использовать в качестве единственного, не прибегая ни к каким другим средствам ввода.
  • Комбинация. В экспертном режиме допустимо также применение любой комбинации описанных выше методов. Пакет Flash 5 — это лучший из возможных миров, если речь идет о способах ввода исходного кода.

Обычный режим

Начинающим рекомендуется использовать для ввода сценариев обычный режим, который инициируется выбором команды Normal Mode (Обычный режим) в меню, открывающемся при щелчке на кнопке с направленной вправо стрелкой в правом верхнем углу палитры операций. При работе над сценарием в обычном режиме необходимо явным образом задавать значения параметров для всех элементов языка: операций, функций, команд, свойств и объектов. На рис. 1.9 вы можете видеть список операций Basic Actions (Основные операции), а также средства, помогающие разработчику установить значения всех параметров конкретной операции. Некоторые особенности использования параметров не вполне очевидны. Так, если в команде перехода вы применяете метку, а не номер строки, имя метки необходимо заключить в кавычки. С подобными особыми условиями обычный режим справляется автоматически: если вы выберете в раскрывающемся списке Туре (Тип) в нижней части экрана значение Frame Label (Метка кадра), редактор сценариев сам позаботится о том, чтобы «закавычить» имя метки. Обратите внимание также на изображенную на рисунке кнопку в правом нижнем углу окна. Эта кнопка позволяет скрыть списки, предназначенные для выбора параметров, и обеспечивает возможность переключения между обычным и экспертным режимами.

Рис. 1.9. В обычном режиме редактор сценариев помогает корректно устанавливать значения параметров

В обычном режиме в редакторе сценариев ActionScript присутствует папка Basic Actions (Основные операции), в которой содержится больше половины всех команд, существовавших в пакете Flash 4. Если вы не используете никаких дополнительных операций, у вас есть возможность экспортировать фильм в формат Flash 4. В списке операций находятся еще пять папок. Одна из них — папка Actions (Операции), в которой можно найти значительно более широкий ассортимент языковых средств: в формате Flash 5 предусмотрен целый ряд дополнительных команд, функций, свойств и объектов, с которыми способен работать редактор сценариев ActionScript.

Когда в обычном режиме выбирается объект кнопки или экземпляр клипа, в текст сценария автоматически включается соответствующая конструкция. Так, в примере, приведенном на рис. 1.9, пользователь выбрал в папке Basic Actions (Основные операции) команду перехода, а инструкция on(release) была вставлена редактором автоматически. При работе над большими сценариями эта особенность редактора будет вам скорее мешать, чем помогать, поскольку при вводе каждой новой команды в тексте сценария будет появляться новая инструкция on или onClipEvent. Во многих случаях требуется, чтобы сценарий реагировал на одно событие мыши или клипа целой последовательностью операций, и необходимость вручную удалять многочисленные конструкции вида on(release) ужасно раздражает.

Экспертный режим

Предпочитая экспертный режим, который инициируется выбором команды Expert Mode (Экспертный режим) в меню, открывающемся при щелчке на кнопке с направленной вправо стрелкой в правом верхнем углу палитры операций, вы отказываетесь от «сервиса», предлагаемого редактором сценариев в обычном режиме, поскольку этот сервис иной раз носит излишне навязчивый характер. Вместе с тем даже в экспертном режиме редактор все же оказывает вам некоторое содействие в корректном употреблении различных элементов языка. Скажем, если в экспертном режиме выбрать команду gotoAndPlay, в окне исходного текста появится следующая строка: gotoAndPlay (frame):

Эта «инструкция» дает вам понять, что необходимо ввести определенную информацию о кадре (frame), но здесь нет ни имени метки в кавычках, ни указаний на значения других параметров. К примеру, если вы хотите, чтобы данный кадр воспроизводился в другой сцене (scene), следует указать, в какой именно: gotoAndPlay ("Scene 5". "hit");

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

Обработка событий

Различные возможности, связанные с обработкой событий мыши, подробно рассматриваются в уроке 6, но с некоторыми вариантами, без которых в большинстве случаев не обходятся сценарии, определенные для кнопок, хотелось бы познакомить вас уже сейчас (рис. 1.10). Наряду с событием Release для активизации сценария можно использовать еще шесть событий мыши. Кроме того, если установить флажок Key Press (Нажатие клавиши), у вас появится возможность использовать для запуска сценария различные клавиши. Если установить несколько флажков, будет использоваться несколько разных вариантов запуска сценария, но ничто не может заменить старого доброго события Release, которое происходит, как только пользователь отпускает кнопку мыши.

Рис. 1.10. Изменение параметров вызова сценария

Так же как для кнопок, для клипов могут быть предусмотрены различные условия вызова сценария на основе механизма обработки событий. По умолчанию в конструкции onClipEvent используется событие load, то есть сценарий запускается при загрузке клипа. Однако существует еще несколько событий, связанных с клипами (рис. 1.11).

Рис. 1.11. События для клипов отличаются от событий для кнопок

Обратите внимание на то обстоятельство, что для обозначения событий, связанных с клипами, употребляются идентификаторы mouseDown и mousellp, а не onPress и onRelease. Пока вы не почувствуете, что освоились со всеми подобными нюансами, лучше пользоваться обычным режимом. Впрочем, вы можете вводить наиболее сложные фрагменты кода в обычном режиме и переходить в экспертный режим, когда самая тяжелая часть работы останется позади.

Редактирование выражений

Редактор выражений, который был реализован в пакете Flash 4 как отдельное программное средство, в версии Flash 5 интегрирован в основную часть программы. Многие возможности редактора выражений реализованы в виде автоматических средств, вступающих в действие при перетаскивании языковых конструкций в поле редактора сценариев. Редактировать выражения в этом поле можно как в обычном, так и в экспертном режиме. В обычном режиме редактирование производится средствами, находящимися в нижней части панели операций. Таким образом можно изменить параметры той или иной команды, свойства, функции, операции, объекта. При вставке языковой конструкции ActionScript в текст сценария в вашем распоряжении оказываются все параметры этого элемента. В уроке 2 мы рассмотрим различные типы данных, с которыми вам придется работать в сценариях ActionScript. Именно тип данных определяет набор операций, которые допустимы в выражениях с этими данными.

Клипы и пути в ActionScript

Клипы являются особыми символами: к их свойствам имеют доступ сценарии ActionScript, причем речь идет о доступе как для чтения, так и для записи. Хотя в объектах кнопок также могут содержаться сценарии, последние не имеют возможности изменять эти объекты. Свойства символов графики также не могут изменяться сценариями; более того, у символов графики вообще не может быть сценариев. Кадры способны содержать сценарии ActionScript, однако у кадров нет свойств, значения которых эти сценарии могли бы изменять. Сценарий кадра может лишь осуществить переход к другому кадру или вызвать определенный кадр, находящийся в том же или ином клипе.

Независимые киноленты

У клипа есть собственная кинолента; клип может воспроизводиться даже в ситуации, когда воспроизведение главной киноленты остановлено. Если мы посмотрим на клип как на объект, то увидим, что это небольшой фильм в формате Flash, у которого есть свой жизненный цикл; посредством сценариев клип может сам воздействовать на другие клипы, на главную киноленту, а также на кнопки и кадры, равно как и подвергаться воздействию с их стороны. Язык ActionScript является средством, позволяющим организовать совместную работу различных частей фильма (объектов).

Для корректной работы с объектами различных уровней фильма в языке сценариев должен быть предусмотрен способ адресации объектов, относящихся к разным кинолентам. Путем (path) от одного объекта к другому называется

позиция, или уровень, первого объекта по отношению ко второму. Вы будете рады узнать, что в ActionScript принята система адресации, применяемая в указателях URL, которые используются в Web-страницах и языке JavaScript. В приведенном выше примере с зоопарком можно выделить три объекта с отдельными кинолентами:

  • zoo (зоопарк) — основная кинолента;
  • lion (лев) — клип, находящийся на основной киноленте, но обладающий также собственной кинолентой;
  • teeth (зубы) — клип, существующий внутри киноленты клипа lion, но обладающий также собственной кинолентой.

В пакете Flash 5 применяется двойная система адресации. Старая система, которая использовалась в версии Flash 4, по-прежнему функционирует, и вы вполне можете работать с ней. Чтобы адресовать тот или иной объект, требуется задать его положение, начиная с главной киноленты и последовательно переходя к киноленте объекта teeth через киноленту объекта liоn. Чтобы получить абсолютную ссылку на объект teeth, в соответствии с правилами записи адресов URL мы должны использовать конструкцию вида /lion/teeth. В такой нотации отражается тот факт, что объект teeth является частью объекта lion, который, в свою очередь, является частью объекта zoo. Поскольку объект zoo расположен на главной киноленте, для его обозначения не нужен идентификатор — достаточно косой черты (/). (Автору проще всего представить себе эти отношения в виде многоуровневого меню вида zoo> lion > teeth.)

Чтобы адресовать родительский объект, например 1ion относительно teeth, следует применять комбинацию символов ../, указывающую на направление пути вверх. Таким образом, чтобы адресовать главную киноленту zoo из клипа teeth, вложенного в клип lion, необходимо использовать следующую строку:

Каждая цепочка символов .. / как бы поднимает ссылку на один уровень вверх.

В пакете Flash 5 появилась еще одна система адресации, отличающаяся большей простотой и лучше согласующаяся с духом объектно-ориентированного программирования, о котором мы уже говорили. Корнем любой иерархической структуры в фильме является основная кинолента. В старой системе адресации ее можно было обозначать косой чертой (/). В новой системе главная кинолента всегда обозначается особым идентификатором _root. В нашем примере основной кинолентой является zoo. Чтобы обратиться к ней, мы должны использовать идентификатор _root. Таким образом, для того чтобы указать на объект teeth, следует применить запись вида


Следует также подчеркнуть, что все переменные, методы и свойства рассматриваются как составные части соответствующего объекта. К ссылке на объект можно присоединять имена его элементов. Например, можно предусмотреть в фильме львиный рык, определив в клипе teeth поле sound. Полное имя этого поля будет выглядеть следующим образом:

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

Игра "Трон" на Flash (AS 2.0)

Введение

В данном уроке мы с вами сами с "нуля" создадим игру "Трон" на Flash. Данный урок я реализовывал во Flash CS4 с использованием Action Script 2.0.

Ну я думаю, что если у вас CS3 или CS5, то особых проблем не возникнет.

Создание проекта

Создадим отдельную папочку "tron", в ней мы будем хранить все файлы нашей игры (сам файл игры + файлы классов).

Создадим проект: File New. Flash Project. В выпадающем меню выберем "New Project. ":

  • Project name: tron
  • Root folder:
  • ActionScript version: ActionScript 2.0

Далее создадим основной файл игры: кликаем по пиктограмме "New File" в нижней части окна "PROJECT", имя задаем как "index", тип "Flash File", галочу открытия сразу после создания оставляем активной. Итак, окно "PROJECT" у нас сейчас выглядит так:

Зададим настройки нашему главному файлу. Для этого надо кликнуть мышкой при активном инструменте "Selection Tool" на пустом месте рабочей области и в перейти в панель "Properties":

  • FPS (частота кадров): 24
  • Size (размер сцены): 500 x 500 px.

Небольшое отступление: если я в дальнейшем буду упоминать какую-либо панель или окно и не буду говорить где её найти, то знайте: все панели во Flash находятся в верхнем выпадающем меню "Windows".

Создание объектов

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

  • Игрок 1
  • Игрок 2
  • След игрока 1
  • След игрока 2

Перейдем в библиотеку (окно "Library") и кликнем по пиктограмме "New Symbol. ", имя зададим как "Игрок 1", тип "Movie Clip", кликнем OK, откроется окно создания МувиКлипа. Первый игрок у нас будет синяя мигающая точка, её и создаем:

Выберем инструмент "Oval Tool", нарисуем круг, в панели "Properties" зададим ему настройки:

Теперь сделаем так, чтобы наш круг моргал:

  • Выделим наш круг, вызовем контекстное меню и выберем "Convert to Symbol".
  • Нажмем OK.
  • На панеле "Time Line" встанем в кадр 5 и создадим в нем ключевой кадр-копию (F6).
  • Выделим наш круг, в панели "Properties" в категории "Color Effect" выберем "Alpha" и зададим значение .
  • Кликнем правой кнопкой на кадре 1 и выберем "Copy Frames".
  • Кликнем правой кнопкой на кадре 10 и выберем "Paste Frames".
  • Кликнем правой кнопкой на кадре 1 и выберем "Create Classic Tween".
  • Кликнем правой кнопкой на кадре 5 и выберем "Create Classic Tween".

Панель "Time Line" для МувиКлипа "Игрок 1" у нас выглядит так:

Вернемся к сцене, кликнув по ссылке "Scene 1" (она видна на рисунке выше).

По аналогии сами создайте МувиКлип "Игрок 2", отличие его будет лишь в том, что его цвет будет красным.

Перейдем в библиотеку (окно "Library") и кликнем по пиктограмме "New Symbol. ", имя зададим как "След игрока 1", тип "Movie Clip", кликнем OK, откроется окно создания МувиКлипа. След игрока 1 у нас будет синяя точка, её и создаем:

Выберем инструмент "Rectangle Tool", нарисуем прямоугольник, в панели "Properties" зададим ему настройки:

Вернемся к сцене, кликнув по ссылке "Scene 1".

По аналогии сами создайте МувиКлип "След игрока 2", отличие его будет лишь в том, что его цвет будет красным.

Написание кода

Определим то, что у нас должны "уметь" объекты.

  • Всегда двигаться.
  • Поворачивать по воле пользователя.
  • Оставлять после себя след в виде экземпляра класса след.
  • Реагировать на событие прикосновения к себе кого-нибудь из игроков и заканчивать игру.

Приступим к реализации.

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

Переместим на сцену из библиотеки по одному экземпляру каждого игрока (просто перетищив их мышкой из библиотеки на сцену) и зададим им следующие настрокий в панеле "Properties" (выделяя важдый из них):

  • "Instance Name" для "Игрок 1": igrok1
  • "Instance Name" для "Игрок 2": igrok2

Теперь выделим первый кадр на панели Time Line (собственно и единственный) и нажмем F9, откроется панель "Actions" (для программирования в кадре), здесь мы напишем следующий код:

Закроем панель "Actions".

Теперь выделим игрока 1 и нажмем F9, откроется панель "Actions" (для программирования внути объекта), здесь мы напишем следующий код:

Закроем панель "Actions".

Игрок 2 у нас будет рулить уже не стрелочками, а кнопками W-S-A-D (в обработчике события Key.isDown() следует использовать их ASCII код), также его начальное местоположение немного изменится, поэтому для него код будет выглядеть так (вставьте его в игрока 2):

Закроем панель "Actions".

Поздравляю! Теперь вы можете запустить проект (Ctrl + Enter) и увидеть, что оба игрока уже могут управлять своими "Мотоциклами".

Полезное примечание: когда вы находитесьв панеле "Actions" и уже хотите её закрыть (код написан), не поленитесь нажать кнопку в виде синей галочки "Sheck syntax", она попробует найти ошибки в вашем коде и подскажет как их исправить. При нажатии на эту кнопку, если есть ошибки, то они отображаются в панеле "Compilel Errors".

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

Промежуточный результат: скачать .swf (правой кнопкой "сохранить объект по ссылке как. ")

Оставление следа

Теперь нам надо создать сласс следа для одного из игроков. Откроем окно "Project" (Window Other Panels Project) и создадим новый класс, кликнув по пиктограмме "Create Class". Зададим классу имя "Sled1" и кликнем "Create class".

Перед нами файл, описывающий класс следа для игрока 1. Изменим его следующим образом:

Теперь перейдем в библиотеку, кликнем правой кнопкой по символу "След игрока 1" и выберем "Properties. ". Нам необходимо привязаь след к классу, который мы только что создали:

Далее мы создадим еще один класс, он будет хранить все наши следы игрока 1. Т.е. в нем мы заведем массив, в котором будут храниться наши следы. Также в этом классе мы предусмотрим функцию, которая будет добавлять следы игрока 1. Для этого снова в панели "Project" создадим новый класс, который назовем "MassivSled1". Выглядеть он у нас будет следующим образом:

Теперь в пером кадре добавим несколько строк кода, инициирующих появение класса следов 1:

Нам надо добавлять появление следа после каждого движения игрока 1. Для этого в код игрока 1 добавим следующее:

Весь алгоритм оставления следа мы с вами проработали. По аналогии сами реализуйте оставление следа игроком 2. Примите во внимание, что переменная "i1", созданная для определения идентификатора каждого следа игрока 1, началась с нуля и увеличивается при каждом следе. Поэтому стоит переменную "i2" (для следа игрока 2) создать и сразу приравнять не к нулю, а к 100000, к примеру.

Промежуточный результат: скачать .swf (правой кнопкой "сохранить объект по ссылке как. ")

Ограничение для игроков

Нам нужно ограничить игрока в передвижении. А именно: если игрок двигется вперед, то нам надо запретить ему двигаться назад, даже если он нажал кнопку движения назад. Аналогично со всеми другими сторонами. Зайдем в код игрока 1 (Выделим его и нажмем F9) и немного откорректируем код, создадим небольшие проверки:


Аналогично измените код игрока 2.

Немного интересного (отзеркаливание)

Теперь давайте сделаем так, что если игрок врезается в стенку, то появляется с другой стороны. Для этого в код функции, отвечающей за движение игроков добавим проверку. Также заметим, что теперь нам не надо проверять края экрана для движения объекта, ведь двигаться у нас он будет всегда:

Небольшая оптимизация игры

Сейчас наша игра написана немного неправильно. Если вы поиграете в неё 2-3 минуты, то все начнет тормозить. Происходит это из-за того что у нас обьектов (следов) становится очень много и у каждого есть событие "onClipEvent (enterFrame)" - оно очень сильно загружает процессор. Давайте вынесем его в отдельную функцию и будем её вызывать из самих игроков.

Из класса следа это событие удалим полностью:

Аналогично измените класс следа 2.

В первом кадре создадим функцию, которая будет производить проверку:

Осталось вызвать эту функцию из игроков, передав в неё нужные параметры:

Для игрока 2 пропишите те же самые строки когда, но в качестве второго параметра передайте двойку.

Ну вот, наша игра стала полегче. Однако, все равно, если долго играть, то она будет "виснуть" - слишком уж много объектов на сцене появляется (следов), а здесь уже дело не в процессоре, а в оперативной памяти. Другими словами: чем больше у пользователей свободной оперативной памяти, тем дольше они смогут играть в игру. Ну ладно - наша с вами задача не оптимизировать игры, а пока что, только научиться их делать.

Проигрыш

Давайте сделаем прогирыш. Переменная, отвечающая за проигрыш у нас есть, осталось только везде подставить её проверку, а в случае проигрыша вывести результат игры.

Давайте в кодах игроков зададим эту самую проверку:

Для второго игрока код будет абсолютно идентичным, пропишите его.

Сообщение о проигрыше

Теперь когда какой-либо игрок во что-нибудь врезается, то игра останавливается. Осталось только вывести надпись: кто проиграл. Добавьте на сцену текстовое поле и задайте ему следующие характеристики:

Теперь запишем в него сообщение, если кто-то проиграл. Сделать это можно из любого объекта, но правильней это будет сделать из функции, которая проверяет столкновения (находится она у нас в первом кадре):

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

Итоговый результат: скачать .swf (правой кнопкой "сохранить объект по ссылке как. ")

Заключение

На этом мы остановимся. Игра готова, играть можно, а самое главное, можно играть вдвоем и это куда интереснее. Если вы все поняли, то ,я думаю, для вас не составит труда её доработать. Как? Ну например:

  • Сделать очки для каждого игрока: колчество выйгрышей, а после того, как кто-то проиграл надо нажать "Replay", чтобы играть еще раз.
  • Добавить черную дыру, которая бы появлялась на экране, а если игрок в неё попадает то оказывается в каком-либо другом месте (так сказать телепорт).
  • И т.д.

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

Понравилась или помогла статья? Самое лучшее, что ты можешь сделать - это поделиться ею в любой из своих соцсетей (даже если ты поделишься в твиттере или google+, которыми ты не пользуешься - это очень поможет развитию моего блога). Спасибо! А если ты еще и оставишь любой комментарий снизу в обсуждениях, то это будет двойное СПАСИБО!

Программирование на 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).

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

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

Рис. 2. Код, написанный в редакторе Flash IDE.

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

Рис. 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.

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

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

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

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

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

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

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

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

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

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


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

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

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

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

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

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

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

Мультимедийный скриптовый язык ActionScript

Происхождение ActionScript (скриптового языка Flash MX), стандарт ECMA-262 и его отношение к ActionScript. Сравнение ActionScript, JavaScript, Java и С++, рассматриваемых как алгоритмические языки. Примитивные типы данных как типы "только для чтения". Объектные типы данных. Подробный разбор поведения типа Number. Правила преобразования (конвертации) типов при выполнении операций. Способы получения подсказки по объектам встроенных типов. Операторы, стандартные для С-подобных языков. Специфические операторы, в том числе оператор строгого равенства (неравенства). Как операторы работают со строками. Таблица приоритетов операций. Особенности работы стандартных (для С-подобных языков) управляющих конструкций. Специфичные для Flash MX управляющие конструкции. Включение файлов, директива #include. Стражи включения. Методы отладки во Flash MX.

SWF-файлы исполняются Flash Player-ом. Flash Player существует в виде плагина к веб-браузеру, а также как самостоятельное исполняемое приложение (standalone). Во втором случае возможно создание исполняемых exe-файлов (projector), когда Flash Player включается в swf-файл.

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

Введение во Flash технологии

Flash-технологии, или, как их еще называют, технологии интерактивной веб-анимации, были разработаны компанией Macromedia и объединили в себе множество мощных технологических решений в области мультимедийного представления информации. Ориентация на векторную графику в качестве основного инструмента разработки flash-программ позволила реализовать все базовые элементы мультимедиа: движение, звук и интерактивность объектов. При этом размер получающихся программ минимален и результат их работы не зависит от разрешения экрана у пользователя - а это одни из основных требований, предъявляемых к интернет-проектам.

По сути, Flash Player представляет собой виртуальную машину, на которой выполняется загруженный из Интернета код flash-программы.

В основе анимации во Flash лежит векторный морфинг, то есть плавное «перетекание» одного ключевого кадра в другой. Это позволяет делать сложные мультипликационные сцены, задавая лишь несколько ключевых кадров. Производительность Flash Player при воспроизведении анимации в несколько раз превышает производительность виртуальной машины JavaScript в браузерах, поддерживающих предварительный стандарт HTML5, хотя во много раз уступает приложениям, работающим вообще без использования виртуальных машин.

Flash использует язык программирования ActionScript, основанный на ECMAScript.

1 мая 2008 компания Adobe объявила о начале проекта Open Screen Project (англ.)русск. (Веб-сайт проекта). Цель проекта — создание общего программного интерфейса для персонального компьютера, мобильных устройств и бытовой электроники, что означает одинаковое функционирование одного приложения под всеми перечисленными видами устройств. В рамках проекта:

  • Снимаются ограничения на использование спецификаций SWF и FLV/F4V.
  • Публикуются API для портирования Adobe Flash Player на различные устройства.

В поддержку проекта и распространение платформы Flash на мобильных устройствах на данный момент выступило 58 компаний, среди которых AMD, ARM, Google, HTC, Intel, Motorola, Nokia, NVIDIA, QNX, Sony Ericsson и др.

Flash Player портирован на мобильную платформу Android, выпущены мобильные устройства с аппаратным ускорением flash-приложений (включая AIR-приложения).

Некоторые производители ПО для мобильных устройств пытаются заменить или ограничить распространение Flash на свои новые мобильные платформы:

  • Apple на HTML5 для iPhone, iPod touch и iPad
  • Microsoft на Silverlight для Windows Phone 7
  • Oracle на JavaFX

Во Flash Player реализована возможность мультивещания на прикладном уровне.

В развитии Flash 5 произошел качественный скачок. При переходе от версии Flash 3 к версии Flash 4 ActionScript из небольшого набора операций превратился в популярный язык сценариев. Сегодня, с выходом версии Flash 5, ActionScript явил себя вполне сформировавшимся объектно-ориентированным языком сценариев. Редактор ActionScript по-прежнему поддерживает удобный для начинающих разработчиков режим ввода сценариев с помощью мыши, причем в новой версии при выборе языковых конструкций можно использовать перетаскивание. Можно сказать, что редактор сценариев ActionScript стал еще легче в освоении и удобнее в работе. С другой стороны, опытные программисты получили возможность набирать тексты сценариев вручную, вводя код с клавиатуры, как в любой традиционной среде разработки. Система Flash 5 позволяет разработчику выбрать те средства редактирования, которые ему наиболее удобны.

Flash 5 оставляет впечатление принципиально нового программного пакета. Редактор сценариев ActionScript теперь работает в двух режимах. В обычном режиме при вводе сценариев требуется двойной щелчок на именах операций либо перетаскивание необходимых конструкций и соответствующих параметров в поле редактора с текстом сценария. Если хотите, вы можете работать и «по старинке», щелкнув на кнопке со знаком + (плюс), чтобы открыть динамическое меню языковых конструкций, как это было в пакете Flash 4. Доступ к редактору сценариев осуществляется через кнопку Show Actions (Показать операции) в нижней части окна рабочей зоны. В системе Flash 5 поле редактора сценариев Action-Script является частью панелей Object Actions (Операции объекта) и Frame Actions (Операции кадра); изменилось и представление данных в редакторе. Вместе с тем новый редактор сценариев унаследовал большинство возможностей более ранних версий, и переход к работе с новой версией программы для опытных разработчиков не будет слишком сложным. Кроме того, теперь у вас появилась возможность значительно увеличить размер поля редактора сценариев (путем перетаскивания границы панели операций), что позволяет охватить весь сценарий одним взглядом. Экспертный режим работы редактора сценариев отличается предельной гибкостью. Вы можете набирать текст сценария вручную, как в обычном текстовом редакторе, но при этом вам будут доступны все средства ввода операций, имеющиеся в обычном режиме.

Назначение ActionScript

Однажды некий наивный дизайнер спросил меня: «К чему мне связываться с ActionScript, если я могу сделать все, что захочу, стандартными средствами Flash 5?
На самом деле он пользовался ActionScript, не понимая этого. Даже в простейших операциях перехода, таких как gotoAndPlay, используются команды ActionScript. Применение средств ActionScript в системе Flash 5 — это не один из возможных путей, это единственный возможный путь. Если у вас возникает потребность в использовании какой-то инструкции ActionScript, это значит, что без этой инструкции вам просто не обойтись. Средства ActionScript всегда тесно переплетаются с анимацией Flash, создаваемой без применения возможностей этого языка. Как-то раз в рамках одного из проектов я нарисовал ползунок, который собирался использовать в фильме, созданном без помощи ActionScript. Но выяснилось, что работать с этим ползунком как с элементом управления без соответствующего сценария ActionScript невозможно, и я сдался. Пришлось написать отдельный сценарий, обеспечивающий применение ползунка в качестве элемента управления, и связать его с определенным кадром фильма. Сценарии ActionScript работают в составе стандартного фильма Flash 5, они неотделимы от неге. Средства ActionScript не дублируют и не подменяют собой стандартные возможности Flash.

Наконец, некоторые задачи, допускающие «традиционное» решение с помощью встроенных средств Flash 5, можно решить намного легче и эффективнее, если использовать ActionScript. Скажем, в большинстве фильмов Flash присутствует такая трудоемкая и важная подзадача, как кадрирование — прорисовка промежуточных кадров при трансформации какого-либо объекта. Во многих случаях при этом необходима точная настройка определенных параметров движущегося объекта. Изменить значение переменной, свойства или объекта ActionScript в этом случае намного проще, чем вручную прорисовать все промежуточные кадры. Есть дизайнеры, которые не могут понять, каким образом их коллегам удается реализовать на Flash-сайтах сногсшибательную анимацию, прокрутку текста и великолепный интерактивный пользовательский интерфейс. Все дело здесь в хорошем дизайне и грамотном применении усовершенствованных средств ActionScript. Поскольку клиенты все чаще требуют, чтобы их сайты были «живыми» и симпатичными, а за счет этого — часто посещаемыми и в конечном счете конкурентоспособными, ActionScript играет в Web все более важную роль. Еще одно важное достоинство этого языка — наличие в нем средств обеспечения связи с серверными приложениями. Компании Macromedia удалось создать язык, который, будучи легким в освоении и применении, вместе с тем обладает возможностями, удовлетворяющими всем требованиям дизайнеров, и располагает средствами организации интерактивного интерфейса.

Для кого этот текст?

Этот текст предназначен прежде всего для пользователей системы Flash 5, желающих расширить возможности своих фильмов за счет подключения сценариев ActionScript. Я не рассчитывал на новичков, которые впервые столкнулись с системой Flash. Скорее этот текст будет полезен пользователям версий Flash 3 и Flash 4, желающим перейти к работе с Flash 5 и освоить ActionScript.

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

Кроме того, этот текст рассчитан на программистов, которые хотели бы включить язык ActionScript в свой арсенал. Во всех языках программирования и обработки сценариев есть целый ряд общих элементов, и ActionScript не составляет исключения. Программисты, знакомые с языками программирования, такими как Bade или C++, а также с такими языками сценариев, как JavaScript, с легкостью освоят и смогут применять ActionScript наравне с профессиональными дизайнерами фильмов. Особенно легким этот переход будет для пользователей языка JavaScript, так как обновленная версия ActionScript во многих аспектах совпадает с JavaScript. Впрочем, я убежден, что ActionScript превосходит JavaScript, поскольку у языка ActionScript нет такого разнообразия версий для различных браузеров, как у JavaScript. Вы можете создавать сценарии, которые будут одинаково интерпретироваться как системой Netscape Communicator, так и Microsoft Internet Explorer, В отношении объектно-ориентированной обработки данных ActionScript может дать хорошую фору языку JavaScript. Тем не менее между этими языками есть ряд существенных различий, и разработчик обязан знать, в чем они состоят и каким образом можно использовать сильные стороны ActionScript.

Наконец, этот текст будет полезен пользователям языка ActionScript в версии для пакета Flash 4. В новой версии языка практически удвоилось количество операций, система Flash 5 снабжена совершенно новым пользовательским интерфейсом; изменился механизм адресации, появились новые объекты, массивы, функции, операторы, а также возможность разработки пользовательских функций. Язык ActionScript в версии Flash 5 коренным образом отличается от предыдущей версии. Читателям, относящимся к этой группе, я рекомендую сосредоточиться на вопросах совместимости и усовершенствования средств языка. Как это всегда происходит при глобальных переменах, опытным разработчикам наверняка захочется совместить новые средства, появившиеся в пакете Flash 5, с хорошо знакомыми конструкциями Flash 4. Несмотря на то что человеку свойственно с большей симпатией относиться к тому, что он хорошо знает, я уверен, что вы по достоинству оцените новые возможности ActionScript, появившиеся в пакете Flash 5, и в конечном счете откажетесь в их пользу от устаревших конструкций. Наверняка вскоре у вас появится возможность убедиться в том, что работать над сценариями ActionScript в системе Flash 5 легче, чем в прежних версиях этого пакета. Язык ActionScript стал намного более мощным инструментом создания сценариев.

Практические советы

Если вы никогда не занимались программированием и не создавали сценариев обработки данных, объем информации, которую требуется усвоить, чтобы научиться работать с языком ActionScript, может подействовать на вас угнетающе. Однако нет никаких причин, чтобы пытаться выучить все средства Action-Script единым махом, особенно если ActionScript — первый язык программирования, который вы хотите изучить. Передозировка знаний опасна. Попробуйте разобраться в образцах сценариев и лишь затем попытайтесь слегка модифицировать их, а главное, старайтесь получать удовольствие от новых знаний. Уделяйте особое внимание таким деталям, как имена экземпляров клипов и имена переменных, связанных с текстовыми полями; не употребляйте в качестве имен переменных зарезервированные слова. Чтобы написать сценарий ActionScript, не нужно иметь диплом математика. Значительно важнее, чтобы вы не пытались забежать вперед, а продвигались в изучении ActionScript шаг за шагом. В отличие от других языков программирования и обработки сценариев большая часть кода на языке ActionScript содержится в коротких, несложных сценариях. Этот язык является модульным по своей сути, поскольку сценарии Action-Script привязаны к определенным кнопкам, кадрам и клипам.

Не нужно смотреть ни на язык ActionScript, ни на эту книгу как на заоблачную вершину, которую предстоит покорить, не имея соответствующего снаряжения. Это лишь своего рода путеводитель; представленные в нем «достопримечательности», безусловно, стоит посетить, но вы не обязаны это делать.

Способ подачи материала

Этот текст написан обычным, человеческим языком. Материал изложен отнюдь не в строгом соответствии с жесткими рамками компьютерной и научной терминологии; я намеренно старался избегать языка технической документации. Этот текст — беседа с читателем о том, как работать с языком ActionScript. В начале книги вы познакомитесь с основными понятиями и принципами написания сценариев. Эти фундаментальные понятия станут отправной точкой для дальнейшего изучения языка ActionScript. По ходу появления в тексте новых конструкций я буду стараться иллюстрировать их понятными объяснениями и примерами. Не сомневаюсь, что не пройдет и десяти минут после того, как вы приступите к чтению этой книги, и вам уже захочется создать свой собственный фильм, чтобы применить новые знания на практике. Поэтому, прежде чем открыть первую главу, включите компьютер, загрузите Flash 5 и приготовьтесь к практическому изучению языка ActionScript.

Почти в каждом уроке (не считая начальных) вы найдете учебные задачи и проекты, представляющие собой небольшие примеры фильмов с несложными сценариями. На этих примерах я попытаюсь показать, как нужно писать различные сценарии ActionScript, и продемонстрирую работу с различными видами данных и параметрами. Некоторые из этих проектов носят чисто учебный характер и преследуют только одну цель — показать действие тех или иных механизмов. Другие проекты могут использоваться как вполне реальные прикладные программы. Большинство приложений в этой книге не содержит ничего сложного. К числу таких элементарных задач относится, скажем, получение входных данных через текстовое поле и изменение внутреннего представления информации, подлежащей пересылке в базу данных на сервере. Однако в настоящей книге вы найдете и ряд более сложных проектов, например образец фильма, где строится гистограмма входных данных. Каждый учебный проект преследует цель оказать читателю помощь в освоении определенных языковых средств ActionScript.

Примеры фильмов, о которых идет речь в учебных проектах, вы можете найти на прилагаемом к настоящей книге компакт-диске. Если вы не хотите шаг за шагом выполнять все присутствующие в книге инструкции и не желаете создавать учебные фильмы «с нуля», у вас есть возможность просто открыть соответствующий файл с расширением .FLA на компакт-диске и «разобрать» его на составные части. Однако, набирая тексты сценариев самостоятельно, вы наверняка столкнетесь на собственном опыте с наиболее типичными ошибками. При налинии в набранном вручную тексте каких-то опечаток сценарий не будет работать должным образом. Возможно, иной раз это будет вас расстраивать, но именно такой подход позволит максимально эффективно усвоить информацию, касающуюся создания сценариев. Кроме того, вы сэкономите время, если будете учиться находить собственные ошибки, точно зная, где их искать. Может быть, вам придется по душе промежуточный вариант, при котором вы будете загружать соответствующий FLA-файл в качестве библиотеки, а затем вводить сценарии вручную. Это позволит вам избежать необходимости рисовать графические элементы. Вы вольны выбрать тот способ работы с примерами, который вам покажется наиболее эффективным.

В настоящем тексте используются обозначения, принятые в документации к продуктам компании Macromedia. Исключение составляет лишь символ > , который будет использоваться в качестве разделителя команд меню и подменю. К примеру, запись Modify > Instance (Модифицировать > Экземпляр) означает, что вы должны сначала щелкнуть на пункте Modify в строке меню, а затем выбрать пункт Instance в открывшемся на экране списке команд. Клавиатурные соответствия основных команд меню я даю в двух вариантах: для платформы Windows PC и для Macintosh. Для клавиши Control на платформе Windows PC я использую сокращение Ctrl; сокращение Cmd соответствует клавише Command на Macintosh. На клавиатуре Macintosh есть клавиша Control, но чаще всего она используется в комбинации с единственной кнопкой мыши в качестве аналога правой кнопки на платформе Windows PC. Обозначение Alt применяется к клавиатуре Windows PC, а обозначение Option — к клавиатуре Macintosh.

На всем протяжении текста слои перечисляются в порядке, соответствующем их представлению в фильме, но иногда при их описании используется другая последовательность. В частности, слой Background (Фон), который всегда находится в конце списка слоев, во многих случаях является первым по времени создания. Я стараюсь рассматривать слои в том порядке, в котором они создаются.

В системе Flash 5 вы можете определять собственные клавиатурные соответствия для различных команд. Поскольку заранее нельзя предсказать, какую именно комбинацию клавиш пользователь захочет определить для той или иной команды, все операции и иные элементы сценария представлены в листингах так же, как они отображаются в поле редактора сценариев. Каким образом они туда попадут — ваше личное дело.

Недостатки Flash-технологии

Основной недостаток flash-приложений — чрезмерная нагрузка на центральный процессор, связанная с неэффективностью виртуальной машины Flash Player. Хотя следует отметить, что в некоторых случаях имеет место и недостаточная оптимизация flash-приложений их разработчиками, использование так называемых «генераторов» flash-приложений.

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

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

Четвёртый важный недостаток заключается в том, что использование Flash для размещения текстовой информации затрудняет её индексирование поисковыми системами. И хотя в принципе определённая система индексирования текста внутри swf-файлов была создана и внедрена Google и Yahoo! ещё в 2008 году, но доля сайтов, целиком созданных на Flash, остаётся небольшой.

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

Как редактор, Adobe Flash CS5 не может конвертировать созданные в нём векторные изображения в форматы другого типа: .ai или .cdr, что было бы крайне полезным.

Закрытость

Спецификация SWF версии 4 была открыта, но описания последующих версий продавались только с подпиской о неразглашении, и их было запрещено использовать для создания проигрывателей Flash.

В мае 2008 года Adobe Systems объявила об открытии спецификаций SWF и видео контейнера FLV для использования на значительно более мягких условиях, как часть проекта «Open Screen Project», ориентированного на создание общей среды Flash на всех устройствах.

Рэй Вальдес (Ray Valdes) из Gartner, Inc. (англ.)русск. считает одной из причин открытия спецификаций конкуренцию со стороны Silverlight, однако представитель Adobe Дэйв МакАллистер (Dave McAllister) заявил, что это не так.

Однако запатентованные кодеки, используемые в FLV, принадлежат не Adobe, а скачанную спецификацию, в которой нет, например, описания протокола RTMP (20 января 2009 Adobe объявила, что опубликует его в первой половине 2009), нельзя распространять и переводить. Flash Player остаётся проприетарным, хотя Adobe обещала сделать использование его на мобильных платформах бесплатным. Осенью 2011 года, компания Adobe заявила о прекращении поддержки мобильных платформ.

Разработчик свободного декодера Swfdec Бенджамин Отте (Benjamin Otte) написал, что в открытой спецификации нет ничего, чего бы ещё не было известно благодаря обратной разработке, хотя официальная спецификация может быть понятнее для новичков и полезна при возникновении вопросов о легальности библиотеки. О том же говорят и разработчики Gnash. Они также считают возможной причиной этого частичного открытия спецификаций успехи свободных декодеров SWF и конкурирующего проприетарного формата Silverlight.

В феврале 2009 компания Adobe в рамках проекта Open Screen Project опубликовала информацию о снятии ограничений на использование форматов SWF и FLV/F4V, а также протоколов AMF и Mobile Content Delivery Protocol.

Уязвимости

В реализациях Adobe Flash время от времени находят «дыры», позволяющие злоумышленникам производить разнообразные действия с системой. Так, например, в октябре 2008 года была найдена уязвимость, позволяющая удалённо контролировать веб-камеру и микрофон.

Альтернативы

Прямым конкурентом Flash является технология Silverlight от Microsoft. Технология Java-апплетов также является альтернативой Flash в веб-приложениях, но значительно уступает в надёжности и простоте создания графики и анимации.

В браузерах отдельные части Flash могут быть заменены посредством HTML5, JavaScript (и AJAX), SVG.


Структура SWF-файла

Когда мы говорим Flash, то можем подразумевать совершенно разные вещи даже в рамках терминов web-технологии. Чтобы не было путаницы, будем использовать:

  • Flash – технология web-анимации в целом;
  • Flash player – программа, библиотека ActiveX которая выполняет отображение flash;
  • Standalone Flash player – приложение (exe-файл), отображающее flash;
  • Flash IDE, Adobe Flash, Flash Professional – среда разработки, предоставляемая фирмой Adobe (ранее Macromedia);
  • FLA – проектный файл (исходный) анимации для Flash IDE;
  • Movie, мувик – цельная сущность web-анимации на этапе разработки;
  • SWF – непосредственно конечный файл анимации.

И так, когда мы открываем web-страницу, на которой находится flash анимация, в упрощенном варианте происходит следующее: интернет-браузер в html разметке обнаруживает вставку flash-анимации, создает объект flash-плеера и указывает ему какой файл нужно отобразить. Flash-плеер выполняет загрузку swf, и, если это возможно, начинает его отображать. Благодаря такому принципу работы flash-плеер может отображать так называемые прелоадеры (preloaders), воспроизводить потоковый звук и видео (как, например, YouTube) без полной загрузки самого swf.

Для уменьшения размера файла Macromedia применила два подхода.

Первый заключается в том, что для сохранения чисел используется побитовая упаковка. Выглядит это примерно так. Допустим, нам нужно сохранить размер прямоугольника, т.е. четыре числа типа integer. При простой записи это будет 4 * 4 байта = 16 байт. При записи в swf в первые 5 бит записывается число бит, необходимое для кодирования самого большого значения, а затем эти 4 значения в битовом представлении с указанной длиной бит. Например, нужно сохранить координаты (0, 0 — 100, 100) в переводе на твипсы (0, 0 — 2000, 2000). В битовом представлении число 2000 = 11111010000 (11 бит + 1 для знака). Выходит (5 + 4 * 12) / 8 = 7 байт, что меньше почти в двое.

Такой подход приводит к тому, что некоторые одинаковые тэги могут иметь разный размер. Это также относится и к Header.

Второй подход — это использование ZLib компрессии как в целом для всего swf, так и для отдельных тэгов.

Когда файл компрессированный, то первые три параметра Header-а (это 8 байт) не упакованы, а остальные упакованы и это объясняет, почему нельзя одним методом Read считать только заголовок swf.

Flash & ActionScript: с чего начать?

Для начала нужно сказать, что начиная с AS3, у flash замечательная бесплатная справочная база, лучшая из тех, с которыми я знаком. Поэтому начать нужно с нее. Первое, к чему вам стоит обратиться, даже если вы вообще ничего знаете — это книга (доступна и на русском) «ПРОГРАММИРОВАНИЕ НА ACTIONscript 3.0» (http://bit.ly/9oRs6H). Прочитав её, вы уже сможете писать полноцнные приложения.

Далее нужно определиться со средством разработки. Если вы аниматор, то удобнее адобовских Flash CS, пожалуй, ничего нет. Но, если вы программист, то здесь доступен целый парк платных и бесплатных средств. Это и Powerflasher FDT (платный), и Realaxy Actionscript Editor от отечтвенных разработчиков и бесплатный SEPHY. Но мой фаворит — FlashDevelop, бесплатный редактор основанный на Eclipse, надежный, легкий, быстрый и продумынный до мелочей, вобщем must see.

И я бы не советовал начинать изучение с Flex — это как есть пельмени руками. Вроде удобно, но постоянно будут возникать неудобства. Не говоря уже о том, что Flex — это средство разработки приложений с юзер-интерфесом, его код переводится в as3 и потом компилируется.

Flash - Flash + ActionScript

Главная » ActionScript 3.0: Введение в основы ООП

ActionScript 3.0: Введение в основы ООП

Объектно-ориентированное программирование — немного горячая тема. Все больше и больше языков программирования начинают поддерживать эту технологию (Ruby, например), и все больше и больше языков, которые ранее не поддерживали ООП выходят с версиями, которые имеют поддержку ООП, например PHP и ActionScript. Некоторые языки работают только если вы используете все особенности ООП, например, Java или Objective-C.

Это продолжалось в течение долгого времени, но пришло в центр внимания в начале 1990-ых из-за преимущества ООП при программировании GUI (графического интерфейса пользователя) и с ростом языков C++ и Objective-C. В Wikipedia есть интересные статьи об истории ООП, которые могут быть прекрасным источником для начала изучения данной технологии.

Введение

Если вы новичок в ООП, то вам предстоит многому научиться. Тем не менее, изучение этой технологии может уменьшить время на разработку, и в тоже время уменьшить количество ошибок в коде. Это приучит вас к организованности и предотвратит ненужные дублирования в коде. Но, пожалуй, более привлекательны, чем те высокие обещания — это факт того, что Adobe безусловно делает ставку на концепцию ООП, когда дело доходит до ActionScript. ActionScript 1 не был объектно-ориентированным языком вообще, а AS2 был только объектно-ориентированным для удобства разработчика. В противоположность этому, AS3 полностью поддерживает объектно-ориентированные особенности, во всяком случае, будет поддерживать все больше в последующие годы. Так что, если вам нравится программировать в Flash и вы не хотите остаться позади, то вам настоятельно рекомендуется принять ООП как способ программирования.

В этом уроке мы постепенно ознакомимся с некоторыми основными концепциями, касающимися Объектно-Ориентированного Программирования. Итоговый продукт, сделанный в Flash будет немного тусклым, но это только Часть 1. Вы увидите некоторые практические изыскания техник ООП, даже если данный урок не о построении конкретного проекта.

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

Главный вопрос

Так что же такое объектно-ориентированное программирование?

Во-первых, позвольте объяснить, что не так. Объектно-ориентированное программирование (ООП) это не только или даже не обязательно лучший способ программирования в ActionScript 3. Кажется, существует миф о том, что с того времени, как ActionScript 3 дебютировал эту технологию, чтобы использовать AS3, вы должны использовать и ООП.

Хотя и правда, что AS3 больше подходит для ООП, чем AS2, и то, что вам предлагается двигаться в этом направлении, но не правда то, что вы должны изучать, как описывать классы и инициализировать объекты, чтобы построить реальное приложение в Flash. Вы могли заметить во многих уроках по ActionScript 3, что довольно часто код ActionScript 3 написан в панели скриптов, а не в файле класса. Это должно помочь проиллюстрировать то, что вполне приемлемо не использовать ООП во время работы в Flash.

Как говорится, ActionScript 3 действительно показывает класс, если начать применять ООП. И не только AS3, но и любой язык, который поддерживает ООП, может быть использован более эффективно, когда применяется технология ООП. На самом деле, это просто потому, что ООП всего лишь технология — большая, сложная с множеством вариантов для рассмотрения, но по-прежнему, всего лишь технология — а не панацея. И это великолепная технология, одна из тех, с которой стоит начать освоение. И вот почему вы здесь, не так ли?

Классы и объекты

Объектно-ориентированное программирование в действительности сводится к двум фундаментальным единицам: классы и объекты. Они неразрывно связаны: класс порождает объект.

Думайте о классе, как о проекте дома, а об объекте, как о фактическом доме. Проект — это больше схема для понимания того, каким будет дом, а не реальный дом, который будет построен (так как в ходе строительства могут быть добавления и изменения). Когда вы описываете объектно-ориентированный код, вы описываете шаблон, т.е. классы. Затем ваш код создает объекты на основе этих классов во время работы программы.

Проект также может быть повторно использован для создания более чем одного дома. В некоторых жилых комплексах вы можете увидеть это в действии, система экономии на затратах — архитектору платят за один проект, на базе которого потом строится несколько домов. Эти дома все уникальны, и то, что происходит в одном доме изолированно от того, что происходит в другом. Тем не менее, у них есть общие особенности, такие как расположение сантехники и электрической системы, или то, где расположены лестницы. У всех домов могут быть передние двери в одном и том же месте, но в одном из домов может быть металлическая дверь, окрашенная в какой-либо цвет, а у другого дома может быть деревянная дверь с дверным молотком.

Класс, точно также, может создавать более, чем один объект. Эти объекты будут одного типа, но каждый из них будет уникален, как в примере с домами. Опять же, они будут иметь много общего, но каждый будет поддерживать свои уникальные характеристики. Объект, который загружает данный из внешнего источника должен иметь, в качестве общей особенности, способность загружать данные и отправлять полное событие, когда будет готов. Тем не менее, один экземпляр такого загрузчика будет иметь уникальную характеристику, и будет загружать данные из одного URL, в то время как другой экземпляр будет загружать данные из другого URL.

Термин «экземпляр» — это слово, которое описывает объект. Когда объект создается на основе класса, то должен быть инициализирован и таким образом создается экземпляр класса. Слово «объект» , как правило, ассоциируется со словом «экземпляр».

Если вся эта терминология беспокоит вас, вспомните о взаимоотношении библиотеки символов и экземпляров, которое было в Flash 1. Символ — это один элемент в библиотеке. Экземпляр — конкретное проявление этого символа. Может быть больше одного экземпляра данного символа, и изменения в графике одного символа приведет к изменению всего экземпляра данного символа. Тем не менее, каждый индивидуальный экземпляр может поддерживать некоторые уникальные свойства, такие как позиция, вращение, трансформация цвета, фильтры, и масштаб. Это прямой аналог класса и объектов (экземпляров). На самом деле, это больше, чем просто аналогия, как будет показано в следующей части этого урока.

Встречайте класс Document

Ну, продолжим изучение? Я думаю, что лучший способ начать знакомство в ООП с класса документа (Document Class). Этот класс такой же, как и любой другой в AS3, кроме того, что он имеет очень важное отношение с файлом Flash. Это класс, который представляет SWF, который вы публикуете. Класс Document инициализируется при запуске SWF-приложения. Он аналогичен понятию «основной» функции (main function), если у вас есть опыт работы в C, или «основному» методу (main method) основного класса в Java.

Создаем папку проекта

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

Теперь создайте Flash-файл (ActionScript 3.0) и сохраните его в эту папку. Название не так важно, но я назвал файл «MeetTheDocumentClass.fla» .

Текстовый файл класса Document

Теперь вам нужно создать текстовый файл. Вы можете использовать Flash CS3+ для этого, или Flex/Flash Builder, или любой другой подходящий текстовый редактор, на самом деле. FlashDevelop — прекрасный (и бесплатный) выбор, если работаете в Windows. Есть много других вариантов текстовых редакторов, и нет правильных ответов (хотя, как я говорю своим ученикам, есть один неправильный ответ. Текстовый редактор, встроенный в Flash CS3/4 на самом деле немного ужасный, и чем раньше вы это поймете, тем раньше начнете наслаждаться программирование в настоящем редакторе). Лично я предпочитаю TextMate, но не забываю, что главное это текст в файле, а не только редактор.

Все, что было сказано, это создать новый файл в редакторе, который вы выбрали (если вы используете Flash CS3+ , то перейдите в меню File -> New и выберите «ActionScript file» из списка. Если такого нет, то предполагаю, что вы достаточно знакомы со своим редактором с тем, чтобы сделать это без наставлений и подсказок).

Сохраните файл как «DocumentClass.as» в той же папке, где находится Flash-файл. Это важно: расположение и имя очень важны. Имя не обязательно должно быть «DocumentClass.as» , но я буду использовать его, чтобы предотвратить путаницу, и рекомендую вам просто сделать то же, что и я. Имя может быть любым, какое вы хотите (более или менее), но мое мнение в том, что имя играет важную роль в AS3 ООП, поэтому будьте внимательны. То же самое касается расположения файла, технически оно может быть где угодно, но для удобства просто следуйте моему примеру. Другие варианты будут рассмотрены в других уроках.

Подводя итог, вот моя папка проекта в том виде, как она выглядит сейчас:

Описываем класс Document

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

[code language=»actionscript3″]
package <
import flash.display.MovieClip;
public class DocumentClass extends MovieClip <
public function DocumentClass() <

Ничего себе, и что все это такое? Ну, немного больше, чем нужно объяснить прямо сейчас. Я просто отмечу несколько интересных мест.

Во-первых, обратите внимание, что « package » оборачивает всю страницу. Не беспокойтесь об этом, просто помните, что это нужно здесь, и класс должен содержаться в нем.

Во-вторых, у нас есть оператор « import » . Вы, должно быть, не видели раньше такую строчку кода; если вы застряли и программируете в панели Script, до сих пор так и не пользуясь сторонними библиотеками ActionScropt, то вам не нужно было писать оператор «import». В мире ООП, каждый класс должен импортировать различные классы, которые нужны для того, чтобы делать свое дело. Подробнее об импорте поговорим позже.

В-третьих, следующая «обертка» — это сам класс. Вы можете видеть ключевое слово « class » в третьей строчке. Структура этой строчки больше чем нам нужно сейчас, просто обратите внимание, что слово, следующее за словом «class» — это имя класса. Вы должно быть заметили, что имя, которое я использовал точно такое же, что и имя файла без расширения. Это не совпадение. Для работы с классами в AS3, имя класса должно совпадать с именем файла. Не забывайте об этом.

Мы вернемся к строчке «extends MovieClip» в следующем уроке. А сейчас, просто знайте, что это нужно для класса документа (вы также можете расширять класс Sprite, например, так « extends Sprite » , если вам не нужна временная шкала, и если вы измените строчку импорта на « import flash.display.Sprite; «)

И наконец, у нас есть конструктор.

Конструктор (Constructor)

В предыдущем примере была (почти) обычная функция, определяемая внутри класса. Почти обычная, за исключением слова «public» впереди, и без определенного типа данных. Опять же, не беспокойтесь о слове «public» сейчас, все придет со временем. Тем не менее, обратите внимание на имя функции. Вот именно, оно такое же что и имя файла, и имя класса. К счастью, вы не совсем параноик, потому что это не заговор. Это просто способ, при котором все работает. Называя функцию одинаковый именем, что и класс, мы создаем специальную функцию под названием конструктор (constructor). Конструктор выполняется во время инициализации. Надеюсь, что вы успеваете с новой терминологией, потому что мы просто использовали два новых определения в одном предложении.

Объект сможет иметь и другие функции, которые вы можете определить, но конструктор — это единственная функция, которая вызывается автоматически во время инициализации. Поэтому конструктор это то место, где вы захотели бы разместить код, который будет выполнен, чтобы подготовить объект к первоначальному использованию. Например, если вы описываете класс для объекта, чья работа загружать некоторый XML, делать грамматически разбор, затем загружать изображения-миниатюры на основе данных, то вы можете создать URLLoader , установить его обработчик события, и возможно, даже начать загрузку, все сразу при создании объекта. Такая логика может быть затем перемещена в конструктор.

Hello, World! (Привет, Мир!)

В качестве практического примера напишем небольшую программу «Hello World» . Мы будем не просто выводить слова в панели Output, но еще создадим TextField (текстовое поле), добавим его на сцену, и поместим некоторый текст в него. Раскройте файл DocumentClass.as как показано ниже (изменения выделены полужирным шрифтом):

[code language=»actionscript3″ highlight=»3,6,7,8″]
package <
import flash.display. MovieClip;
import flash.text.TextField;
public class DocumentClass extends MovieClip <
public function DocumentClass() <
var tf:TextField = new TextField();
addChild(tf);
tf.text = "Hello World";
>
>
>
[/code]

Обратите внимание, что в дополнение к трем строчкам, добавленным в конструктор, теперь есть дополнительная строчка import перед объявлением TextField.

Очевидно, что можно было бы сделать это позже, позиционировать и задать стиль текста, и вы всегда можете сделать это на свое усмотрение, но сейчас это служит в качестве примера. Данный код создает текстовое поле со словами «Hello Word» в нем, и отображает на сцене. За исключением одного: Flash-файл не знает, что его цель класс документа. Если вы попытаетесь запустить Flash-файл сейчас, то получите пустое окно. Давайте исправим это далее.

Назначение класса Document

Как уже упоминалось ранее, Flash-файл ( MeetTheDocumentClass.fla в данном случае) еще не знает, что у него есть определенный класс документа, а только старый чистый MovieClip , так что он не собирается делать большего.


Хорошо, что нам это известно, но то, что мы действительно хотим прямо сейчас — это позволить Flash-файлу знать, где находится файл DocumentClass.as , который мы только что написали. Чтобы сделать это, сначала убедитесь, что ничего не выбрано (вы можете нажать мышью в любом месте на сцене, где нет визуальных объектов, или выбрать в меню Edit > Deselect All, или нажать Control-Shift-A).

Далее, откройте панель свойств (Properties). Если вы успешно сняли выделение со всех объектов, то панель свойств отобразит «Document» наверху.

Теперь, там, где написано «Class:» в разделе «Publish» панели «Properties» , введите « DocumentClass » (или любое другое имя, которое используете для своей версии класса, если настаиваете на своем сформированном пути к файлу). Обратите внимание, что имя должно быть без расширения «.as» — это просто имя класса, а не имя файла.

Если вы следовали указаниям до сих пор, то нажмите Enter и все будет в порядке. Если почему-то имя класса неправильное, или вы не сохранили файлы в той же папке, то вы не получите сообщение об ошибке при публикации. Вы получите такое сообщение об ошибке при вводе текста в поле имени класса:

Если вы проигнорировали сообщение, или не увидели его, потому что ранее отметили пункт «Don’t show again» (не показывать снова), то затем SWF-файл будет опубликован без ошибок, но вы получите чистый белый экран. Если это происходит, то дважды щелкните по имени класса, которое вводили в панели «Properties» .

Как только свойство «class» документа будет правильно подключено, вы сможете убедиться в этом, щелкнув мышью на маленький значок карандаша рядом с текстовым полем «document class» в панели свойств. Будет открыт файл в Flash CS3+ для редактирования. Не то, чтобы я рекомендовал держать его там, но проверить, что вы подключили правильный файл, будет полезным советом во избежание возникновения неисправностей.

После того, как вы все проверите, направляйтесь и проверьте Flash-приложение (нажмите ctrl + enter). Вы должны будете увидеть простое окно со словами «Hello World » в нем.

Свойства

Начиная с этого момента, вы устанавливаете логику приложения в классе документа и начинаете создавать более интересный SWF. Тем не менее, вам, вероятно, понадобится больше, чем одна функция конструктора, чтобы это сделать. Как правило, нужно создавать другие объекты, привязывать их к переменным, использовать функции для прослушивания событий и чтобы эти элементы взаимодействовали в значительной степени. Конечно, в ООП есть такие элементы, как переменные и функции, они отличаются различными названиями: свойства и методы (мы займемся методами в следующей главе).

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

Во-первых, свойство записывается также в переменную, с двумя оговорками. Вот пример:

[code language=»actionscript3″]
private var tf:TextField;
[/code]

Первый нюанс должен быть очевиден: есть большой старый «private» перед ключевым словом « var » . Атрибут « private » похож на « public » , о котором мы говорили ранее, и который я просил игнорировать. Я попрошу сделать это и сейчас. Мы не поймем эти атрибуты, пока не перейдем к следующему уроку.

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

[code language=»actionscript3″]
public class DocumentClass extends MovieClip <
private var tf:TextField;
public function DocumentClass() <
// …
>
>
[/code]

Обратите внимание на позицию свойства по отношению к структуре класса. Функция конструктора и свойства находятся на одном «уровне» и «принадлежат» напрямую классу (они вложены в класс соответственно). Такая характеристика делает из переменной свойство (несмотря на то, что объявлена при помощи ключевого слова « var «).

В противоположность этому, переменная с именем « foo » в примере ниже обычная переменная:

[code language=»actionscript3″]
public class DocumentClass extends MovieClip <
private var tf:TextField;
public function DocumentClass() <
var foo:String = "bar";
>
>
[/code]

Почему? Потому что эта переменная «принадлежит» функции, а не классу. Когда объявляются переменная или функция внутри фигурных скобок (которые технически применяются каждый раз), то она существует лишь до тех пор, пока находится в их пределах. Поэтому такое тонкое различие — свойство « tf » существует, пока имеется объект « DocumentClass » , и пока он «принадлежит» объекту « DocumentClass » , а переменная « foo » существует пока работает функция, содержащая его, и исчезает, как только эта функция заканчивает выполнение кода.

Конечно же есть исключения для правила «фигурных скобок» . Циклы, например, не влияют на видимость переменной, объявленной внутри, поэтому относитесь к этому правилу скептически. Вы не найдете этого правила в книгах по программированию.

Вы, должно быть, задаетесь вопросом,

«Но постойте, разве функция не существует внутри объекта на том же уровне, что и свойство? Разве она не существует так же постоянно, как и свойство, и, следовательно, переменная внутри этой функции так же не должна будет исчезать?»

У вас есть точка зрения, тем не менее, что различие в том, что функция, которая может быть потенциально вызвана, существует внутри объекта, в то время как фактическая работающая функция существует только на момент вызова. Переменная создается во время запуска, и, следовательно, исчезает, как только работа функции заканчивается. Как я и говорил, различия едва различимы. Но они важны, в чем вы убедитесь далее.

Методы

Для начала, мне нужно применить то, что мы только что изучили, к функциям и методам. В основном, методы — это простые функции, которые принадлежат объекту, например, функция конструктора, если только они не возведены в любой другой статус. Вот так добавляется еще один метод:

[code language=»actionscript3″]
public class DocumentClass extends MovieClip <
public function DocumentClass() <
// …
>
public function onButtonClick(e:MouseEvent):void <
trace("click");
>
>
[/code]

Теперь функция onButtonClick() стала довольно знакомой, за исключением надоедливой директивы public в начале. И опять, не будем обращать на нее внимания. В данном случае, вам следует воспринимать эту запись как обычную функцию. Разница лишь в том, что тоже самое понятие «владение» применяется к методам, как и к свойствам, по сравнению с обычными переменными и функциями.

И наконец, давайте рассмотрим все это на рабочем примере.

[code language=»actionscript3″ highlight=»4,8,11,12,13,14,15,18,19,20″]
package <
import flash.display. MovieClip;
import flash.text.TextField;
import flash.events.MouseEvent;

public class DocumentClass extends MovieClip <

private var tf:TextField;

public function DocumentClass() <
tf = new TextField();
addChild(tf);
tf.text = "Hello World";

private function onButtonClick(e:MouseEvent):void <
tf.text = "Hey, you clicked!";
>

Обратите внимание на изменения и дополнения: мы добавили свойство « tf » . В конструкторе, мы также создаем текстовое поле TextField , но вместо создания переменной в конструкторе, как мы делали раньше, мы просто используем свойство « tf » . Текстовое поле TextField теперь сохраняется в свойстве, а не в переменной.

Мы также добавили прослушиватель события на нажатие кнопки мыши на сцене (нет, сцена на самом деле не кнопка, но в данном случае это сэкономит время в плане создания объекта MovieClip для поведения в качестве кнопки). И этот прослушиватель — метод с именем « onButtonClick() » , кроме того применяется метод вместо функции, что идентично для любого другого обработчика событий.

Что же делает этот метод таким значительным: он заменяет текст в текстовом поле на другую строчку. Это может произойти, только если « tf » сохраняет значение по прошествии времени. Если приложение работало, то мы знаем, что « tf » все еще ссылается на TextField , созданный в конструкторе, хотя вероятно прошло несколько секунд между созданием TextField и его повторным переназначением.

Изучение видимости

Теперь, если вы уберете свойство и вернете создание переменной TextField , то не сможете протестировать приложение, так как компилятор будет выдавать ошибку о том, что не может найти свойство с именем « tf «. Вот код:

[code language=»actionscript3″ highlight=»8,11″]
package <
import flash.display.MovieClip;
import flash.text.TextField;
import flash.events.MouseEvent;

public class DocumentClass extends MovieClip <

//private var tf:TextField; //we have removed this line!

public function DocumentClass() <
var tf:TextField = new TextField();
addChild(tf);
tf.text = "Hello World";

private function onButtonClick(e:MouseEvent):void <
tf.text = "Hey, you clicked!";
>

Что случилось? Ну, в ActionScript переменная, созданная в одной функции существует во время исполнения этой функции (что больше нескольких строчек позже), и исчезает, как только запускается вторая функция. Так что, если создать переменную « tf » в функции конструктора и попытаться использовать ее в функции onButtonClick() , то будут проблемы, так как переменная « tf » больше не существует, когда запускается функция onButtonClick() .

Между тем, свойства сохраняются на протяжении всего существования объекта, поэтому если вы сохраните TextField в свойстве, а не в переменной, то у вас будет доступ к TextField в других функциях, в значительной степени в любое время.

В данном случае, переменные иногда ссылаются в качестве локальных, потому что являются локальными по отношению к функции.

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

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

По поводу кнопки…

Хорошо, в предыдущем шаге я пропустил создание кнопки и просто использовал сцену в качестве области для нажатия кнопкой мыши. Мы изменим это, но не потому что нажатие по сцене неправильное (это не так, в некоторых обстоятельствах), но потому что мы можем создать класс кнопки Button для дальнейшего изучения ООП.

Нашей целью будет создание класса кнопки, из которого мы сможем создать множество объектов класса Button . Каждый объект Button будет иметь некоторую основную функциональность, которая будут универсальными для всех кнопок:

  • Наведение курсора и обычные состояния
  • Курсор превращается в значок руки
  • Графический фон с текстовой меткой

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

  • Текст метки
  • Действие при нажатии кнопки мыши
  • Расположение кнопки

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

Создаем класс кнопки Button

Мы создадим класс, который при инициализации будет рисовать прямоугольник, устанавливать текст в метку, обрабатывать состояния кнопки при наведении курсора мыши, и сможет реагировать на нажатия кнопки мыши. Начнем с создания нового текстового файла в редакторе текста. Сохраните его как «Button101.as» в той же папке, где находится Flash-файл. Это важно. Не перепутайте! Я серьезно.

Пишем шаблон

В новом файле, начнем с шаблона класса:

[code language=»actionscript3″]
package <
import flash.display.Shape;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFormat;

public class Button101 extends Sprite <

public function Button101() <


Добавляем некоторые свойства

Далее, добавим некоторые свойства для управления формой фона и меткой:

[code language=»actionscript3″]
// …
public class Button101 extends Sprite <

private var bgd:Shape;
private var labelField:TextField;

public function Button101() <
// …
[/code]

В свойстве bgd будет содержаться ссылка на форму ( Shape ), которая будет рисоваться программно и заполнять заливкой прямоугольник, и добавлять в качестве ребенка спрайт (Sprite).

Свойство labelField будет содержать ссылку на текстовое поле ( TextField ), которое будет создаваться в коде, также, и использоваться для отображения текстовой метки поверх фона.

Добавляем логику

А теперь заглянем в настоящую логику. Для конструктора:

[code language=»actionscript3″]
public function Button101() <
bgd = new Shape();
bgd.graphics.beginFill(0x999999, 1);
bgd.graphics.drawRect(0, 0, 200, 50);
addChild(bgd);

labelField = new TextField();
labelField.w > labelField.height = 30;
labelField.y = 15;
var format:TextFormat = new TextFormat();
format.align = "center";
format.size = 14;
format.font = "Verdana";
labelField.defaultTextFormat = format;
addChild(labelField);

addEventListener(MouseEvent.ROLL_OVER, onOver);
addEventListener(MouseEvent.ROLL_OUT, onOut);

mouseChildren = false;
buttonMode = true;
>
[/code]

Слишком много кода, но ничего удивительного по большому счету. Мы создаем новую форму ( Shape ) и рисуем прямоугольник в ней. Затем, мы создаем текстовое поле ( TextField ), устанавливаем ему основное форматирование. Далее, добавляем события на действия мыши при нахождении на кнопке и вне ее (слушатели для каждого события будут добавлены в следующем шаге). И наконец, установим некоторые свойства, чтобы придать объекту поведение больше похожее на кнопку.

Только одна часть может вызвать непонимание, это вызов addChild() , и то, откуда пришли свойства mouseChildren и buttonMode . Я снова попрошу вас подождать более полного ответа, так как мы рассмотрим это в следующем уроке, но нужно многое проделать с « extends Sprite » , который мы описали ранее.

Добавляем некоторые методы

Теперь, мы можем продолжить работу над классом. После конструктора, создайте функцию с именем « setLabel » .

[code language=»actionscript3″]
public function setLabel(label:String):void <
labelField.text = label;
>
[/code]

И, наконец, создайте два прослушивателя событий:

[code language=»actionscript3″]
private function onOver(e:MouseEvent):void <
bgd.alpha = 0.8;
>
private function onOut(e:MouseEvent):void <
bgd.alpha = 1;
>
[/code]

Весь код должен выглядеть вот так:

[code language=»actionscript3″]
package <
import flash.display.Shape;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFormat;

public class Button101 extends Sprite <

private var bgd:Shape;
private var labelField:TextField;

public function Button101() <
bgd = new Shape();
bgd.graphics.beginFill(0x999999, 1);
bgd.graphics.drawRect(0, 0, 200, 50);
addChild(bgd);

labelField = new TextField();
labelField.w > labelField.height = 30;
labelField.y = 15;
var format:TextFormat = new TextFormat();
format.align = "center";
format.size = 14;
format.font = "Verdana";
labelField.defaultTextFormat = format;
addChild(labelField);

addEventListener(MouseEvent.ROLL_OVER, onOver);
addEventListener(MouseEvent.ROLL_OUT, onOut);

mouseChildren = false;
buttonMode = true;
>
public function setLabel(label:String):void <
labelField.text = label;
>
private function onOver(e:MouseEvent):void <
bgd.alpha = 0.8;
>
private function onOut(e:MouseEvent):void <
bgd.alpha = 1;
>
>
>
[/code]

Есть кое-что очень важное — нужно убедиться в том, что методы объявлены на уровне класса. Это еще одна ошибка новичков: иногда люди не обращают внимания на то, где находятся фигурные скобки, и завершают вложенность там, где должен быть метод (тот, что объявляется на «коневом уровне» класса) внутри другого метода. Это эффективно превращает метод (который должен присутствовать на протяжении существования объекта) в локальную функцию (которая присутствует только во время существования работающего метода, в котором была объявлена).

Надеюсь, что компилятор будет уведомлять о подобных ошибках, но сама ошибка загадочной. Компилятор может выдать «1114: The public/private/protected/internal attribute can only be used inside a package.» . Если вы получаете такое сообщение, то проверьте уровень вложенности методов. Еще один способ помочь предотвратить такие ошибки — это обратить пристальное внимание на проблемы и отступы. «Настоящий» текстовый редактор может помочь вам с этим, но просто убедитесь в том, что все объявления методов имеют один и тот же уровень вложенности (обычно две точки в редакторе).

То, что сейчас есть — это класс готовый к работе, который при инициализации будет создавать пользовательский объект отображения, у которого будет серый прямоугольник с меткой. Метка может быть установлена при помощи метода, и кнопка автоматически отреагирует на движения мыши на ней и вне области воздействия. Все, что нам нужно сделать на самом деле — это инициализировать ее.

Создаем кнопку

Вернемся к классу документа и добавим кнопку в приложение. Это довольно просто сделать, по сравнению с предыдущими шагами.

Сначала добавим новое свойство для хранения кнопки. Вставьте его ниже строчки существующего свойства.

[code language=»actionscript3″]
private var tf:TextField;
private var button:Button101;
[/code]

Не обязательно располагать все свойства вместе, но для организации файла полезно держать данные в соответствующих местах. Лично я всегда перечисляю свойства с самого верха класса, перед конструктором. Таким образом, я всегда знаю, куда направиться, чтобы найти объявление свойства. Куда разместить свойства в файле не так важно, как ваши собственные стандарты и описания свойств в классе.

Продолжаем, теперь мы можем инициализировать « Button101 » в конструкторе класса документа.

[code language=»actionscript3″]
public function DocumentClass() <
tf = new TextField();
addChild(tf);
tf.text = "Hello World";

button = new Button101();
button.x = 10;
button.y = 200;
button.setLabel("Button 1");
addChild(button);
button.addEventListener(MouseEvent.CLICK, onButtonClick);

//stage.addEventListener(MouseEvent.CLICK, onButtonClick); //we have removed this line
>
[/code]

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

Теперь, вы возможно удивлены тем, как мы обрабатываем объект « Button101 » , как будто он экземпляр класса Sprite или MovieClip (смотрите урок о списке отображения DisplayList, если не были удивлены). Это все, что нужно сделать с директивой extends , чтобы исправить ее сейчас. Я обещаю, что мы рассмотрим этот вопрос (в следующем уроке).

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

Для примера, вот полный класс документа на данный момент, с дополнениями и изменениями, отмеченными полужирным шрифтом:

[code language=»actionscript3″ highlight=»9,16,17,18,19,20,21″]
package <
import flash.display.MovieClip;
import flash.text.TextField;
import flash.events.MouseEvent;

public class DocumentClass extends MovieClip <

private var tf:TextField;
private var button:Button101;

public function DocumentClass() <
tf = new TextField();
addChild(tf);
tf.text = "Hello World";

button = new Button101();
button.x = 10;
button.y = 200;
button.setLabel("Button 1");
addChild(button);
button.addEventListener(MouseEvent.CLICK, onButtonClick);

private function onButtonClick(e:MouseEvent):void <
tf.text = "Hey, you clicked!";
>
>
>
[/code]

Итак, что же выполняется в коде? Самое важное — это то, что мы получаем довольно изящную кнопку, которую могли бы использовать с небольшим усилием (не считая усилия по написанию класса Button101 в самом начале).

Для достижения такой же функциональности без использования классов и ООП, нам пришлось бы написать гораздо больше кода в основном скрипте. Чтобы проиллюстрировать это, давайте создадим вторую кнопку.

Создаем еще одну кнопку

Хорошо, давайте позволим ООП засиять по-настоящему. Мы создадим второй экземпляр кнопки, просто добавив чуть больше строчек кода в класс документа.

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

[code language=»actionscript3″]
private var tf:TextField;
private var button:Button101;
private var button2:Button101;
[/code]

Затем настроим кнопку в конструкторе:

[code language=»actionscript3″]
public function DocumentClass() <
tf = new TextField();
addChild(tf);
tf.text = "Hello World";

button = new Button101();
button.x = 10;
button.y = 200;
button.setLabel("Button 1");
addChild(button);
button.addEventListener(MouseEvent.CLICK, onButtonClick);

button2 = new Button101();
button2.x = 220;
button2.y = 200;
button2.setLabel("Button 2");
addChild(button2);
button2.addEventListener(MouseEvent.CLICK, onButtonClick);
>
[/code]

На самом деле вы можете просто скопировать и вставить строчки кода первой кнопки и изменить имя с button на button2 , а также изменить позицию координаты x второй кнопки (иначе button2 будет располагаться прямо поверх button1 ).

Мы удвоили сложность приложения всего лишь несколькими короткими строчками кода, благодаря возможности повторного использования класса Button101 . У нас есть класс, которые, если вы помните, является шаблоном, на основании которого создаются экземпляры. Сейчас у нас есть две различные кнопки, но они имеют общее «наследие» . Даже если есть много характеристик, которые одинаковы между этими двумя кнопками, например, эффект при наведении курсора мыши на кнопку или размер кнопки, есть еще и аспекты индивидуальности, а именно — расположение.

Надеюсь, что это показывает полезность и силу объектно-ориентированного программирования, которое способствует повторному использованию кода.

Проверьте пример, у вас должно быть две кнопки, которые делают одно и тоже.


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

Подводя итоги

Было две главные темы в данном уроке: пример с проектами домов (классы) и фактических домов (экземпляры), и понятие об области видимости.

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

Область видимости — это важная концепция во всем программировании и не в меньшей степени в объектно-ориентированном программировании. Она определяет «диапазон существования» переменной или функции, а также «место существования». Переменная в области видимости объекта имеет различный «диапазон существования» , чем переменная, которая находится в области видимости метода.

Это, тем не менее, всего лишь малая часть, верхушка айсберга. Это все, что есть прямо сейчас, но в следующих уроках мы рассмотрим подробнее данную тему и, наконец, получим разъяснения по всем вопросам, которые я откладывал на потом, например, такие как директивы extends и public . Многие вещи обретут больше смысла. Но когда дело касается сложных тем, таких как, например, объектно-ориентированное программирование, лучше всего продвигаться постепенно. Если вам понравился урок, расскажите о нем в социальных сетях (значки внизу), это поможет продвижению сайта.

30, отобранных вручную, статей по Flash и ActionScript 3.0

Если уметь правильно использовать Flash, то вы без труда сможете создавать ошеломительные работы и привлекать посетителей на свои сайты, за счет грамотно продуманного Flash-интерфейса. Вся мощь Flash позволяет демонстрировать и реализовывать необычные визуальные решения, применяя графические движения, видео и аудио. Не забывайте использовать их, если вы хотите добиться действительно поразительных результатов.

В данной статье приведены более 30 обучений по работе с Flash и ActionScript 3.0, которые могут повысить ваши навыки, или просто послужить вдохновением для ваших будущих проектов на Flash.

В данной статье мы предлагаем вам изучать процесс создания эффекта увеличительного стекла, демонстрируя при этом возможность применения "displacementMapFilter". Эффект может быть достигнут за сравнительно короткий промежуток времени, и с использованием небольшого кода.

Очень важно уметь создавать эффект градации посредством Flash.

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

В данной статье предлагается изучение легких путей создания 3D-менюшек, пример таких, как показано ниже.

В этой статье мы изучим процесс создания динамического слайд-шоу с использованием ActionScript 3.0 и то, как можно подгружать изображения из xml-файла.

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

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

В данной статье о Flash и ActionScript 3 вы сможете обучиться созданию бесконечной галереи. Такой метод также хорошо возможно применять и при создании меню.

В данной статье мы, при помощи Flash CS4 и ActionScript 3.0, реализуем эффект прокрутки, который используется в iPhone.

Класс таймера (timer class) считается полноценным классом в ActionScript. В данной статье вы сможете наблюдать крайне легкий способ применения таймера. Мы создадим обычную форму, затем, применив класс таймера, заставим ее вращаться.

В данной статье рассказывается о том, как при помощи Flash и ActionScript создать шлейф курсора из звездочек.

В данной статье рассказывается о том, как на своё усмотрение оформить контекстное меню, удаляя стандартные пункты меню, заменяя их другими.

Опросите своих посетителей посредством опросника на Flash, и отобразите результаты с помощью Flash-диаграммы.

В данном уроке, в самых детальных подробностях, будет описан процесс создания собственного стильного курсора, применяя немного кода ActionScript. Вы можете воспользоваться данной статьей, когда захотите сменить стандартный курсор на собственный.

Добавьте немного особой динамики своему веб-сайту, предоставив пользователю возможность перетаскивать блоки прямо у вас на странице.

О том, как создать современный образец предварительной загрузки веб-страницы с использованием ActionScript 3. На самом деле, изменить внешний вид предварительной загрузки достаточно просто.

- Управление цветовыми оттенками в AS3 - ресурс умер

О том, как создать современный образец предварительной загрузки веб-страницы с использованием ActionScript 3. На самом деле, изменить внешний вид предварительной загрузки достаточно просто.

Изучив данную крайне детализированную статью, вы научитесь создавать очень привлекательные анимационные тексты.

В данной статье вы сможете научиться созданию вертикальной 3D-карусели при помощи ActionScript 3. Мы установим скорость вращения, зависимую от скорости движения мыши.

Процесс создания системы элементарных частиц во Flash может казаться очень сложным на первый взгляд, но как нам показывает Seb Lee-Delisle, это не наука о ракетостроении.

Еще одна статья, рассказывающая процессе создания эффекта частиц, вылетающих в различных направлениях из центра документа, к тому же, с различным размером и уровнем прозрачности.

Документация по использованию основ библиотеки Papervision3D.

Люк Фельдман (Luke Feldman) рассказывает о том, как создать захватывающую компьютерную игру на Flash, которая будет радовать игроков снова и снова.

Обучение созданию mp3-плеера с ползунком уровня громкости.

В статье опивается легкий способ создания 3D-тоннеля во Flash с применением простых 2D-анимационных методов.

Намного проще рисовать "кривые" в ActionScript 3.0, используя «curveTo()».

В данном простенькой Flash-ролике пользователь может мышью рисовать на доске. Также есть возможно выбора цвета и толщины указателя. Для выбора цвета мы использовали новый компонент ActionScript 3 – палитра цветов.

Учимся говорить легко посредством использования простой синхронизации изображения и звука, с использованием Flash CS3 и аниматора.

Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

ActionScript 3.0, Flash, Flex, Adobe Flash - книги, справочники, руководства и самоучители

Литература ⇒ Интернет и PHP ⇒ ActionScript 3.0, Flash, Flex, Adobe Flash

ActionScript — объектно-ориентированный язык программирования, один из диалектов ECMAScript, который добавляет интерактивность, обработку данных и многое другое в содержимое Flash-приложений. С помощью ActionScript можно создавать интерактивные мультимедиа-приложения, игры, веб-сайты и многое другое. Создание игр, ActionScript 3.0, Flash, Flex с нуля, Adobe Flash CS3, эффекты, графика, анимация и мультипликация для дизайнеров и программистов - эти и другие книги, справочники, руководства и самоучители можно найти и скачать бесплатно в этом разделе.

Извините, данный раздел находится в разработкеYou have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line

Уроки Flash

Обучение Adobe Flash, Adobe Animate и Actionscript.

Пламя свечи

Пламя свечи.
В этом уроке Вы научитесь созданию весьма реалистичного пламени свечи, используя несложную графику, градиентную заливку и немножко кода. Урок подробно иллюстрирован, а код имеется, как для AS2, так и для AS3.

Кораблик на волнах.

Простой урок. Кораблик на волнах.
Автор очень доступно покажет и расскажет, как создать анимацию покачивающегося на волнах корабля, на фоне проплывающих облаков. Пошаговое изложение с подробным описанием весьма поможет начинающему художнику — аниматору.

Игра в изометрии, часть 1

Игра в изометрии, часть 1, На чистом AS3 без сторонних библиотек
В этой части, на практике, объясняется алгоритм, позволяющий без тормозов перемещаться по большущей карте изометрического мира. Урок написан в редакторе FlashDevelop и будет работать в плеере не ниже 9 версии.

«Живой» интерактивный снег.

«Живой» интерактивный снег. (AS3), Урок
В этом уроке вы научитесь созданию «очередного» падающего снега. Однако наш снег можно погонять мышкой или придумать еще какой-то «ветер». Урок написан в редакторе FlashDevelop и будет работать в плеере не ниже 10 версии.

Эффект гармошки

Эффект гармошки
Создаем интерактивный лист бумаги с любым изображением, сложенный в «гармошку», да еще и с разнообразными настройками. Поэтапные и подробные описания кода помогут освоить непростой материал.

Калькулятор (AS3)

Калькулятор (AS3)
В уроке показан способ создания простого математического калькулятора. Используя полученные навыки, вы сможете сделать калькуляторы и посложнее.

Genome2D, Работа с мышью

Genome2D, Работа с мышью
Продолжим описание нового фреймворка «Genome2D». Разберемся с мышью.

Genome2D, Текстуры

Genome2D, Текстуры
Продолжим описание нового фреймворка «Genome2D». В этой теме — разговор о текстурировании объектов.

Genome2D, Введение

Genome2D, Введение
Вашему вниманию предлагается описание нового фреймворка «Genome2D». Genome2D — движок для отрисовки графики с использованием Stage3D (через GPU). Он довольно шустрый, по тестам обогнал Starling. Движок умеет работать с частицами и физикой.

Пользовательский курсор

Урок «Пользовательский курсор»
Урок показывает, как подменить собственной картинкой — системный курсор, используя нативные возможности плеера.

Цукерберг рекомендует:  Топ-10 сериалов для айтишников.
Понравилась статья? Поделиться с друзьями:
Все языки программирования для начинающих