プログラミングやる前に先お風呂はいっちゃいなさい

BindingUtilsの使い方

この記事も、以前のはてなで書いた記事をほぼ転載してます。

まあ、移転作業というわけです。

さて、Flexでとても便利なバインド機能についてです。
MXMLで{}を使って書くやつ。
値が更新されるとバインドしたとこも更新されるアレですね。

以前、この機能をMXMLでなくてActionScriptで使いたいと思って調べてみたところ、あまり情報が無かったんでブログに載せたのかと思います。

ってことで、ActionScriptからバインド機能を使う方法です。
あらかじめ断っておくと、{}で簡単にバインドはできません。

さて、ActionScriptからバインドを使うにはBindingUtilsというクラスを使います。

こいつはbindPropertyってメソッドをstaticに持ってますんで、そいつを使います。

こいつを使って、たとえばLabelのtextにClassAのhogeプロパティをバインドしたい場合はこんな感じ。

 var label:Label = new Label();
 var classA:ClassA = new ClassA();
 BindingUtils.bindProperty(label, "text", classA, "hoge");

こんな感じ。注意点としてはClassAクラスがhogeプロパティを定義するときにちゃんとbindableとして定義してあること。

class ClassA {
  private var _hoge:int;
  public function get hoge():int {
    return _hoge;
  }
  [Bindable] public function set hoge(value:int):void
  {
    _hoge = value;
  }
}

こんな感じですね。こうしてあれば、ClassAのhogeの値が変更されるとさっきのLabelのtextも変更されるわけです。

ただ、ここまでは割とネット上に情報がありました。
僕がやりたかったのは、式をバインドする場合。

{}を使ってた時は式を入れてもちゃんとバインドされたんですよ。

ということで、式をバインドする場合。
例えば、hogeの2倍をLabelのtextに表示するときはこんな風に書きます

 var label:Label = new Label();
 var classA:ClassA = new ClassA();
 var paramObject:Object = {
   name: "hoge",
   getter: function (host:*):String {
    return 2 * host["hoge"];
   }
 };
 BindingUtils.bindProperty(label, "text", classA, paramObject);

こうすれば、式がバインドされます

{
 name: property名,
 getter: function (host:*):String {
  return host[property名];
 }
}

nameとgetterって名前のプロパティを持ったこんな形のオブジェクトを第4引数に入れるといいんだとか。

時間があったらもうちょい調べてまた書くことにします。