Adobe Flash

Введення

Минула стаття була присвячена анімації. Ми створювали анімацію   на основі motion tweening, shape tweening і просто складали рух з окремих   кадрів. Думаю, пора перейти до більш складної теми, розгляду інструменту,   який створює основу для більшості якісних Flash-фільмів (Flash movies).

Цей інструмент - ActionScript - подієво-керований мову,   вбудований в Flash. Остання версія ActionScript, (яка присутня у   Flash 5), істотно відрізняється від ActionScript, який був у 4-му Flash. Якщо   в минулій версії, це був обмежений набір команд, що дозволяє здійснювати   лише основні дії, і вводиться за допомогою не дуже зручного інтерфейсу, то   новий 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.
• Класи (Classes) - Це типи об'єктів. Наприклад, клас дерева - рослина.     Під Flash є деяка кількість визначених класів (дуже схожих     на класи JavaScript). Ви можете створювати свої класи, або модифіковані     існуючі.
• Екземпляри (Instances) - Це буквально екземпляри певних класів.     Наприклад, примірником рослини можуть бути дерево, кущ чи квітку. Екземпляр     - Це вже конкретний реальний об'єкт. Якщо клас - це визначення об'єкта     (Примірника), то екземпляр - це вже конкретне втілення, це клас у дії.     Кожному екземпляру можна привласнити ім'я, щоб через нього звертатися до функцій     або змінним об'єкта.
• Обробники (Handlers) - Це спеціальні інструкції, які обробляють     події. Наприклад onClipEvent -     Процесор дій, пов'язаних з конкретним символом (див. Macromedia     Flash ч. 2).
• Оператори (Operators) - Це елементи мови, які обчислюють значення,     виходячи з одного або більше аргументів. Наприклад, оператор складання (+) повертає     суму двох значень, що стоять ліворуч і праворуч від нього.
• Змінні (Variables) - Це ідентифікатори, які можуть зберігати     значення. Наприклад, a = 5; або name = "Michael".

Ці терміни ми будемо використовувати під час обговорення 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 - Клавіша мишки     відтиснуті, коли курсор знаходиться в межах кнопки;
• releaseOutside - Клавіша     мишки відтиснуті, коли курсор знаходиться поза межами кнопки;
• rollOver - Курсор миші входить     в межі кнопки;
• rollOut - Курсор виходить     за межі кнопки;
• dragOver - Курсор входить     в межі кнопки, при цьому була натиснута кнопка, і натиснута клавіша миші;
• dragOut - Курсор виходить     за межі кнопки, при цьому була натиснута кнопка, і натиснута клавіша миші;
• keyPress ("Клавіша")     - Була натиснута "клавіша". Список клавіш можна подивитися в довідці     по Flash (об'єкт Key), або використовувати панель параметрів для введення потрібної     клавіші.

На жаль, Flash "розуміє" тільки ліву клавішу   миші. Права використовується для виклику контекстного меню (клацніть правою кнопкою   на якому-небудь Flash мультику). Способів відловлювати в Flash середню клавішу   або "коліщатко" (mouse wheel), я поки не зустрічав, думаю, що їх не   існує.

Перехоплюються ці події за допомогою директиви on ().   Синтаксис її такий:

on (подія)
{
... / / Наші дії
}

Нижче ви можете самі спробувати викликати деякі події:

Дуже часто використовуваний приклад - перехід за посиланням при натисканні   на кнопку:

on (release)
{
getURL ("http://rubs.boom.ru");
}

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

Ось так просто можна перехопити всі події, пов'язані з кнопкою.   Ну а як їх використовувати - це справа виключно вашої уяви.

Основні дії з Movie Clips

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

За допомогою сценаріїв на ActionScript ви можете виконувати практично   будь-які дії над символами. Треба тільки пам'ятати, що виконати ці дії   можна тільки або у відповідь на дію користувача, або при настанні якогось   кадру на часовій шкалі.

Отже, що ж у нас є? Я перерахую тільки основні (на мій   погляд) інструменти. Останнє ви знайдете в списку елементів мови або допомоги.

Опції кліпів (movie clip), які можна викликати:

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

Властивості (параметри) кліпів, які можна зчитувати / змінювати:

• _x, _y - Координати     кліпу (в пікселях);
• _xscale, _yscale - Масштаб кліпу (у відсотках), відповідно по горизонталі і по вертикалі;
• _width, _height -     ширина і висота кліпу (в пікселях);
• _rotation - Кут     повороту кліпу (в градусах);
• _alpha - Прозорість     кліпу (у відсотках);
• _visible - Видимість.

Це далеко не все, що можна робити з кліпами. Використовуйте   інші параметри, експериментуйте, творіть!

Імена

Для того, щоб звертатися до кліпів, нам буде потрібно розібратися   з поняттям імені об'єкта (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, а об'єкт три вкладено у об'єкт 2. Об'єкти на малюнку візуально вкладені   один в одного, але це в жодному разі не означає, що так має бути і "в   життя ". Тут вони так згруповані для наочності. Так як ім'я об'єкта   не може починатися з цифри, нехай об'єкти в нас називаються obj1-obj5.

Тепер займемося шляхами. Для початку подивимося, які об'єкти   можуть звертатися один до одного по імені. obj1 може звертатися до obj2, а obj2 - До obj3, Але при цьому obj1 не може звернутися до obj3 безпосередньо,   тому що той міститься не в obj1,   а в obj2.

Скажімо першому об'єкту потрібно, щоб об'єкт 3 почав заново відтворюватися   з 1-го кадру. Ось як це робиться:

obj2.obj3.gotoAndPlay (1);

Щоб 4-му об'єкту зробити 1-й об'єкт (зауважте з усіма подоб'ектамі!)   напівпрозорим, йому потрібно в своєму сценарії написати наступне:

_parent.obj1._alpha   = 50;

або

_root.obj1._alpha =   50;

Оскільки obj4 у   нас знаходиться на першому рівні ієрархії, то для нього _root і _parent - Одне й те саме.

Тепер для об'єкта 3 напишемо скрипт, який зробить об'єкт   5 невидимим при натисканні клавіші миші. У сценарії для об'єкта три пишемо:

onClipEvent (mouseDown)   (
_root.obj5._visible = false;
}

У цьому фрагменті ми використовували абсолютний шлях. Якщо б ми   використовували відносний, це виглядало б як:

_parent._parent._parent.obj5._visible   = False;

Сподіваюся, я прояснив момент з шляхами.

Наведені вище приклади показали не тільки як виглядають шляху,   але і як викликаються функції і присвоюються значення властивостям.

Ви можете спробувати використовувати обробник onClipEvent,   задаючи різні умови і виконуючи різні дії з об'єктами при цьому.

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

Налагодження в ActionScript

Останнє, що ми розглядаємо в цій статті: вікна Output   (Висновок) і Debugger (відладчик) - інструменти, службовці для налагодження сценаріїв   ActionScript.

Віконце Output прийшло з Flash 4, де воно було єдиним   інструментом для налагодження. Існує директива trace (),   яка виводить повідомлення у цьому віконце. Туди ж виводяться повідомлення про помилки.

Використовувати trace дуже просто:

trace ("280-й   кадр ");

або, наприклад,

trace (xpos + k);

У 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.