Від флеша до appstore, повний цикл

  

Передісторія

Днями моє перше додаток для аппстора пройшло рев'ю в Еппл і було схвалено з першої спроби. Таким чином закінчився мій місячний шлях від написання невеликої іграшки на Actionscript 3 до топів аппстора. Весь шлях був пророблений з використанням віндового компа без використання маку (тут є маленька ложка дьогтю, але про це пізніше) і, думаю, отриманий досвід може бути багатьом корисний. Самому мені довелося чимало гуглити в процесі розробки, збираючи по крихтах корисні відомості з усього інтернету, тому невелика інструкція, яка висвітлює важливі моменти буде корисна цікавиться.
 
 
 
 

Дано

Зауважу відразу, тут не буде нічого про розробку власне гри: дизайн, кодинг тощо залишиться за межами статті. Тут буде про те, як на флеше зробити кроссплатформерное додаток і відправити його в стор. З одних і тих же початкових кодів можна зібрати додаток, що буде відкриватися в браузері і пакуватися під мобільні платформи. Середа розробки — Flash Develop. У Builder, втім, все приблизно так само. Крім того, я використовував фреймворк starling (gamua.com / starling / ) — його краса в тому, що він а) підтримує апаратне прискорення графіки, тобто ваша флешка швидше за все не буде гальмувати на пристрої і б) підтримує multiresolution — турботи про підтримку різних екранів зводяться до мінімуму
 
 

Рішення

 
Крок 1. Створення проекту, реєстрація аккаунта розробника, сертифікати, провіжени і все таке
У цей місці я дозволю собі отхалявіть і дати вам ось це посилання: kpulv.com/115/FlashDevelop_to_iPad_Workflow / — тут лежить чудова інструкція, яка дрібними кроками і з картинками проведе вас від створення проекту до запуску першого білда на якому-небудь айфоне. Все, що вам потрібно, це 100 баксів для отримання аккаунта Еппл-розробника і віндовий комп (ніяких маків, ура!) Якщо не рахувати того, що отримання аккаунта займе близько доби (оскільки проходить через ручну модерацію), то весь цей шлях не повинен зайняти більше години. Якщо у вас до цього вже був свій проект, то достатньо буде перенести його вихідні коди і ресурси в проект створений за інструкцією, підключити до компу девайс, натиснути на кнопку F5 і насолоджуватися тим, як ваша гра гальмує на пристрої в дебажном режимі :) Цих гальм боятися не варто — вони швидше за все від дебагом. Якщо не натискати F5, а запустити PackageApp.bat і там вибрати збірку Ad-Hoc, то додаток буде працювати швидко, зате дуже довго збиратися (збірка протягом 5-10 хвилин — це нормально). У режимі interpreter збиратися буде досить швидко, зате повільно працювати.
 
 
Крок 2. Підключаємо Native Extensions
Adobe Native Extensions (ane) — це такі бібліотеки, які дозволяють використовувати можливості пристрою, на зразок вібрації, акселерометра або ж In-apps і Game Center. Якщо вам нічого такого не потрібно, то цей крок сміливо пропускаємо. Мені ж хотілося прикрутити до своєї іграшці збір статистики (Flurry) і власне Game Center для ачівок і лідербордов. Для цього я скачав flurry ane і Adobe Gaming SDK , з якого потрібен був лише gamecenter.ane. Втім, цим gamecenter.ane краще не користуватися — про це теж пізніше.
 
Підключити ane досить просто (знаходимо файл в project explorer'e, клацаємо на ньому правою кнопкою і натискаємо Add to library; рекомендується складати ane в папку libs), але є пара неочевидних моментів.
 Перше: за замовчуванням вони підключаються як Library, а треба External Library. Це перемикається тут:
 
 Друге: у файлі SetupApplication.bat, що лежить в проекті, в папці bat, в рядку
call adt -package -target %TYPE%%TARGET% %OPTIONS% %SIGNING_OPTIONS% "%OUTPUT%" "%APP_XML%" %FILE_OR_DIR%
в кінець треба прописати
-extdir lib/
, де lib / — це шлях до того місця, де у вас лежать. ane
 Третє: в application.xml, який лежить в папці проекту, треба прописати айди розширення, приблизно ось так:
 
 
...
  <extensions>
    <extensionID>com.adobe.ane.gameCenter</extensionID>
    <extensionID>com.sticksports.nativeExtensions.Flurry</extensionID>
  </extensions>
</application>

Ці айдішнікі регістру і не завжди очевидні. Щоб напевно дізнатися extensionID треба відкрити файл. Ane як zip-архів і подивитися там всередину файлу \ META-INF \ ANE \ extension.xml — всередині тега і буде написана шукана рядок.
 
Тада! Тепер ми можемо використовувати нативні розширення. Просто пишемо, наприклад, import com.adobe.ane.gameCenter. * — І можна користуватися.
 
До речі, ремарка про Adobe Game Center ANE. Воно безкоштовне, воно є, але його використання призводить до того, що додаток буде падати при спробі відправити дані в геймцентр, за умови наявності авторизації в геймцентре і відсутності з'єднання з інтернетом. Адоби відмовчується з цього приводу, проблема відома вже як мінімум кілька місяців, але фіксів ніяких немає і незрозуміло коли будуть. До того ж воно не вміє показувати випливаючі зверху екрану банери про отримання ачівок. Загалом, краще ним не користуватися. Є інше ANE , теж безкоштовне, але йому потрібно iOS SDK для компіляції, тобто додаток з використанням цієї штуки не збере без маку. І є ANE за 70 баксів, посилання на яке я давати не буду, його і так гугл видає першим рядком. Більше нічого я знайти не зміг.
 
 
Крок 3. Один код — багато платформ
В той момент коли ми починаємо використовувати нативні розширення наш код перестає бути кросплатформним. Тобто ми не зможемо з одного і того ж коду зібрати флешку, яка запускається в браузері і флешку, яка запуститься на телефоні. А це сумно і нам цього не хочеться. Тестувати геймплей набагато зручніше у вигляді флешки прям на компі, що не збираючи щоразу ipa і не заливаючи гру на девайс. Для цього я придумав милицю… кривувато, але працює.
 
Я зробив копію файлу проекту в тій же папці. Наприклад, це файли Project.as3proj і ProjectMobile.as3proj. І копію файлу Document Class'a Main.as — MainMobile.as. Далі, в простому Project в якості document class'a залишився Main, а в ProjectMobile в якості document class виступив MainMobile. Потім, в Сінглтон Game я завів
public static var main:Class

і кожен Main устанвлівает значення цієї змінної рівною собі. Тобто в проекті звичайному клас Game вважає, що main — це Main, а в мобільному проекті він думає, що main — це MainMobile, причому звертатися до них можна просто як до main. У MainMobile ми імпортуємо все, що потрібно з. Ane, а в простому Main ми цього не робимо. Далі, коли з самої гри нам потрібно викликати якусь фішку, яка мобільна, ми робимо це, якщо існує відповідна змінна в main. Наприклад, відкриття геймцентра виглядає так:
 
if(main.gc){
		main.gc.showLeaderboardView()
	}

Якщо як main у нас зараз виступає не мобільний Main, то в ньому немає змінної gc і геймцентр показуватися не буде. При цьому сам клас Game, в якому це відбувається, взагалі поняття не має ні про який gamecenter, в ньому не імпортуються потрібні класи
 
Тепер ми можемо просто перемикаючись між проектами збирати або мобільну версію, або браузерную, при тому, що всі вихідні коди у нас загальні (крім Main.as, ясна річ).
 
 
Крок 4. Самий нудний.
Загалом, ми молодці, і зробили все, що хотіли. Додаток збирається, стабільно працює на наших девайсах і ми сповнені рішучості побити рекорди Flappy bird. Пора заливатися в AppStore. Але для цього треба ще кілька підготовчих кроків…
 
 Іконка
У папці icons лежать дефолтні іконки, їх треба замінити на правильні, від нашого застосування. Вони потрібні в різних розмірах. Автоматично згенерувати з одного файлу купу файлик поменше можна, наприклад, тут: makeappicon.com / Цей сайт приймає одну картинку 1024 * 1024 (саме в такому розмірі вам потрібна іконка для аппстора) і випльовує картинки всіляких розмірів. Варто перевірити application.xml, щоб там імена файлів соответсовавалі потрібними розмірами.
 
 Splash-screen
Там же, в папці icons лежать картинки СПЛЕШ — це те зображення, яке виводиться на екран на самому початку, поки вантажиться все інше. Там ще зазвичай лого фірми малюють. Їх просто треба зробити і зберегти сюди.
 
 Знову сертифікати
На першому кроці ви генер собі сертифікати для тестування, тепер вам знадобиться сертифікат для поширення, distribution або production (на сайті Еппл обидва ці слова використовуються для позначення одного і того ж). Робиться це абсолютно так само як і на першому кроці, навіть трохи простіше, тому з distribution-сертифікатом вам не знадобиться перераховувати девайси для провіжена — адже ви збираєте програма не для тестових девайсів, а для всіх користувачів аппстора! Загалом, отримуємо файли. P12 і. Mobileprovision і прописуємо їх у вже знайомий нам SetupApplication.bat, отримуємо щось на кшталт:
  
set IOS_DIST_CERT_FILE=cert\ios_dist.p12
set IOS_DEV_CERT_FILE=cert\ios_dev.p12
set IOS_DEV_CERT_PASS=*******
set IOS_PROVISION=cert\crushTest.mobileprovision
set IOS_DIST_PROVISION=cert\crushDist.mobileprovision
set IOS_ICONS=icons/ios

set IOS_DEV_SIGNING_OPTIONS=-storetype pkcs12 -keystore "%IOS_DEV_CERT_FILE%" -storepass %IOS_DEV_CERT_PASS% -provisioning-profile %IOS_PROVISION%
set IOS_DIST_SIGNING_OPTIONS=-storetype pkcs12 -keystore "%IOS_DIST_CERT_FILE%" -provisioning-profile %IOS_DIST_PROVISION%

Зауважу, що я тут додав рядок set IOS_DIST_PROVISION = cert \ crushDist.mobileprovision (і замінив в останньому рядку% IOS_PROVISION% на% IOS_DIST_PROVISION%), щоб не міняти провіжен кожен раз, перемикаючись між тестовими і фінальними збірками.
 
 AIR SDK 13
Можливо, цей пункт скоро втратить актуальність, але в даний момент, остання стабільна збірка AIR SDK — 4.0, яка була до лютого. А в лютому Еппл активувала нову політику, за якою додатки, які не вміють чогось там з ios7, не допускаються в стор. І якраз додатки зібрані в 4 SDK цього не вміють і в стор не допускаються. Зате це виправляє AIR SDK 13.0 beta (не варто лякатися різниці у версії, насправді тринадцятий — це наступна за 4й :) просто у adobe змінилася система нумерації версій). Для того щоб використовувати тринадцятий версію треба скачати її тут: labs.adobe.com / technologies / flashruntimes / air / і розпакувати архів в папку tools / flexsdk (так-так, все правильно air sdk вивалюємо в папку flexsdk), яка знаходиться там, де у вас встановлений Flash Develop (ну або туди, де у вас знаходиться flex sdk, якщо у вас все не за замовчуванням). І у файлі application.xml у другому рядку замінюємо цифру в кінці на 13.0, повинно вийти якось так:
<application xmlns="http://ns.adobe.com/air/application/13.0">

 
 
Крок 5. Останній.
Ура! Все готово. Залишилося просто запустити PackageApp.bat, вибрати там AppStore, ввести пароль від сертифіката, почекати хвилин 5 і в папці dist у нас виявиться файл. Ipa, готовий до заливки в магазин. І тут на сцену виходить ложечка дьогтю, про Которро я згадував на самому початку. У девелоперської панелі аппстора немає кнопки «Завантажити файл». Ми проробили 99% шляху на віндового компі, але врешті зустріли фінального боса, якого не можна вбити без мак-артефакту. Ніяк. І тут нічого не поробиш. Щоб залити повністю готове додаток в стор вам знадобиться мак, так. І на маці повинна бути тулза «App Loader», яка йде в комплекті з XCode. Можна завантажити образ віртуальної машини з усім ці добром. Або знайти брата свата одного, у якого є мак і скористатися ним. Сама тулза абсолютно інтуїтивна, і там все просто, головне просто отримати до неї доступ.
 
Цілком можливо, що завантажити додаток з першої спроби не вийде — особисто у мене постійно рвалося з'єднання, і це, кажуть, нормально. Треба просто проявити трохи наполегливості і в результаті все вийде. Тепер залишилося просто дочекатися поки додаток пройде еппловскій рев'ю… У мене на рев'ю пішло два дні, хоча знаючі люди кажуть, що зазвичай первинна перевірка займає пару тижнів, перевірка апдейтів — трохи поменше. Від сезону залежить, напевно.
 
 
Підсумки
Підводячи підсумки, можна зробити висновок, що:
 
     
  • писати і тестувати гру на флеше, не маючи маку — можна, причому досить зручно
  •  
  • для цього нам потрібен акаунт розробника за 99 баксів, інакше нам буде ніде брати сертифікати і ми не зможемо тестить додаток на справжньому пристрої
  •  
  • для викладання в аппстора мак (або віртуальна машина з Макосія) все-таки знадобиться
  •  
  • flash still alive :)
  •  
  
Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.