実際にプロジェクトを作成し実行してみましょう。
[Project]-[New Project]で[Installed Template]の中から[Flex 3 Project]を選び、[Name] に適当なプロジェクトの名前、[Location]にプロジェクトを保存する場所を選びます。
[Create directory for Project]にチェックを入れると[Location]の場所に[Name]で指定したプロジェクト名のサブフォルダが出来てその中にプロジェクトが作成されます。
今回は[Name]の所に"HelloWorld"と入力して作成してみましょう。
[OK]ボタンを押したらプロジェクトが作成されます。
プロジェクトが作成されるとプロジェクトパネルには図のようなサブフォルダで構成されるのがわかります。
ここでsrcフォルダを展開するとMain.mxmlというファイルが既に作られているのがわかります。ファイル名をダブルクリックするとコードエディタで開く事ができます。開いたファイルには次のように既にアプリケーションの枠組みが書かれています。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
</mx:Application>
これに必要なコードを追加して開発を進めます。今回はラベルを1つ追加してみます。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Label text="Hello Flex World." />
</mx:Application>
"Label"と打つだけでかなり補完や候補の表示が行われるのがわかると思います。
では[F5]キー、または[Project] - [Test Movie]を選んで実際にコンパイルし実行してみましょう。
[Output]パネルにコンパイルの進行が表示されしばらくするとFlash Playerが表示されます。
かなり簡単にコンパイル出来るのが判ると思います。
binフォルダにはコンパイルされたswfファイルが出力されています。
releaseビルドで約175K、debugビルドで約283Kになりました。
それでは今度は同じメッセージを表示する、mxml(flex)を使わない方法で試してみましょう。[Project]-[New Project]を選び今度は[AS3 Project]を選びます。
プロジェクトのテンプレートが今度は"Main.mxml"では無く、"Main.as"というファイルが出来ています。
package
{
import flash.display.Sprite;
import flash.events.Event;
/**
*/
public class Main extends Sprite
{
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
}
}
}
この雛型となるコードに書き足してアプリケーションを完成させていきます。
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.text.TextField;
/**
*/
public class Main extends Sprite
{
public var tf: TextField = new TextField();
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
tf.text = "Hello Flash World.";
addChild(tf);
}
}
}
少なくとも文字を表示させるために4行を書き加えてあります。
- クラスを扱うためのimport文(5行目)
- 変数の宣言とオブジェクトの生成(11行目)
- プロパティへの値セット(22行目)
- コンテナへの登録(23行目)
mxmlと比べてかなり書かなければならない事が判ります。
複雑なUIになればなるほどUI構築のコードだけでもかなりの記述量となる事が予想できます。また、flexの場合かなりの部分の既定の動作が既に組み込まれていたりするのでそれらを1から書く事もかなり大変です。
一方ファイルサイズはどうでしょうか?ビルドしてみると、
- releaseビルド: 738バイト
- debugビルド: 883バイト
と、どちらも1K未満で済んでいます。リンクするライブラリも少ない為コンパイルもかなり速いのがわかります。
作りたいアプリケーションの種類に応じて使い分けが必要でしょう。
最終更新:2009年09月23日 01:16