用FLEX3從數據庫接受數據形成樹形圖步驟:
1.封裝一個名爲Node的as類,包括編號,名稱,子節點和一個構造方法。
package common{
import mx.collections.ArrayCollection;
public class Node{
public var id:int;
public var name:String;
public var children:ArrayCollection;
public function Node(){
}
}
}
2.運用Node.as完成樹形圖(假設兩層數)。
private var trees:ArrayCollection; //第一層樹結點數據
private var nodesChildren:ArrayCollection; //孩子結點集合
private var node:Node = new Node(); //樹結點
private function getTree():void{
trees = new ArrayCollection();
var i:int = 0;
var j:int = 0;
var channel:Object ;//所有欄目
var firstChannel:Object ;//一級欄目
var secondChannel:Object ;//二級欄目
for(i;i<_channelList.length;i++){
channel = _channelList.getItemAt(i);
if(channel.PARENT_ID==0){
firstChannel = channel;
nodesChildren = new ArrayCollection();
for(j=0;j<_channelList.length;j++){
channel = _channelList.getItemAt(j);
if(channel.PARENT_ID==firstChannel.ID){
secondChannel = channel;
node = new Node();
node.id=secondChannel.ID;
node.name=secondChannel.CHANNEL_NAME;
node.children=null;
nodesChildren.addItem(node);
}
}
node = new Node();
node.id=firstChannel.ID;
node.name=firstChannel.CHANNEL_NAME;
node.children=nodesChildren;
trees.addItem(node);
}
}
tree.dataProvider=trees;
tree.labelField="name"; //指定顯示字段
}
/**********獲得欄目-回調方法**********/
private function getChannelListHttp_Handler(evt:JsonResponseEvent):void{
_channelList = new ArrayCollection(evt.JsonObj.data as Array);
getTree();
}
/**********點擊樹形欄目方法 *******/
private function tree_itemClick(evt:ListEvent):void {
var item:Object = evt.currentTarget.selectedItem;
var searchKeys:Array = new Array();
var searchValues:Array = new Array();
searchKeys.push("CHANNEL_ID");
searchValues.push(item.id);
paginator.param.isSearch=true;
paginator.param.searchKeys=searchKeys;
paginator.param.searchValues=searchValues;
paginator.commHttp.send(paginator.param);
channelId=item.id;
}
<mx:HBox width="150" height="100%">
<mx:Tree id="tree" width="100%" height="100%" itemClick="tree_itemClick(event)" ></mx:Tree>
</mx:HBox>