AIR2.7でAIR for iOSを試してみた

by ton

2011/7/9 FxUG 名古屋勉強会

1

• 名前 : とん

• Twitter : ton1517

• blog : ton-up blog

• 豊橋技術科学大学

知識情報工学課程 4年

2

• SDKのダウンロードから

iPhoneで動かすまでの流れ

• すべてコマンドラインで

• iPhoneで動かすには

Apple iOS Developer Programの登録が必要

(10800円/年)

3

• AIR SDKを使ってiOSへ書き出し対応

(AIR 2.6 SDKから)

• OS– iOS 4 以上

• Device :– iPhone 3GS, iPhone 4

– iPad, iPad2

– iPod Touch 第3世代、第4世代

4

• iOS上の描画機能最適

– AIR2.6に比べてCPUでの描画パフォーマンス

が最大4倍高速化

(比較ビデオ 40秒あたりから)

• iOS用インタープリターモード

5

• Flex SDK(7/9時点で最新はFlex 4.5.1)

• AIR SDK

6

• Windows

– AIR SDKフォルダの中身を

Flex SDKフォルダの中にコピペ

• Mac

– コマンドラインから

cp -rf AdobeAIRSDK/ flex_sdk_4.5

7

• Windows

– システム環境変数のPathに

Flex SDKのbinまでのパスを追加

• Mac

– シェルにFlex SDKのbinまでのパスを追加

8

• コマンドラインで

パスが通ってるか確認

mxmlc –version

adt –version

バージョン情報が出てくればOK

9

Apple iOS Developer Programの登録が

必要 (10800円/年)

iPhone 開発ファイルの入手と操作 参考

10

• 好きな環境でflashを作る

• Windowsでフリーの開発環境

FlashDevelopがオススメ

11

• 画面サイズ

• 画面の回転

• ボタン、テキストの大きさ

• GPUモード

• AIR for iOSでの制約

• バグ

12

フルスクリーン縦向き

フルスクリーン横向き

ステータスバー縦向き

ステータスバー横向き

iPad 768×1024 1024×768 768×1004 1024×748

iPhone 3GS 320×480 480×320 320×460 480×300

iPhone 4 640×960 960×640 640×920 960×600

13

• 自動回転を許可するかstage.align = StageAlign.TOP_LEFT;

stage.scaleMode= StageScaleMode.NO_SCALE;

• resizeイベントの監視

• 縦画面と横画面でのデザイン

14

• 小さいボタンは避ける

• デスクトップよりも文字を大きく

15

• CPUモード

すべての描画をCPUで行う

• GPUモード描画をGPUで行う

特殊なコーディングなしで高速化可能

16

• 以下はGPUモードでは未サポート

– Flex フレームワーク

– フィルター、PixelBenderのブレンド、塗り

– ブレンドモードの内、レイヤー、アルファ、

消去、オーバーレイ、ハードライト、

比較（明）および比較（暗）

etc...

17

• 以下のものは使用できない

– iPhone標準UI

– ActionScriptを含んだSWFの読み込みや埋込

み

– プッシュ通知

– バッチの表示

– アプリ内課金

– GameCenter etc...

18

• Loader.loadBytes が iOS で失敗する

• TextField が textInput イベントを送出しない

• 横長モードで開始すると

stage.orientation の値が誤って返される

etc... (AIR2.7リリースノート参照)

19

• アプリのアイコン

グレア効果は自動的に付けられる

• 起動時のスプラッシュ画面

アプリの初期状態のスクリーンショット

にすると良い

(アプリケーションアイコン参照)

20

• 29 x 29 iPhoneのスポットライト検索結果

• 48 x 48 iPad のスポットライト検索結果

• 57 x 57 iPhone3GSのホーム画面

• 72 x 72 iPad のホーム画面

• 114 x 114 iPhone 4のホーム画面

• 512 × 512 iTunes 表示表示用

21

• iOS用にアプリケーションの設定を記

述したxmlを用意する必要がある

• アプリ名-app.xml

• テンプレート

iPhone-app.xml

22

• できること

– デバイスの回転

– 画面のサイズ

• 起動

adl iPhone-app.xml

23

• 画面サイズの指定-screensize オプション

iPhone

iPhoneRetina

iPad

adl –screensize iPhoneRetina iPhone-app.xml

ADL を使用したデバイスシミュレーション

AIR Debug Launcher（ADL） 参考

24

• swfをiPhoneアプリのipaファイルに変換

adt –package

–target <targettype>

-storetype pkcs12

-keystore <*.p12>

-storepass <password>

-provisioning-profile <*.mobileprofile>

<*.ipa>

<*-app.xml>

<*.swf>

<icons>

<files> ...

25

例

adt –package

–target ipa-debug

-storetype pkcs12

-keystore private_key.p12

-storepass hogehoge

-provisioning-profile Test.mobileprofile

Hoge.ipa

Hoge-app.xml

Hoge.swf

icons/

assets/

26

• ipa-ad-hoc：アドホック配布用

• ipa-app-store：Apple App Store 配布用

• ipa-debug：デバッグ情報を含むパッケージ

• ipa-test：最適化やデバッグ情報を含まずにコンパイルされた iOS パッケージ

• ipa-debug-interpreter：ipa-debugと同等

コンパイル時間が短くなる コードの実行が遅い

• ipa-test-interpreter：ipa-testと同等

コンパイル時間が短くなる コードの実行が遅い

27

1. ipaファイルをダブルクリックまたは

iTunesにドラッグ＆ドロップ

2. iPhoneと同期

3. 完了

28

• 実機で動かしながらデバッグ

– breakポイントの設定

– traceログ

– エラーメッセージ

29

1.swfをデバッグビルド

2.-targetオプションをipa-debugに

3. -connectオプションでIP指定

4.fdbを起動し待機

5.実機でアプリを起動

30

• fdbが文字化けする人

ターミナルの文字コードをShift-JISに

OR

Flex SDKのbinフォルダにあるfdbを開く

最終行javaコマンドの後ろに

-Dfile.encoding=UTF-8を追加

java -Dfile.encoding=UTF-8

$VMARGS ...31

32

• ワープっぽいなにか

• SquareLines

• HueCircleTest 色相環テスト

• 以上の3つをiPhone4で動かしている

様子

• YouTube - AIR2.7 で AIR for iOS

33

• 結構いける

• バグに注意

• Macなしで全部できる

• Flasherなら今すぐ

iPhoneアプリが作れる!

34

35