なぜか、FDT5 で .aneを利用したAIR for iOSアプリを、Distribution (app-store/ad-hoc)で書き出すと、実機で動いてくれない。
※「PropertieのFDT Mobile Propertie の iOS の Deplayタブ」 から書きだしたり、「自作のANT」で書きだしたりしてみたけど、うまくいかず。
※プロビジョニングや証明書はちゃんとDistribution用を使用している

.aneを利用しなければ動く。（xxx-app.xmlに-extdirを指定していても、as側で宣言しなければ大丈夫）
これで1週間ほどはまった。(´・ω・｀)

Flash Builder4.6 で書きだすと問題なく動作する。
ので、なにかFDTのバグ？なのだろうか？。

分かり次第追記予定。
だれか原因がわかる方、ぜひ@itozまで教えていただけると有りがたいです。

先日リリースされた FDT5 で モバイルアプリビルド機能 が強化され、
AIR アプリのプロパティ設定や、パブリッシュなどが、GUIで行えるようになりました。

その一部に Extentions タブがあり、
AIR Native Extenision (以下ANE) アプリをサクッとコンパイル出来るようになっています！
（この機能は FDT5 FREE でも利用可能！）

今までコマンド、 Ant などでやっていたのを考えると便利ですね！

ANEアプリコンパイル設定

ということで Android のバッテリー値を取得＆表示する ANE アプリを作成する手順を書いてみます。

[1]. ANE ファイルを用意。

ここに素敵なANEサンプルが多数公開されています。
http://extensionsforair.com/extensions/powerflasher-collection/

今回はこの中の「battery」を使わさせて頂きました。

[2]. Mobile Project を作成

File > New > New FDT Project > Mobile > AS3 でプロジェクト作成し
「aneフォルダ」を作成。（任意の名前でもOK）

[3]. ANEファイル、ライブラリの設置

[1]でDownloadしたbatteryフォルダ内の.aneファイルと.swfファイルをプロジェクトにコピー。

battery/extension/de.patrickkulling.air.mobile.extensions.battery.ane
＞「ane」フォルダへコピー

battery/extension/android_battery_extension.swc
＞「lib」フォルダへコピー
※これでExtensionのクラスにパスが通せるようになります

[4]. Extensions の設定

プロジェクトフォルダ右クリック ＞ Properties を選択すると下記のウィンドウが出てきます。

FDT Mobile Properties ＞ Android > Extensionsを選択。

「Extensions location」に「aneフォルダ」を選択。
「Extensions」に、battery/extension/descriptor_extensions.xml に記述されている「extensionID」 を追加。
※これでアプリケーション記述ファイルに自動的に extensionID が追記されます。

ANEの設定はここまで。
もうちょっとです。

AIR3.0コンパイル設定

ここからはAIR3.0でコンパイルするためのお決まり設定です。

[5]. コンパイル時定数を追加

「Run / Debug Configurations」を作成し、
Compiler Arguments タブの Use launcher specific compiler arguments を選択。
「-swf-version=13」を追記。

[6]. アプリケーション記述ファイルの修正

bin/xxxxxx-app.xmlの冒頭を
「<application xmlns=”http://ns.adobe.com/air/application/3.0“>」に変更。

設定は以上！

ANEを呼び出すドキュメントクラス

上記設定から、バッテリー値を取得＆表示するサンプルドキュメントクラスです。

package jp.itoz.ane.android.battery {
    import de.patrickkulling.air.mobile.extensions.battery.Battery;
    import de.patrickkulling.air.mobile.extensions.battery.event.BatteryEvent;
 
    import flash.display.Sprite;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.text.TextFormat;
 
    /**
     * ANE Android Battery Sample
     * @see http://extensionsforair.com/extensions/powerflasher-collection/
     */
    public class ANEBatteryApp extends Sprite {
        private var _tf : TextField;
        private var _bat : Battery;
 
        public function ANEBatteryApp() {
 
            // ----------------------------------
            // battery
            // ----------------------------------
            _bat = new Battery();
            _bat.addEventListener(BatteryEvent.UPDATE, onBatteryUpdate);
 
            // ----------------------------------
            // textfield
            // ----------------------------------
            _tf = addChild(new TextField()) as TextField;
            _tf.defaultTextFormat = new TextFormat(null, 20, 0xcc0000);
            _tf.autoSize = TextFieldAutoSize.LEFT;
        }
 
        /**
         * バッテリーイベント
         */
        private function onBatteryUpdate(event : BatteryEvent) : void {
            var d : Date = new Date();
            var stamp : String = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
 
            // @see http://www.adakoda.com/android/000140.html
 
            _tf.text = "update " + stamp + "\n";
            _tf.text += "バッテリー残量 " + event.level + "\n";
            _tf.text += "バッテリー最大値 " + event.scale + "\n";
            _tf.text += "バッテリー温度 " + (event.temperature / 10) + "度\n";
            _tf.text += "バッテリー電圧 " + event.voltage + "mV\n";
        }
    }
}

あとは コンパイルするだけ！

これでバッテリー値が取得できるサンプルANEアプリが完成しました。

今回のサンプル一式をアップしました。
FDT5 の File > import から Archive File で読み込んでください。

その他

FDT5 FREE のダウンロードはこちらから
（今回紹介した機能はFREEでも利用可）

FDT5 MAX だと、アプリケーション記述ファイルの設定もGUIから行えます。
（AppricationID や Permission、Aspect Ratio など）

その他 FTD5 から追加された機能はこちら
fdt.jp » FDT5がリリース。新機能一覧

FDT4.2 でプロジェクトテンプレートに新しい機能が追加されたので、
Progressionプロジェクトテンプレートをアップデートし、
FDT.jp に利用方法の記事を書きました。

ソースは Spark にアップしてあるほか、僕のGitHubにも上げてあります。

使ってみてバグなどありましたら@itozまでご報告いただける足り難いです。m(_ _)m

FDT を使い始めて最初につまずく壁。

「トレースが出ない !?」

そこで挫折する人多いのでは？ないでしょうか。
（※僕もそうでした）

FDT.jpに、おおよその考えられる原因を書きましたので、ご参考下さい。
fdt.jp » traceが出ません

FDT用 の プログレッション（4.0.22） プロジェクトテンプレートを作成し、スパークにコミットしたので、fdt.jpに利用方法などのエントリを書きました。

fdt.jp » Progression(4.0.22)用プロジェクトテンプレート

デフォルトで Compiler Argument が設定されているので設定後すぐに、デバッグビルドが出来るようになっています。

当サイトにアップしてある過去のバーションは取り急ぎそのままにしておきますが、今後Updateはsparkの方で行っていこうと思います。

FDTでおなじみの機能 Quick Fix が Flash Builder “Burrito”(以下FB) でも搭載されたと言うことで、昨日公開されたプレビュー版を使用してみました。

Adobe Labs – Adobe Flash Builder "Burrito"
下部の[Download Flash Builder "Burrito"]リンクからダウンロード。

結論からいうと今のところ FDT の QuickFix の方がまだ便利かな？という印象。

1. FDTの場合は [cmd+1]で次々と対象を移動してQuickFixしてくれますが、
FBの場合は選択中の行に対象が無いとQuickFix出来ません。
（FBにはリアルタイムエラー検知が無いから？かな）

2. 例えば hoge.fuga() で、fuga()メソッドが存在しない場合、
FDTだとQuickFixで対象クラスにfugaメソッドを作成できますが、FBだと出来ません。

FDT の QuickFix よりいい点としては、
1. ローカル変数 を メンバー変数 に変換できる
2. 変数のリネーム、ファイルのリファクタリングが出来る
と言ったところでした。

その他、違いがあるかもですが、追って調査中でっす。

FDT4でASDocをサクっと書き出せる、プロジェクトテンプレートを作成しました。

※追記2010.11.04 sparkにコミットしました。アップデートなど今後こちらにしていきます。
http://www.libspark.org/wiki/FDT4_ASDocProjectTemplate

[ 確認環境 MacOS 10.6.4 / FDT4 ]

使用方法

1. (macの場合)　ダウンロード後、解凍したフォルダを下記ディレクトリに設置。
/User/FDT/projectTemplates/Web/
※追記　FDT4スタンドアロンでインストールした場合は下記のフォルダになっています。(thx Alan)
User / Library / Application Support / FDT / projectTemplates

2. FDTを起動して　File ＞ New ＞ New Flash Project を選択し、出てきたウィンドウで「AsDoc Build」を選択。

3. 出来たプロジェクト内のsrcフォルダに、ASDoc化したいクラス群をコピー。

4. ant/asdoc_build.xmlを開き、6行目あたりで、flex sdkのパスを設定。

5. Window ＞ Show View ＞ Ant で Antウィンドウを開き、asdoc_build.xmlをドラッグドロップしダブルクリック！

これでASDocが作成されました！。（・∀・）

※Asdoc作成の場合はJRE設定をしなくてもANT実行が出来ますね。（なぜかはよくわかりませんが）

よく使っている、AS3のFDTテンプレート10個です。

「importや宣言って結局書かなきゃいけないから使うのメンドイよね?」と思ったあなた!
QuickFixで処理すればザクザクっと瞬殺で実装できまっすよ。（・∀・）

[1] 簡易スプライト作成

「あれっ?表示されるはずのMCが表示されない!?」なんて時に、その中にサクっと作って確認したり。

1
2
3
4

${name} = addChild(new Sprite()) as Sprite;
${name}.graphics.beginFill(0xcc0000);
${name}.graphics.drawRect(0,0,100,100);
${name}.graphics.endFill();

[2] 簡易テキストフィールド作成

何かとよく使います。

1
2

var ${_tf}:TextField = addChild(new TextField( )) as TextField;
${_tf}.text = "${cursor}";

[3] 簡易グラデーションボックス作成

背景にサクっと敷いたりする時に。

1
2
3
4
5
6
7
8
9

var gradType:String = GradientType.LINEAR;
var gradColors:Array = [ ${0xffffff} , ${0x0} ];
var gradAlphas:Array = [ 1, 1 ];
var gradRadios:Array = [ 0, 255 ];
var gradMrx:Matrix = new Matrix( );
gradMrx.createGradientBox( ${800},  ${600} , Math.PI/2, 0,0);
var gradSpread:String = SpreadMethod.PAD;
${this}.graphics.beginGradientFill( gradType , gradColors ,  gradAlphas , gradRadios , gradMrx ,gradSpread);
${this}.graphics.drawRect( 0 , 0, ${800}, ${600} );

[4] 配列を作る(要素番号指定で)

ループで作成できない配列作る時ってメンドいですよね。
下記だと、name とvalueの値が一気に指定できて便利。とりあえず10個

1
2
3
4
5
6
7
8
9
10
11

var ${name} : Array= new Array();
${name}[0]=${value};
${name}[1]=${value};
${name}[2]=${value};
${name}[3]=${value};
${name}[4]=${value};
${name}[5]=${value};
${name}[6]=${value};
${name}[7]=${value};
${name}[8]=${value};
${name}[9]=${value};

[5] 簡易ローダー作成

LoaderContext(true)にしているので、wonderflなんか用にサクっと使っています

1
2
3

${loader}= new Loader();
${loader}.contentLoaderInfo.addEventListener(Event.COMPLETE, loadCompleteHandler);
${loader}.load(new URLRequest("${cursor}"), new LoaderContext(true));

[6] ラジアン、角度、変換公式

覚えろって話ですが（ ´д｀; )、いつも忘れるので。

1
2
3

//radian<->angle
//var rad = angle *(Math.PI/180)
//var angle = rad * 180 / Math.PI;

[7] FlashVersを列挙する

デバッグ時などに何かと使えます。

1
2
3
4

var vars:Object = loaderInfo.parameters;
for (var i:String in vars) {
    _txt.appendText(i + "=" + vars[i] + "\n");
}

[8] プレイヤーのバージョンとタイプをトレース。

同じくデバッグ時などに何かと使えます。

1
2
3
4

trace( "************************************" );
trace( "[Player Version] " + Capabilities.version );
trace( "[Player Type]    " + Capabilities.playerType );
trace( "************************************" );

[9] Loggerテンプレート

@cellfusioinが作成したLoggerクラスを使用するためのテンプレート。
sosMaxと組み合わせると強力なログ出力環境が整います。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

// @see http://github.com/cellfusion/Logger
Logger.initialize(Logger.LEVEL_FATAL);
//Logger.initialize(Logger.NONE);
 
Logger.trace(${cursor});
 
Logger.debug(${cursor});
 
Logger.info(${cursor});
 
Logger.warning(${cursor});
 
Logger.error(${cursor});
 
Logger.fatal(${cursor});

[10] コンパイルオプションで一部のコードを無視させる。

詳細はこちらの記事を御覧ください。
FDTでコンパイル時に一部のコードを無視させる

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

 //-define=CONFIG::Debug,true
//-define+=CONFIG::Release,false
/*FDT_IGNORE*/
CONFIG::Debug
{
/*FDT_IGNORE*/
		trace( 'Debug' );
/*FDT_IGNORE*/
}
CONFIG::Release
{
/*FDT_IGNORE*/
		trace( 'Release' );
/*FDT_IGNORE*/
}
/*FDT_IGNORE*/

上記10個セットをダウンロード

動作確認環境 [FDT4 M3 / MacOS10.5]

2010.7.18 に東京てらこ6「SWF最適化・制作効率アップ術」で発表した内容です。

発表した内容

FDTでANTを使用し、操作一発で
1. swfコンパイル
2. FTPアップロード
3. Firefoxでリロード表示”する方法。
ついでにFirefoxで再生されたswfのトレースもFDT内で確認しちゃう。

サンプルデータ

利用方法

詳細はREADMEファイルを御覧ください。
また、このエントリを元に発表しましたのでご参考下さい。

そもそもANTを使用するメリット

自動化によるヒューマンエラーの防止。に尽きるかと思います。
ANTは設定するまでがちょっとメンドく、シンプルなプロジェクトであれば、作成するまでもないかもしれません。
が、少し複雑なプロジェクト構成なら設定する価値があります。

例えばカスタムクラスAを継承した、ドキュメントクラスB,C,D,Eがあったとして、Aを修正しB,C,D,Eから全てswfを書き出し直し、アップしなおし、クライアント確認に出す。等の場合。
これを使用することでミスが起こりにくくなります。
プロジェクトも後半になると、頻繁にこういった作業を行うかと思いますので、最初に作成しておくと、後々楽だったりします。

その他

元エントリにプラスアルファされている内容

<fdt.startDebugger>タスクを利用し、FireFoxで再生されたswfのトレースを、そのままFDTで確認出来るようにしています。

ANTの実行にショートカットを割り当てる!

僕の場合、環境設定 > General > Keysで”Run Last Launched External Toool”に「Command+Shift+Return」を割り当てています。
これにより操作一発で全てを実行できますし、ローカル確認、サーバー確認の切り替えが容易になります。

FDT Progressionプロジェクトテンプレートをバーションアップしました。
※FDT4 Millestone2以上で利用可

Ver2.5リリースノート

前バージョンからの主な変更点など。

ANTからindex.htmlを生成

ANTで下記パラメータを設定しindex.htmlを生成できます。

• titleタグ
• swf埋め込み時のサイズ
• 背景色
• GoogleAnalyticsのID
• 書き出しバージョン

ANTに設定必須だったProject名を設定不要に

具体的にはANTのbasenameタスクを使用しルートのプロジェクト名を取得するようにしています。

<basename property="flashproject.name" file="${basedir}/../"/>

使用にあたって注意点

ANTを実行するたびにindex.htmlが上書きされます。

上書きしたくない場合、下記行を削除してください(デバッグとリリースの2箇所)

<antcall target="Create index.html"></antcall>

ANTを使用せずにコンパイルする場合はCompilerArgumentsを設定。

これは前バージョンからですが、詳細は src/index.as のコメントを参考下さい。

アップデート履歴