Говоримо на Flash Action Script

У статті буде розглянуто процес побудови у Flash 5 інтерактивного ролика («мувіка»), що представляє собою гру двох гравців. Передбачається, що читач «шапково» знайомий з Macromedia Flash 5, вміє створювати у цьому пакеті найпростіші графічні фігури (коло, еліпс, прямокутник, напис тощо), поводитися з меню та вікнами, панелями інструментів тощо. Корисним буде досвід створення простенької анімації. Якщо ви цього всього ще не вмієте нічого страшного, в інтернеті повно сайтів і матеріалів, присвячених Flash. Наприкінці статті буде наведено посилання.

У ролику, який ми пропонуємо до вашої уваги, практично вся анімація буде реалізована за допомогоюAction Script. Починаючи з версії 4, у Flash включено досить потужну мову сценаріїв (скриптів), що за синтаксисом нагадує C. Якщо ви знайомі з цією чудовою мовою - це чудово допоможе вам в освоєнні Flash Action Script.

Ми робитимемо ролик-гру. Причому гру для двох людей. Все дуже просто - внизу їздить гармата і стріляє, скажімо, по тарілці, що літає, а тарілка, як ви вже здогадалися, стріляє по гарматі. Такий, знаєте, симулятор зоряних воєн :-).

Що потрібно для того, щоби написати цю гру? Macromedia Flash 5, комп'ютер (бажано потужніший: векторна графіка та анімація - ресурсомістка робота) і, звичайно, терпіння.

Ми не будемо докладно описувати створення малюнків (символів), а намагатимемося більше уваги приділити Action Script'ам (мові сценаріїв).

Тепер створюємо символи, які нам знадобляться у роботі.

Створюємо новий символ (Insert > New Symbol), називаємо йогоplate(«тарілка»), кликаємо OK і малюємо тарілку (літаючу, із зеленими кровожерними чоловічками :-)). Тарілка (як і всерешта символів) повинна знаходитися приблизно по центру вікна (центр символу збігається з хрестиком). Особливо не турбуйтеся, простий овал підійде для початку, а наводити красу можна і після написання самої програми. Щоб побачити всі символи, що знаходяться в ролику, відкрийтебібліотеку символів(Window &Library).

Так само створюємо гармату (витягнутий по горизонталі прямокутник), називаємо їїcannon. Дуло для гармати (назвіть символcannon_barrel) та для тарілки (plate_barrel) зобразіть у вигляді вертикальних прямокутників. Не забувайте: для кожного з цих ігрових об'єктів ми створюємо новий символ (Insert & New New Symbol). Потім створіть снаряди, якими стрілятиме тарілка і гармата (це теж окремі символи), і назвіть їх відповідноplate_shellіcannon_shell. Намалюйте їх у вигляді маленьких прямокутників чи кіл. Спочатку цього вистачить.

Після цього в основному ролику створіть7 шарівпо одному для кожного символу та один для сценаріїв (Insert > Layer) і перемістіть по одному символу в кожен шар (простим перетягуванням символів з вікна бібліотеки), залишивши верхній шар порожнім. Зробіть так, щоб шари з тарілкою та гарматою знаходилися вище шарів зі стовбурами, а ті, у свою чергу, поверх снарядів (простим перетягуванням у вікні із шарами). Це потрібно для того, щоб дуло зброї було приховано корпусом машини, а не навпаки.

Символи, що знаходяться в основному ролику, називаютьсяекземплярами (instance). В одному ролику може бути кілька екземплярів одного й того самого символу. Цим екземплярам потрібно дати імена (полеNameна закладціInstanceна допоміжній панелі; за замовчуванням ця закладка знаходиться зліва на нижній панелі). Для зручності іменаекземплярам дайте ті самі, що й самим символам.

Тепер перейдемо власне до Action Script'ів. Вони бувають двох типівсценарії символуісценарії кадру. Сценарії символу орієнтовані зовнішні команди, які від користувача (натискання клавіші, переміщення мишки тощо.), сценарії кадру можуть виконуватися й самі собою. У нашій програмі використовуватимуться і ті, й інші. Сама програма буде побудована за допомогою трикадрового циклу - одного з найпоширеніших прийомів написання сценаріїв у Flash. У першому кадрі встановлюються початкові значення змінних, другий кадр тіло циклу, основна частина ролика. У третьому кадрі відбувається перехід на другий кадр за допомогою функції gotoAndPlay() або gotoAndStop().

Тож почнемо. У кожному шарі має бути по три кадри, причому тільки перший з нихключовий (keyframe), решта двох звичайних. Щоб створити новий ключовий кадр (або перетворити простий кадр на ключовий), треба клацнути на ньому правою кнопкою і з меню вибрати командуInsert Keyframe. Однак у шарі зі сценаріями всі три кадри мають бути ключовими, тому що писати сценарії можна лише у ключових кадрах. До речі, щоб не плутатися, шарам теж можна дати імена, що відповідають екземплярам символу (шару зі сценаріями можна дати ім'яaction). Для початку напишемо сценарій, завдяки якому вся наша техніка буде встановлюватися в початкове положення, наприклад, по центру екрану (тарілка вгорі, гармата внизу). Відкриваємо вікно сценаріїв (Window > Actions) і клацаємо на першому кадрі. Зверніть увагу на зверху вікна написаноFrame Actions, тобто зараз ми пишемосценарій кадру. Для зручності перейдіть дорежим експерта (Expert Mode), натиснувши Ctrl+E або зза допомогою стрілки у верхньому правому кутку.

Потім клацаємо на третьому кадрі та в сценарії третього кадру пишемо:

Вони можуть трохи відрізнятися (залежно від розмірів символів). Тільки залиште вгорі та внизу трохи місця, воно знадобиться нам надалі (там ми відображатимемо військові успіхи наших механічних бійців). А як, власне, відбуватиметься рух? А дуже просто! Ми лише мінятимемо x-координату (а для снарядів ще й y-координату) екземплярів у другому кадрі. Але перед цим треба написати сценарій на подію натискання клавіш і . Це ми робитимемо вже у сценарії символу. Отже, натиснемо на екземпляр тарілки, а потім знову на вікно Action. Зверніть увагу, тепер у заголовку вікна має бути написаноObject Action, тобто ми пишемо сценарій символу. Перейдіть в режим експерта (Ctrl+E або за допомогою стрілки у верхньому правому куті вікна) та напишіть наступний код:

onClipEvent - ключове слово, що означає подію. isDown - це метод вбудованого об'єкта key, який повертає значення true (істина), якщо натиснута вказана клавіша. Тепер при натисканні будь-якої клавіші буде виконуватися код, написаний у зовнішніх дужках, в якому перевіряється, чи натиснута клавіша або , а змінній plate_flag присвоюється відповідне значення. Зауважте, що змінна plate_flag ніде до цього не визначалася. Це одна з відмінностей Flash Action Script від мови C. Ще один важливий момент: якщо ви оголошуєте якусь змінну (властивість) у сценарії об'єкта (Object Action), то при зверненні до цієї властивості зі сценарію кадру (Frame Action) необхідно перед ім'ям змінної ( перед властивістю) вказати ім'я об'єкта з точкою. У нашому випадку, оголосивши властивість plate_flag у сценарії об'єкта plate, ми звертатимемося до нього зі сценарію кадруось так: plate.plate_flag (за аналогією зі структурами C).

Майже такий самий код буде і для екземпляра гармати:

Для гармати клавіша A означатиме рух вліво, а клавіша D вправо. Тож при переході на нашу геніальну гру з Counter-Strike довго переучуватися не доведеться :-).

Тепер у другому кадрі перейдемо до сценарію кадру. Напишемо наступний текст:

Цей код перевіряє змінну plate_flag і в залежності від її значення пересуває тарілку на 3 пікселі вліво або вправо.

Знову зберігаємося, тиснемо F12, натискаємо по черзі клавіші і , а потім повертаємося до роздумів. Тарілка рухається, але ось її дуло залишається на місці. Однак це легко виправляється. У другому кадрі пишемо:

Знову дивимось. Все добре, ось тільки тарілка з гарматою плавно пливуть кудись убік і зникають із поля нашого тактичного зору. Потрібно, щоб вони з'являлися з іншого боку. Сказано: зроблено. Пишемо наступний код (у сценарії другого кадру):

Тепер розберемося із гарматними стволами нашої техніки. Нехай для тарілки клавішами повороту стовбура зброї будуть і , а для гармати W і S.

Отже, код для екземпляра стовбура тарілки:

_rotation ¦ властивість екземпляра, що визначає кут повороту (у градусах). Спочатку ми змінюємо значення _rotation в залежності від того, яка клавіша натиснута, а потім перевіряємо, чи дуло не повернулося на кут, більший 90 градусів (адже воно не може обертатися на всі 360 градусів).

Майже такий самий код буде і для дула гармати:

У сценарії другого кадру напишемо наступний код:

Тепер кут повороту снарядів дорівнюватиме куту повороту стволів.