つれずれなるままの開発日記(最近はFlexばかり..)

Archive for 2009/4/9

mx:Tree with checkbox

Tree上にチェックボックスを表示させるには・・・・
[AS]
tree.itemRenderer = new IClassFactory(TreeCheckBoxRenderer);
[/AS]
のように、新たに作成するItemRendererを設定する。
次に、TreeCheckBoxRendererを実装。

[AS]
class TreeCheckBoxRenderer extends TreeItemRenderer
[/AS]
のように、TreeItemRenderer を継承することがポイント！！

次に、ItemRendererのcreateChildren()メソッドでは
[AS]
override protected function createChildren():void{
super.createChildren();
checkBox = new CheckBox();
checkBox.setStyle(“verticalAlign”,”middle”);
this.addChild(checkBox);
}
[/AS]
とする。要するにCheckBoxが追加できればいいのと、ここでは、setStyleでverticalAlignがmiddleのときしか考慮していない。

このままでは、表示する際にチェックボックスの位置がおかしい。
したがって、updateDisplayList()で位置を調整する。

CheckBoxの位置がおかしい

[AS]
super.updateDisplayList(unscaledWidth,unscaledHeight);

if(super.data){
if(icon != null){
checkBox.x = icon.x;
icon.x = checkBox.x + checkBox.width + 20;
label.x = icon.x + icon.width + 5;
}
else{
checkBox.x = super.label.x;
label.x = checkBox.x + checkBox.width + 20;
}
checkBox.y = ( unscaledHeight – checkBox.height ) /2;
}
[/AS]

このあたりは、TreeItemRendererのメソッドを見れば参考になると思います。