FLASHのお勉強_FLASH/Airでアンドロイドアプリに変換

　Flashで作成したムービーを CS5 と Air を使ってパブリッシュすれば、apk 拡張子を持ったアンドロイドアプリが、簡単に出来上がる。　しかし、やったことがなければ、最初に戸惑うことも確かであるので、ここでは、apk フィルの作成・表示までのステップを記述したいと思う。
　ここで使用したアンドロイドデバイスは、softbank/sharp のガラパゴス（003sh）で、android 2.2 搭載機である。　多少他の機種と違ったところがあるかもしれないが、大筋では共通していると思われる。
　また、ここでの記述は、あくまでも現時点の話であって、デバイスもこれに関連するソフトも今後急激に発展を遂げるであろうから、常にそれを念頭に見守っている必要があるであろう。
　以下に示すサンプルは、テスト用ともいうべきシンプルな例であり、参考までに供するものである。

(1)PCへの Adobe Flash Professional CS5 Extension for AIR 2.5 (beta) のインストール

　上記リンクページ、Download and Discuss の Download the Flash Professional CS5 Extension for AIR 2.5 からダウンロードすると、自動的に、Adobe Extension Manager が立ち上がってPCへのインストールが行われる。
　これがインストールされると、FlashCS5の「ファイル」「新規」で「Adobe AIR2」を選ぶと、プロパティタブに「Adobe AIR 2.5 設定」という項目が現れ、編集をクリックしてあらわれたウインドウで設定が可能になる。

(2)PCへのドライバーのインストール

　PCにデバイス接続のためのドライバーをインストールする。（003shの場合は「003SH用USBドライバ」と「ADB USBドライバ」）。
　まず、USBドライバをインストールすると、Android ADB Interface がありませんという警告が出る。これを無視して、次に、DLしたADBのzipファイルをどこかに解凍する。デバイスマネージャーでその他のデバイスに表示されている「Android ADB Interface」について、解凍したADB USBドライバのフォルダを指定して、ドライバーの更新を実行する。
　ドライバインストール後に再起動が必要。

(3)PCのFLASHでの設定

　まず、「パブリッシュ設定」でFlashのplayerに「AIR android」を選び、次に「設定」タブで設定を行う。この設定は、プロパティタブの「Adobe AIR 2.5 設定」「編集」からも行える。　スクリプトはas3.0。
　この設定の詳細は、ユーザーガイドの「Adobe Air のパブリッシュ」を参照されたい。
デブロイタブの「証明書」では、「作成」で自己署名証明書を作成すればパブリッシュ可能になるが、自己署名証明書についての詳細は、AIRサポートページ「AIRアプリケーションへの署名」を参照のこと。
　やはりデブロイタブの「パブリッシュ後」で「接続しているアンドロイドデバイスにアプリケーションをインストール」にチェックを入れるとアプリケーションがパブリッシュと同時にUSB接続中のデバイスにインストールされ、アプリケーションアイコンも登録・表示される。

(4)アンドロイドデバイスでの準備

　マーケットから Adobe AIR をダウンロードしてインストールしておく（無料）。
　USBデバックを可能にしておく。（003shの場合は、MENU→設定→アプリケーション→開発より「USBデバック」にチェック）

(5)アンドロイドデバイスへのインストールと表示（（３）のパブリッシュと同時にインストールしなかった場合）

　PC内にパブリッシュされた apk ファイルをUSB接続（通常のマウント接続）したアンドロイドデバイスの適当なフォルダ（例えばPRIVATEフォルダ内に作成したFLASHフォルダ）内にコピーする。
　次に、アンドロイドデバイスでファイルマネージャー（筆者はマーケットからDLした File Manager という無料アプリを使用）を起動し、コピーした apk ファイルをタッチして起動すると、このアプリをインストールしますかというメッセージが出る。　「はい」と喜んで返事すると、アプリがインストールされ、アプリが起動する。　また同時に、アプリ表示画面の最後のページにアイコンが登録表示される。（先ほどの設定画面で自前のアイコンを登録することもできる）　このアイコンのタッチでもアプリが起動する。

SAMPLE（マウスのクリック、ロールオーバー、ロールアウト、MOUSE_DOWN、MOUSE_UP、MOUSE_MOVE ）

<ステージの準備>
●320*480のステージ（24fps）を設定（背景色は任意）
●画面上部に静止テキストで、Test for Android　と記入。
●コンポーネントからライブラリーにButtonをD&Dで導入する。
●画面中央部に、多角形ツールで星形を描き、シンボルに変換、
インスタンス名を star とする。

<デバイスでの表示結果>
右に表示したFlashを apk ファイルに変換、デバイスにインストールして表示動作確認した結果を以下に示す。
●ロールオーバー、ロールアウトは指でタッチし、画面から離さないで
オーバー、アウトさせると対応する。
●クリックは、指でタッチしすぐ画面から離すと対応する。
PCでのonReleaseと同じ挙動で、この場合は、start_btnリリースで
（指が離れると）星が回転し、stop_btnリリースで停止する。
●MOUSE_DOWN、MOUSE_UP、MOUSE_MOVEは、それぞれ、指で画面をタッチする、指を画面から離す、タッチしたまま動かすに対応する。

<apk ファイルのダウンロード>
右に表示したフラッシュファイルに相当する apk ファイルは　こちら　からダウンロードできます。　アプリとしての価値はありませんが、インストールや動作チェックの参考にしたい方はお使いください。
(もし拡張子が zip であったら、解凍せずに apk に変えてください)

スクリプト （as3.0）タイムラインFRAME１に記述


import fl.controls.Button;

import flash.events.MouseEvent;

import flash.filters.GlowFilter;



var glow:GlowFilter = new GlowFilter(0xff0000,0.4,10,10,8,3);

var startFlag:Boolean = false;



//STARTボタンの表示、インスタンス化、イベント定義

var start_btn:Button = new Button();

addChild(start_btn);

start_btn.label = "START";

start_btn.move(30,70);

start_btn.addEventListener(MouseEvent.CLICK, playStart);

start_btn.addEventListener(MouseEvent.ROLL_OVER, startOver);

start_btn.addEventListener(MouseEvent.ROLL_OUT, startOut);

function playStart(event:MouseEvent) {

    startFlag = true;

}

function startOver(event:MouseEvent) {

    start_btn.filters = [glow];

}

function startOut(event:MouseEvent) {

    start_btn.filters = null;

}



//STOPボタン

var stop_btn:Button = new Button();

addChild(stop_btn);

stop_btn.label = "STOP";

stop_btn.move(180,70);

stop_btn.addEventListener(MouseEvent.CLICK, playStop);

stop_btn.addEventListener(MouseEvent.ROLL_OVER, stopOver);

stop_btn.addEventListener(MouseEvent.ROLL_OUT, stopOut);

function playStop(event:MouseEvent) {

    startFlag = false;

}

function stopOver(event:MouseEvent) {

    stop_btn.filters = [glow];

}

function stopOut(event:MouseEvent) {

    stop_btn.filters = null;

}



//星の回転

stage.addEventListener(Event.ENTER_FRAME, starRotation);

function starRotation(event:Event) {

    if (startFlag) {

        star.rotation +=  20;

    }

}



//マウス操作とｘ軸方向の移動

stage.addEventListener(MouseEvent.MOUSE_DOWN, mDownHandler);

function mDownHandler(event:MouseEvent):void {

    var preMousex = mouseX;

    stage.addEventListener(MouseEvent.MOUSE_MOVE, mMoveHandler);

    function mMoveHandler(event:MouseEvent):void {

        var movex = mouseX - preMousex;

        star.x +=  movex/3;

        preMousex = mouseX;

    }

    function mUpHandler(event:MouseEvent):void {

        star.x +=  0;

        stage.removeEventListener(MouseEvent.MOUSE_MOVE,mMoveHandler);

    }

    stage.addEventListener(MouseEvent.MOUSE_UP, mUpHandler);

}

HOME　　　お勉強総リスト

このページのコンテンツには、Adobe Flash Player の最新バージョンが必要です。