Пишемо додаток air під ios працюємо з дотиками і акселерометром

У цьому нескладному уроці я покажу роботу flash.ui.Multitouch і flash.sensors.Accelerometer на прикладі тестового додатка Air для iOS.

Доброго вам дня!


Мене звуть Роман і це мій перший (крос) пост на FlashGameBlogs. Досвід - всього одна іграшка на Box2D, куплена Rocanten. )

У цьому уроці я напишу і скомпілюйте iOS-додаток з-під Win 7, використовуючи виключно Adobe Flash і, відповідно, ActionScript 3 без будь-яких доповнень. У даній статті не розглядаються проблеми оптимізації додатків, не проводиться конверсія векторної графіки в растрову і не тестується Box2D (все одно це марно, з фізикою потрібно працювати на Cocos2d). Однак за допомогою цього уроку можна створити найпростішу програму під i-Девайс і зробити перший крок до повноцінного розробці додатків, використовуючи ті інструменти, які підходять під Ваші потреби.

Увага! Все стиснуті картинки клікабельні!

У моєму розпорядженні джейлбрейкнутих iPod Touch четвертого покоління ємністю 64 Gb, Adobe Flash CS6, липовий сертифікат розробника, а так само програма iFunBox, необхідна для установки програми з подальшим тестуванням. На відміну від оригінального уроку, в якому код пишеться в кадрах, я ієрархічно поділяю додаток на кілька класів, для власної зручності збережених окремо. Перший крок простий: запускаємо Flash, натискаємо Air for iOS, задаємо розміри 640х960 (рідне дозвіл iPod Touch 4, iPhone 4.). Для тестування на інших пристроях, використовуйте 1136x640 (iPhone 5, iPod Touch 5), 1024x768 (iPad 1, 2, Mini), 2048x1536 (iPad 3, він же New і 4). Далі я зберігаю мій проект: File - Save as ... - Testing.fla в папку програми. Після цього я вписую в якості документ-класу App та тисну олівець.

Зображення 1. Розміри і FPS.


Зображення 2. Клас документа.


Клас зберігаю в ту ж папку, куди зберігав Testing.fla. Клас називається, природно, App.as.

Клас App.as:

В теці програми створюємо папку com, в папці com створюємо папку testing. Далі у флеші: File - New - ActionScript 3.0 Class з ім'ям com.testing.iosMenu. Зберігаємо в каталог Додаток / com / testing / iosMenu.as. Цей клас буде відповідати за роботу однієї-єдиної кнопки і запуск самої гри. Дуже важливо не забути імпортувати класи Multitouch і MultitouchInputMode!

Клас iosMenu.as:


Далі створюємо клас gameScreenCl. Він відповідає за додавання кульки на сцену і обробку даних акселерометра.

Клас gameScreenCl.as:


У testing.fla Insert - New Symbol з ось такими параметрами:

Зображення 3. Створення символу ballMoving.


Це буде кулька-гурток, управління яким здійснюється за допомогою акселерометра i-девайсів. Обов'язково пропишіть клас мувікліпа! У символі ballMoving малюємо ось такий гурток 100х100. Позиціонуємо його строго по центру.

Зображення 4. Малюнок в символі ballMoving.


Далі створюємо нову кнопку з ім'ям playButtonGraphics і прив'язкою до класу com.testing.playButtonCl. Природно, зберігаємо по вкладеним шляхах.

Зображення 5. Проста кнопка Play.


На даний момент ієрархія додатки виглядає ось так:

Зображення 6. Структура папок і класів.


Повертаємося в testing.fla. У вікні Properties біля напису Air 3.2 for iOS натискаємо на гайковий ключ - заходимо в налаштування Air for iOS Settings.

Зображення 7. Виклик налаштувань Air.


Наводимо їх до наступного вигляду:

Зображення 8. Загальні настройки Air.


Пароль сертифіката 1234. Ставимо галку Remember password for this session.


Тепер настав час підготувати іконки програми. Нам буде потрібно тільки три штуки: 29х29. 57х57 і 512х512. Процес створення іконок описувати немає сенсу, а готові файліки лежать в архіві.

Зображення 10. Налаштування іконок .ipa.


Зображення 11. Вибираємо готові іконки для .ipa.


Повернемося в testing.fla. У віконці Properties жмакаем Publish settings і наводимо їх до такого виду:


Далі жмакаем гайковий ключ біля ActionScript 3.0 і виходимо в настройки. Так як багів в коді немає, я зняв галки Strict Mode і Warnings Mode для більш спритною компіляції.

Зображення 13. Налаштування ActionScript3.


Ви зберегли знову забігаємо по гайковий ключику Air. Зайшовши в розділ Deployment вводимо пароль +1234 (якщо не зберігали), натискаємо Publish і чекаємо.


Мій файл вийшов розміром 4.45 мегабайта. Досить багато для флешки, але i-Девайси бувають мінімум від 8 гігабайт, тому хвилюватися про розмір .ipa нема чого. )

Встановлюємо додаток через iFunBox.

Зображення 15. Заливка на девайс.


Милуємося на іконку, запускаємо. Скріншоти з самого пристрою:

Зображення 16. У іконки автоматично заокруглені кути і доданий відблиск.


Як видно з наступного скрін, на зображенні є артефакти. Швидше за все, це викликано зміною масштабу кнопки. Можливо, в AIR вектор самостійно конвертується в растр, а зміна масштабу спрацювало тільки після кешування.

Зображення 17. Менюшка вдало запустилася.


Ну ось акселерометр і заробив на нас:

Зображення 18. Три скрін роботи програми в один ряд.


Таким чином, після прочитання даного уроку, Ви навчилися працювати з новими методами тач-введення у флеш, використовувати акселерометр під i-девайси, а так само компілювати свою власну тестову пріложеньку.

Елемент управління MultitouchInputMode.TOUCH_POINT вказує на те, що Air обробляє події мишки і тапов по екрану, а ось MultitouchInputMode.GESTURE обробляє мишку і жести, але не тапи. У стандартному MultitouchInputMode.NONE Air обробляє тільки події миші.

Обробка мультитач-подій досить обширна:

TOUCH_BEGIN - початок дотику.
TOUCH_END - кінець дотику.
TOUCH_MOVE - переміщення точки дотику (гравець водить пальцем по екрану).
TOUCH_OVER - точка дотику перемістилася в межі інтерактивного об'єкта. На відміну від TOUCH_ROLL_OVER, дана подія поширюється на всі дочірні елементи об'єкта.
TOUCH_OUT - точка дотику перемістилася за межі інтерактивного об'єкта. На відміну від TOUCH_ROLL_OUT, дана подія поширюється на всі дочірні елементи об'єкта.
TOUCH_ROLL_OVER - точка дотику перемістилася в межі інтерактивного об'єкта.
TOUCH_ROLL_OUT - точка дотику перемістилася за межі інтерактивного об'єкта.
TOUCH_TAP - звичайний тап пальцем.

Крім того властивості події дотику включають в себе такий параметр як pressure (0.0 ... 1.0). Як неважко здогадатися, він визначає силу натискання, але підтримується не на всіх пристроях. Так само, у класу Sprite з'явилося два нових методи, що дозволяють користувачеві тягати спрайт пальцями: startTouchDrag і stopTouchDrag.

Є три типи подій, що відносяться до жестів: GestureEvent. PressAndTapGestureEvent і TransformGestureEvent. Обробка жестів включає в себе наступні пункти:

GestureEvent.GESTURE_TWO_FINGER_TAP - тап двома складеними пальцями.
GesturePressAndTap.GESTURE_PRESS_AND_TAP - гравець, утримуючи один палець, тапнул другим.
TransformGestureEvent.GESTURE_ROTATE - гравець обертає об'єкт на екрані двома пальцями.
TransformGestureEvent.GESTURE_SWIPE - свайп = закреслення рядки або скролл.
TransformGestureEvent.GESTURE_ZOOM - гравець двома пальцями наближає зображення.

Схожі статті