最小限でFlex

mxmlを理解していないのと、FlexBuilderのインストールに失敗した事で、僕のflexに対する気後れ感情はパンパンに膨張しているのでありますが、それでもやはりflexを捨てきれない事がおこります。よく見ると結構便利なんです。

という事でactionscriptのみで書いていたプログラムでflexのクラスを使いたくなった時の話です。以下のHelloWorld.asを構造の変化を最小限に押さえながらflex仕様にしてみます。

package {
    import flash.display.*;
    import flash.text.*;
    
    public class HelloWorld extends Sprite {
        public function HelloWorld() {
            var tf:TextField = new TextField();
            tf.text = "HelloWorld";
            addChild(tf);
        }
    }
}

変更点は主に２点です。

1. SpriteではなくApplicationを継承する
   flexのアプリケーションはApplication、もしくはそのサブクラスがエントリポイントになる。
2. _rootというUIComponentに対して、TextFieldをaddChildする
   Applicationに対してSpriteをaddChildしてもエラーがでて描画されない。
   間にUIComponentをかませると、期待の挙動が得られる。

で、結果がこんな感じになります。

package {
    import flash.display.*;
    import flash.text.*;
    import mx.core.*;
    
    public class HelloWorld extends Application {
        private var _root:UIComponent = new UIComponent();
        public function HelloWorld() {
            var tf:TextField = new TextField();
            tf.text = "HelloWorld";
            _root.addChild(tf);
            addChild(_root);
        }
    }
}

さらに書き換えたHelloWorld.asをmain.mxmlでくるんで完成。
このmxmlでlayout=”absolute”を書かないと上手くレイアウトされないので注意。

< ?xml version="1.0" ?>

以上で、構造を極力変更せずに、flexのクラスを使用する素地が出来ました。
swfのサイズはでっかくなりますが、ソースコードは綺麗なままですね。