Video: Flex Best Practices

英語が聞けなくても、それなりに参考になります。
Flexエバンジェリストの James Ward[blog]氏のセッションらしいです。
Video: Flex Best Practices | James Ward - RIA Cowboy


どこかに日本語訳まとめがあると嬉しいのですが、、私のレベルで気になった部分”だけ”メモしました。
72分と長いムービーで、流しまくって見ましたので...(言い訳)

mxmlの属性は子タグとしても書ける

あまり使わないと思うけど、MXML上でクラスの定義も可能(例ではFooクラスをインスタンス化している)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
	xmlns:mx="http://www.adobe.com/2006/mxml" 
	xmlns="*"
	layout="absolute"
	>
	<mx:creationComplete>
		<![CDATA[
			nameLabel.text = foo1.name;
			addrLabel.text = foo1.addr;
		]]>
	</mx:creationComplete>
	<mx:Script>
		<![CDATA[
			
		]]>
	</mx:Script>
	<mx:Component className="Foo">
  		<mx:Object>
  			<mx:Script>
  				<![CDATA[
  					public var name:String;
  					public var addr:String;
  				]]>
  			</mx:Script>
  		</mx:Object>	
	</mx:Component>

	<Foo id="foo1">
		<name>myName</name>
		<addr>Sendai</addr>
	</Foo>
	
	<mx:VBox>
		<mx:Label id="nameLabel" text="hoge" />
		<mx:Label id="addrLabel" text="hoge" />
	</mx:VBox>
</mx:Application>

FlexFramework 3 は FlashPlayer にキャッシュすることができる

プロジェクト→設定→Flexビルドバス→ライブラリパスで、
フレームワークのリンクに、ランタイム共有ライブラリ(RSL)を選択すれば良い。

効果はまだ分かりませんが、生成されるswfのサイズが激減しました。
初回ロードは遅くなるそうです。

参考:中垣 茂 ( Shigeru Nakagaki ) | ブログ ( Flex, AIR, ColdFusion ) | FlexFramework 3 は FlashPlayer 9 にキャッシュされる件

ModelにはSingletonパターンを使うべし

モデル部分をSingletonに。

package
{
	import mx.collections.ArrayCollection;
	
	public class Model
	{
		private static var _instance:Model;
		public static function getInstance():Model
		{
			if (_instance == null) {
				_instance = new Model();
				return _instance;
			}
		}
		[Bindable]
		public var products:ArrayCollection;
	}
}


アプリ部分でこのように使う。

<mx:HTTPService id="srv" url="http://localhost:8080/app/hoge.jsp"
  result="Model.getInstance().products = event.result.catalog.prodult" />

<mx:DataGrid dataProvider="{Model.getInstance().products}" ?>

Controllerを作る

  • ProcuctControllerというコントローラークラスを作成
  • メソッド(getAllProducts)内で、HTTPServiceクラスからデータを取得するようにする。


MXMLはこんな感じになる。

<mx:Application 
	xmlns:mx="http://www.adobe.com/2006/mxml" 
	xmlns:local="*"
	layout="absolute"
	applicationComplete="c.getAllProducts()"
	>
  <local:ProcuctController id="c" />
  <mx:DataGrid dataProvider="{Model.getInstance().products}" ?>
</mx:Application>

ActionScriptプロジェクト

ActionScriptプロジェクトとして作成するもの。

言いたいことがよく分からなかったが、mxmlを使わずともアプリが作れますよってことかな?

以下のコードはヘルプから引用。

package {
    import flash.display.Sprite;
    import flash.events.*;

    public class SpriteExample extends Sprite {
        private var size:uint    = 100;
        private var bgColor:uint = 0xFFCC00;

        public function SpriteExample() {
            var child:Sprite = new Sprite();
            child.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
            child.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
            draw(child);
            addChild(child);
        }

        private function mouseDownHandler(event:MouseEvent):void {
            trace("mouseDownHandler");
            var sprite:Sprite = Sprite(event.target);
            sprite.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
            sprite.startDrag();
        }

        private function mouseUpHandler(event:MouseEvent):void {
            trace("mouseUpHandler");
            var sprite:Sprite = Sprite(event.target);
            sprite.removeEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
            sprite.stopDrag();
        }

        private function mouseMoveHandler(event:MouseEvent):void {
            trace("mouseMoveHandler");
            event.updateAfterEvent();
        }

        private function draw(sprite:Sprite):void {
            sprite.graphics.beginFill(bgColor);
            sprite.graphics.drawRect(0, 0, size, size);
            sprite.graphics.endFill();
        }
    }
}

その他

  • Item Renderersはシンプルに!
  • AMF使え
  • MVC重要。CaingormやPureMVCといったフレームワークを使う。