無料で作るケータイFlash（Flash Lite2/3）

• 開発ツールを揃えよう！
• 開発ツールのセットアップ
• 待ち受けFlashを作る
• ズームする待ち受けFlashを作る

ケータイFlash(Flash Lite 2/3)対応端末が、今や非常に幅広いことに驚きます。携帯電話は当然のこと、MP3プレイヤーなどの携帯デバイス、ゲーム機のWii/PS3、無線LAN内蔵の次世代目覚ましのChumbyなど多くの環境で動かすことができます。本連載では、無料のツールを組み合わせて Flash Lite 2/3 に対応したアプリを作る方法を紹介します。

おさらいと今回の内容

前回は、Flash Lite 2/3 を作ることのできるオープンソースのソフトをいろいろ紹介しました。mtasc や swfmill といったツールが何をするものなのか紹介しました。今回は、MTASC と swfmill の開発環境のセットアップ方法を紹介したいと思います。

MTASC で Hello World

それでは、はじめに、ActionScript 2.0 コンパイラの「MTASC」を使って、Hello, World を表示するところまで、手順を追って紹介します。

まずは開発用エディタFlashDevelopをインストールしよう！

ここでは、一番簡単にやる方法として、Windows + FlashDevelop を利用して作業してみます。(MacやLinuxな人は、次の項目を見てください。) FlashDevelop は、ActionScript を記述するのに最適の開発用エディタです。前回も紹介しましたが、Adobe Flash 標準のエディタよりずっと賢いので、Adobe Flash を持っている人でも、FlashDevelopと併用している人もたくさんいます。

• FlashDevelop (Windows専用)は以下のサイトから入手可能です。
• http://www.flashdevelop.org/community/

※英語なので、ちょっと抵抗があるかもしれませんが、上記ページの Information のタブにある「Releases」をクリックします。そして、「FlashDevelop 3.x.x xxx released」の記事を見ると、ダウンロード先のアドレスが記述されています。

また、.NET Framework2.0が必要になります。もし、入っていなければインストールしてください。

ダウンロードができたら、インストーラーを実行します。[Next]ボタンを何度かクリックしたら、特に困ることなくインストールが完了すると思います。

次に mtasc をインストールしよう！

そして、次に、ActionScript2.0 コンパイラの MTASC をインストールすることになるだろうと、思うかもしれませんが、実は、FlashDevelop をインストールすると、もれなく、MTASC が組み込まれますので、別途インストールする必要はありません！！

しかし、FlashDevelop に抵抗がある人や、Mac OS X/Linuxを使っている人のために、MTASC のインストールについて書いておきます。

• MTASC (Windows/Mac OS X/Linux)は以下のサイトからダウンロードできます。
• http://www.mtasc.org/

ダウンロードしたら、ZIPファイルを解凍します。そして、適当なフォルダにコピーして、そのディレクトリにパスを通します。

FlashDevelop でプロジェクトを作ろう！

それでは、FlashDevelop の手順に戻ります。まずは、FlashDevelop を起動します。次に、新規プロジェクトを作ります。そのためには、メインメニューから[Project] > [New Project] をクリックします。そして、[ActionScript2]のカテゴリから「AS2 Project」を選択します。

ここでプロジェクト名は「HelloWorld」にして、[OK]ボタンを押します。

メインクラスを作ろう！

次にいよいよ、ActionScript2.0を記述します。ここまでの手順で、MTASC のメインクラスの雛型が完成しています。画面右側に出ている[Project]のパネル(Project Manager)の src の中にある、Main.as をダブルクリックします。

このまま、ツールパネルの実行ボタン（あるいはメニューから[Project]>[Test Movie])をクリックすると、コンパイルが行われて、内蔵ブラウザに、真っ白なSWFファイルが表示されます。

さて、何も表示されないのでは寂しいので雛型に手を加えて、Hello World を完成させてみます。以下のプログラムのように書き換えてみて、再度、コンパイル＋実行をしてみます。

class Main
{
	public static function main(swfRoot:MovieClip):Void
	{
		// --- ここから追加
		_root.createTextField("a_txt", 1, 0, 0, 200, 300);
		_root.a_txt.text = "Hello, World!";
		// --- ここまで追加
	}

	public function Main()
	{
	}
}

小さい文字で、Hello と表示されたことと思います。

Main.as には、Mainクラスを記述するという決まりになっています。つまり、ファイル名とクラス名は一致させる必要があります。これは、Java のクラスの作り方と似ています。

MTASCでは静的関数(static function)の main() 関数がエントリポイントになっています。一番はじめにこの関数が実行されます。

ここで追加した2行ですが、１行目では、テキスト表示用のテキストフィールド(TextField)を生成し、2行目でそこに文字を設定しています。

_root.createTextField("a_txt", 1, 0, 0, 200, 300); // --- (*1)
_root.a_txt.text = "Hello, World!";                // --- (*2)

Flash には、文字を表示するためのテキストフィールド(TextField)や、図形や画像を表示するためのムービークリップ(MovieClip)が用意されています。これらのオブジェクトはツリー状に配置されます。

MovieClip には、自身の子要素としてテキストフィールドを作成する「createTextField()」や、ムービークリックを作成する「createEmptyMovieClip()」というメソッドが用意されています。

例えば、顔を描画するときには、顔の輪郭を配置し、その上に目や口や鼻といったパーツ(MovieClip)を配置します。そして鼻の上には穴のパーツを配置するという具合に、ツリー状に配置することで顔を完成させるのです。

+- 顔の輪郭
    |- 目
    |- 口
    |- 鼻
        |- 鼻の穴

プログラム中の(*1) では、_root (FlashのトップレベルのMovieClip)に、a_txt という名前の MovieClip を追加しています。(*2) を見ると分かりますが、追加された a_txt を操作する場合には、_root.a_txt という名前でアクセスすることができます。この text に値を代入することにより、画面に文字が表示される仕組みとなっています。

携帯電話で動かしてみる

それでは、実際に携帯電話で動くように、設定を変えてみます。FlashDevelop のメニューから[Project]>[Properties]をクリックすると、コンパイル設定を変更するダイアログが出てきます。この中の[Output]タブで、Platform の Target を、Flash Player 7 に設定します。これで、FlashLite2 に対応するSWFファイルが作れます。もし、FlashLite3 に対応させるには、Flash Player 8 に設定します。

次に、General の Dimensions を携帯電話の画面サイズに設定します。 以下のページを見ると、Docomo の携帯電話の画面サイズが一覧で示されています。この中からターゲットとなりそうな画面サイズを考えて決定すると良いでしょう。

• Docomo > サービス機能 > 画面領域
• http://www.nttdocomo.co.jp/service/imode/make/content/spec..

一般的には、QVGA [240×320] か、WQVGA [240×400] に合わせて作ることになると思います。ここでは、240×240 に設定してみましょう。（ちなみに、この値をケータイFlash配布サイトに登録されているケータイFlashを解析してみたところ、このサイズのものが多かったので、これに合わせると良いでしょう。）

また、ケータイFlashでは処理速度が遅いので、コマ落ちが生じることがあります。そこで、Framerate も、12など小さな値にしておく必要があります。

設定例

次に、携帯電話に転送して動くかどうか確認してみましょう。転送の方法には、いくつか方法があります。

• ホームページにアップしておいて携帯電話のブラウザでアクセスする
• メールに添付して開く
• SDカードなどにコピー
• 赤外線やBluetoothで転送する

最後のSDカードにコピーする方法は、パケット代もかからず非常に手軽なのですが、機種によって、Flashを認識できるディレクトリが違いますので、試行錯誤が必要かもしれません。（適当なFlashファイルをSDカードに保存してみてどこにコピーされているのか確認してみましょう。）

また、赤外線やBluetoothが使えるなら、SDカードを差し替えることなく転送することができるので、パケット代節約派の筆者は個人的には一番重宝しています。

実際に、Hello, World のSWFファイルを実行してみたところを、別の携帯電話で撮影したのが以下の写真です。

まとめ

以上、今回はMTASCを利用してケータイFlashを作ってみました。ActionScript2.0は、JavaScriptにクラスの概念を導入した言語です。Javaに慣れていると、ちょっと癖があるように感じるかもしれませんが、ちょっと文字を表示したり、画像を動かすくらいなら、それほど難しくありませんので、そのあたりから挑戦してみると良いでしょう。

今回は、文字を表示しただけで終わってしまいましたので、次回は、swfmill など他のツールと MTASC を併用して絵を動かしてみたいと思います。お楽しみに。