Flex 构建带有CheckBox的Tree.doc

设置带checkBox的树一、重写Tree的TreeItemRenderer，添加checkBoxpackage com.FunctionTreeimport flash.events.Event;import mx.collections.ICollectionView;import mx.collections.IList;import mx.collections.IViewCursor;import mx.controls.CheckBox;import mx.controls.Tree;import mx.controls.treeClasses.ITreeDataDescriptor;import mx.controls.treeClasses.TreeItemRenderer;import mx.controls.treeClasses.TreeListData;/* * 支持CheckBox的TreeItemRenderer * author Montage */public class TreeCheckBoxRenderer extends TreeItemRendererpublic function TreeCheckBoxRenderer()super();/* * 表示CheckBox控件从data中所取数据的字段 */private var _selectedField:String = selected;protected var checkBox:CheckBox;/* * 构建CheckBox */override protected function createChildren():voidsuper.createChildren();checkBox = new CheckBox();checkBox.addEventListener(Event.CHANGE, changeHandler);addChild( checkBox );/* * 点击checkbox时,更新dataProvider * param event */protected function changeHandler( event:Event ):voidif( data & data_selectedField != undefined )data_selectedField = checkBox.selected;var myListData:TreeListData = TreeListData(this.listData);var tree:Tree = Tree(myListData.owner);toggleChildren(data,tree); private function toggleChildren (item:Object, tree:Tree):voidif (item = null)return;elsevar treeData:ITreeDataDescriptor = tree.dataDescriptor;var tmpTree:IList = tree.dataProvider as IList;item_selectedField = checkBox.selected;tmpTree.itemUpdated(item,_selectedField,item_selectedField,checkBox.selected);if (treeData.hasChildren(item)var children:ICollectionView = treeData.getChildren (item);var cursor:IViewCursor = children.createCursor();while (!cursor.afterLast)toggleChildren(cursor.current, tree);cursor.moveNext();override public function set data(value:Object):voidsuper.data = value;checkBox.selected = data_selectedField ;/* * 初始化控件时, 给checkbox赋值 */override protected function commitProperties():mitProperties();if( data & data_selectedField != undefined )checkBox.selected = data_selectedField;elsecheckBox.selected = false;/* * 重置itemRenderer的宽度 */override protected function measure():voidsuper.measure();measuredWidth += checkBox.getExplicitOrMeasuredWidth();/* * 重新排列位置, 将label后移 * param unscaledWidth * param unscaledHeight */override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):voidsuper.updateDisplayList(unscaledWidth, unscaledHeight);var startx:Number = data ? TreeListData( listData ).indent : 0;if (disclosureIcon)disclosureIcon.x = startx;startx = disclosureIcon.x + disclosureIcon.width;disclosureIcon.setActualSize(disclosureIcon.width,disclosureIcon.height);disclosureIcon.visible = data ?TreeListData( listData ).hasChildren :false;if (icon)icon.visible = false ;/*icon.x = startx;startx = icon.x + icon.measuredWidth;icon.setActualSize(icon.measuredWidth, icon.measuredHeight);*/checkBox.move(startx, ( unscaledHeight - checkBox.height ) / 2 );label.x = startx + checkBox.getExplicitOrMeasuredWidth();2、 添加组件FunctionTree，继承Tree!CDATAimport mx.collections.ArrayCollection;import mx.collections.Sort;import mx.collections.SortField;import mx.controls.Alert;import ponents.mediaClasses.VolumeBar;private var _showCheckBox:Boolean = true ;/标识是否显示checkBoxprivate var _dataSource:ArrayCollection ;/初始数据源private var _selectedDataSource:ArrayCollection = new ArrayCollection () ;/存储选中的数据private var _treeDataSource:ArrayCollection = new ArrayCollection ();/整理之后的树形 数据源private var _parentColumnsName:String = parentID;/设置父节点的列名private var _parentID:String = 0;/设置初始 父节点值private var _selectedCheckColumnsName:String = selected;/设置标志选中checkbox的列明private var _childColumnsName:String = functionID;/设置子节点的列名private function init():voidsetItemRender();_treeDataSource= parentData(_parentID);this.dataProvider= _treeDataSource ;private function setItemRender():voidif(_showCheckBox)this.itemRenderer = new ClassFactory(com.FunctionTree.TreeCheckBoxRenderer);/引用编写的TreeItemReaderer的位置private function getSelectedData(arr:ArrayCollection):ArrayCollectionfor(var i:int = 0 ; i arr.length ; i+ )if(arr.getItemAt(i).children != null)/判断有没有子节点var objArr:ArrayCollection = new ArrayCollection ();for(var columns:String in arr.getItemAt(i).children)/遍历object，columns是1，2，3objArr.addItem(arr.getItemAt(i).childrencolumns);/将object转换成数字getSelectedData(objArr);/重新获取选中数据elseif(arr.getItemAt(i).selected)/判断改数据是否选中，selected是设置的选中与否的标志_selectedDataSource.addItem(arr.getItemAt(i); return _selectedDataSource ;/* * 创建Tree的数据源 * */private function parentData(parentID_:String):ArrayCollectionvar childData:ArrayCollection = getChildData(parentID_);var child:ArrayCollection = new ArrayCollection () ;tryfor(var i:int = 0 ; i 0)itemchildren= arr;/根据父节点获取子节点if(!item.hasOwnProperty(_selectedCheckColumnsName)/判断是否有此属性item_selectedCheckColumnsName = false ;if(_selectedCheckColumnsName != selected)itemselected = item_selectedCheckColumnsName ;/将判断是否选中的属性换成selectedchild.addItem(item);catch(e:Error)Alert.show(您还有属性未设置，请设置！,错误);return child; return child ;/* *根据父节点，获取子节点 * */private function getChildData(parentID_:String):ArrayCollectionvar childData:ArrayCollection = new ArrayCollection () ;tryfor(var i:int = 0 ; i 三、用法FunctionTree组件使用说明：parentColumnsName属性是设置数据库中父节点的列名，childColumnsName属性是为了设置子节点的列，selectedC