2012年4月30日月曜日

AIR3.2とStarlingFrameworkでスクロールリストコンポーネント



AIR3.2とStarlingFrameworkを利用したスクロールリストを作成しています。
リストの項目は画面外へ出ると破棄しているので
リストの件数が多くても、メモリ消費を抑制できる効果があります。

2012年4月8日日曜日

"AIRForiOSアプリをUSB接続でデバッグ"

まとめました。
1.iOSサンプルアプリでUSBデバッグをする(リンク先へ)
2.AIR3.3Beta1の構築(リンク先へ)
3.iOSUSBSampleのソース作成とアプリケーション定義ファイルの設定(リンク先へ)
4.iOSUSBSampleプロジェクトのビルド(リンク先へ)
5.iTunesにipaファイルの登録とiOS端末へ同期する(リンク先へ)
6.iOS端末のデバイスハンドルを取得(リンク先へ)
7.fdbでiOS-USBデバッグ手順1(リンク先へ)
8.fdbでiOS-USBデバッグ手順2(リンク先へ)
9.fdbでiOS-USBデバッグ手順3(リンク先へ)

fdbでiOS-USBデバッグ手順3

1.デバッグを行う
fdbでiOS-USBデバッグ手順1(リンク先へ) で実行したfdbコマンドに
ブレークポイントを設定して「continue」と入力し、セッションを再開してください。
と追加で表示されます。
(fdb) continueと入力すると、アプリケーションが起動します。
$fdb -p 7936
Adobe fdb (Flash Player Debugger) [ビルド 23201]
Copyright (c) 2004-2011 Adobe, Inc. All rights reserved.
(fdb) run
Player に接続しようとしています
Player が接続されました。セッションを開始しています。
ブレークポイントを設定して「continue」と入力し、セッションを再開してください。
[SWF] iOSUSBSample.swf - 644 バイト (解凍後)
(fdb) continue

iOSUSBSample-debug(実際はiPhoneまたはiPadの画面です)

赤い矩形にタッチする事で、fdbにtrace文が表示されます。
$fdb -p 7936
Adobe fdb (Flash Player Debugger) [ビルド 23201]
Copyright (c) 2004-2011 Adobe, Inc. All rights reserved.
(fdb) run
Player に接続しようとしています
Player が接続されました。セッションを開始しています。
ブレークポイントを設定して「continue」と入力し、セッションを再開してください。
[SWF] iOSUSBSample.swf - 644 バイト (解凍後)
(fdb) continue
[trace] RedRectClick
[trace] RedRectClick
[trace] RedRectClick
赤い矩形にタッチした回数だけ、trace文が表示されます。

fdbでiOS-USBデバッグ手順2

1.iPhoneまたはiPadにインストールしたiOSUSBSample-debugを起動します
デバッグを行う為の待機状態になります。

2.idbで転送を行います
ターミナルの新規タブまたはウィンドウを作成し、idbを実行します。
$cd '/Applications/Adobe Flash Builder 4.6/sdks'
$air3_3beta/lib/aot/idb/idb' -forward 7936 7936 1

fdbでiOS-USBデバッグ手順1

1.fdbを実行します
fdbにポート指定をして実行後、(fdb) runを入力します。
コマンド実行後もターミナルは閉じずにこのままにして下さい。
$ fdb -p 7936
Adobe fdb (Flash Player Debugger) [ビルド 23201]
Copyright (c) 2004-2011 Adobe, Inc. All rights reserved.
(fdb) run
Player に接続しようとしています

fdbが文字化けする場合
FlexSDKのbinフォルダにあるfdbファイルをテキストエディタで編集します。
-Dfile.encoding=UTF8を設定します。
java -Dfile.encoding=UTF8 $VMARGS $D32…(続く)

iOS端末のデバイスハンドルを取得

1.idbコマンドに必要なデバイスハンドルを取得します。
maciPhoneまたはiPad等のiOS端末がUSBで接続します。
デバイスのHandleを取得するコマンドを実行します。
(実際にはUUIDは英数字が並んでいます)
$cd '/Applications/Adobe Flash Builder 4.6/sdks'
$air3_3beta/lib/aot/idb/idb -devices

List of attached devices
Handle    UUID
    1    [*******************************************]
この端末のHandleは1です

iTunesにipaファイルの登録とiOS端末へ同期する

iOSUSBSample.ipaをiTunesのライブラリへドラッグし
アプリをiOS端末にインストールします。


iOSUSBSampleプロジェクトのビルド

1.FlashBuilderでビルドを行い、swfを生成します。
プロビジョニングファイルと証明書ファイルを作成し
bin-debugフォルダにコピーします。

2.ipaファイルを生成します。
adtコマンドを使用します。USBデバッグを行うためのポートを指定しています。

ipaファイル作成コマンド
$adt -package -target ipa-debug
-listen 7936 -storetype pkcs12
-keystore [証明書ファイル]
-storepass[パスワード]
-provisioning-profile [プロビジョニングファイル]
[ipaファイル] [アプリケーション定義ファイル] [swfファイル]

iOSUSBSampleのipaファイル作成コマンド
$adt -package -target ipa-debug
-listen 7936 -storetype pkcs12
-keystore sample.p12
-storepass sample
-provisioning-profile sample.mobileprovision
iOSUSBSample.ipa iOSUSBSample-app.xml iOSUSBSample.swf

3.ipaファイルの完成
adtコマンドを行い数分後、ipaファイルが生成されます。

2012年4月7日土曜日

iOSUSBSampleのソース作成とアプリケーション定義ファイルの設定

1.プロジェクトファイルの作成
ActionScriptモバイルプロジェクトを新規作成します。
プロジェクト名は、iOSUSBSampleにします。
sdkはAIR3.3Beta1を指定します。

iOSUSBSample.as
package
{
 import flash.display.Sprite;
 import flash.display.StageAlign;
 import flash.display.StageScaleMode;
 import flash.events.MouseEvent;

 public class iOSUSBSample extends Sprite
 {
  public function iOSUSBSample()
  {
   super();

   stage.align = StageAlign.TOP_LEFT;
   stage.scaleMode = StageScaleMode.NO_SCALE;

   drawRect();
  }

  private function drawRect():void
  {
   var rect:Sprite = new Sprite();
   rect.name = "RedRect";
   rect.graphics.lineStyle(1,0xff0000,1);
   rect.graphics.beginFill(0xff0000,1);
   rect.graphics.drawRect(0,0,200,200);
   rect.addEventListener(MouseEvent.CLICK,rectClickHandler);

   addChild(rect);
  }

  protected function rectClickHandler(event:MouseEvent):void
  {
   var rect:Sprite = event.target as Sprite;
   trace(rect.name + "Click");
  }
 }
}

2.アプリケーション定義ファイル
applicationのバージョンが3.3になります。

iOSUSBSample-app.xml


プロビジョニングファイルの設定と同じようにidに設定を行います。

iOSUSBSample-app.xml

com.sample.iOSUSBSample

AIR3.3Beta1の構築

1.AdobeLabsよりAIR3.3Beta1をダウンロードします
Adobe AIR 3.3 Beta(リンク先へ)

Windows版SDKの登録方法(当ブログ)(リンク先へ)
Windows版FlashBuilderのSDKにAIRを追加する方法(当ブログ)(リンク先へ)

2.bash_profileを設定して、AIR3.3Beta1のadtコマンドを実行できるようにします
$cd ~
$vi .bash_profile
.bash_profileの設定例
PATH='/Applications/Adobe Flash Builder 4.6/sdks/air3_3beta/bin'
変更を行った.bash_profileを反映します
$source .bash_profile

3.adtのバージョンが3.3.0.3230になります。
$adt -version
3.3.0.3230

iOSサンプルアプリでUSBデバッグをする

AIR3.3からiOSアプリをUSB接続状態で、デバッグが行えるようになります。

1.サンプルアプリの内容
Spriteで作成した矩形をタッチした時にtrace文を表示します


2.注意
AIR 3.3 Beta1を使用します。
実行環境 MacOSX 10.7.3
開発環境 FlashBuilder4.6
iOS Developer Programに参加している必要があります。

この作成手順は2012年4月時点のものです。今後も仕様変更の可能性があります。
ソースと関連ファイルの使用結果について、一切の保証と責任は負いません。

3.参考にさせて頂いたホームページ
Flash Player 11.3 と Adobe AIR 3.3 ベータ版の公開(リンク先へ)
FDB による USB 経由のリモートデバッグ(リンク先へ)
デスクトップ AIR アプリケーションのデバッグ(リンク先へ)