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