1. Macromedia Flash 5 (Частина третя)
2. Вступ
3. терміни
4. Панель дій (Actions Panel)
5. кнопки
6. Основні дії з Movie Clips
7. імена
8. шляхи
9. Налагодження в ActionScript
10. PS

2001 р

Macromedia Flash 5
(Частина третя)

Введення в ActionScript

Рубен Сардарян, [email protected]

Вступ

минула стаття була присвячена анімації. Ми створювали анімацію на основі 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.
• Класи (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 (). Синтаксис її такий:

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

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

Щоб перевірити цей сценарій, виділіть вашу кнопку, натисніть 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, а об'єкт 3 вкладено в об'єкт 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 невидимим при натисканні кнопки миші. У сценарії для об'єкта 3 пишемо:

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

_parent._parent._parent.obj5._visible = false;

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

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

Ви можете спробувати використовувати оброблювач 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-фільми (зокрема тривимірні).

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

PS

З'явився обіцянки список посилань на Flash-ресурси:

http://rubs.boom.ru/Flash/links.html

Тепер всі мої матеріали (з прикладами на Flash) можна знайти тут:

http://rubs.boom.ru/Flash/flash.html