5.6.為Tree創(chuàng)建項渲染器

2024-04-27 13:51:56

字體：大中小

供稿：網(wǎng)友

5.6.1.問題
為Tree 組件更改功能
5.6.2.解決方法
創(chuàng)建一個itemRenderer 繼承自TreeItemRenderer 類
5.6.3討論
更改一個Tree 組件功能使之比其它基于list 的組件更靈活,與DataGrid, TileList, 或List組件不同的是,你不能為Tree 組件使用dropInItemRenderer，只能繼承TreeItemRenderer類來創(chuàng)建一個itemRenderer, TreeItemRenderer 為Tree 組件定義了默認的條目渲染器,TreeItemRenderer 的默認行為是在tree 中繪制關(guān)聯(lián)的每一個條目的文本,一個可選擇的圖標(biāo)，和一個可選的可定義圖標(biāo).

通過這一節(jié)使用TreeListData 對象的父級傳遞TreeItemRenderer， TreeListData 定義了以下屬性：
depth : int tree 中條目的層級

disclosureIcon : Class 為Tree 組件的條目描繪可定義的圖標(biāo)的一個類

hasChildren : Boolean 若該結(jié)點有孩子結(jié)點時為true

icon : Class 為Tree 組件的條目描繪圖標(biāo)的一個類

indent : int Tree 組件的當(dāng)前行的默認縮排

item : Object Tree 組件的當(dāng)前條目的數(shù)據(jù)

label : String 條目數(shù)據(jù)的文本表現(xiàn)，基于List 類的itemToLabel 方法

open : Boolean 結(jié)點開放時為true

下面這個例子使用了這個方法來改變子文本為紫色和粗體.它同樣為每一個目錄增加了一些文本以顯示這個特別的分支中有多少對象。

-ActionScript

package oreilly.cookbook {
import mx.controls.treeClasses.*;
import mx.collections.*;
public class CustomTreeItemRenderer extends TreeItemRenderer {
public function CustomTreeItemRenderer() {
super ();
mouseEnabled = false ;
}

TreeItemRenderer 中的listData 屬性涉及到Tree 對象父級的數(shù)據(jù),它是用來判斷當(dāng)前渲染器數(shù)據(jù)對象包含的所有孩子

-ActionScript

override public function set data(value:Object):void {
if (value != null ) {
super.data = value;
if (TreeListData(super.listData).hasChildren) {
setStyle("color", 0x660099);
setStyle("fontWeight", 'bold');
} else
{
setStyle("color", 0x000000);
setStyle("fontWeight", 'normal');
}
}
}

updateDisplayList 方法是被覆蓋來檢查當(dāng)前渲染器傳遞的結(jié)點是否占有父級Tree 中TreeListData 正在使用的所有孩子

-ActionScript

override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth, unscaledHeight);
if(super.data){
if(TreeListData(super.listData).hasChildren){
var tmp:XMLList = new XMLList(TreeListData(super.listData).item);
var myStr:int = tmp[0].children().length();
super.label.text =TreeListData(super.listData).label + "("+myStr + "objects)";
}
}
}
}
}