自定义组件:
package com.anydata.consumer.renderers { import flash.events.Event; import flash.events.MouseEvent; import mx.collections.ICollectionView; import mx.collections.IList; import mx.collections.IViewCursor; import mx.controls.CheckBox; import mx.controls.Image; 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 TreeItemRenderer { public function TreeCheckBoxRenderer() { super(); } protected var myImage:Image; private var imageWidth:Number = 12; private var imageHeight:Number = 12; // set image properties private var inner:String = "@Embed(source='assets/inner.png')"; protected var checkBox:CheckBox; /** * 表示CheckBox控件从data中所取数据的字段 */ private var _selectedField:String="selected"; /** * 点击checkbox时,更新dataProvider * @param event */ protected function changeHandler(event:Event):void { if (data && data[_selectedField] != undefined) { data[_selectedField]=checkBox.selected; } var myListData:TreeListData=TreeListData(this.listData); var tree:Tree=Tree(myListData.owner); /* var toggle:Boolean=checkBox.selected; */ toggleChildren(data, tree); var parent:Object=tree.getParentItem(data); toggleParents (parent, tree); } /** * 初始化控件时, 给checkbox赋值 */ override protected function commitProperties():void { super.commitProperties(); //trace(data[_selectedField]) if (data && data[_selectedField] != undefined) { checkBox.selected=data[_selectedField]; } else { checkBox.selected=false; } } /** * 构建CheckBox */ override protected function createChildren():void { super.createChildren(); checkBox=new CheckBox(); addChild(checkBox); checkBox.addEventListener(Event.CHANGE, changeHandler); myImage = new Image(); myImage.source='assets/inner.png'; myImage.addEventListener( MouseEvent.CLICK, imageToggleHandler ); addChild(myImage); } private function imageToggleHandler(event:Event):void { checkBox.selected = !checkBox.selected; changeHandler(event); } /** * 重置itemRenderer的宽度 */ override protected function measure():void { super.measure(); measuredWidth+=checkBox.getExplicitOrMeasuredWidth(); } /** * 重新排列位置, 将label后移 * @param unscaledWidth * @param unscaledHeight */ override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight); if(super.data) { if (super.icon != null) { checkBox.x = super.icon.x; checkBox.y = 13; super.icon.x = checkBox.x + checkBox.width + 25; super.label.x = super.icon.x + super.icon.width + 3; } else { checkBox.x = super.label.x; checkBox.y = 13; super.label.x = checkBox.x + checkBox.width + 25; } if (data[_selectedField] == "11") { myImage.x = checkBox.x+3 ; myImage.y = checkBox.y-5 ; myImage.width = imageWidth; myImage.height = imageHeight; checkBox.selected = false; } else { myImage.x = 0; myImage.y = 0; myImage.width = 0; myImage.height = 0; } } } private function toggleChildren(item:Object, tree:Tree):void { if (item == null) { return; } else { var treeData:ITreeDataDescriptor=tree.dataDescriptor; item[_selectedField]=checkBox.selected; var tmpTree:IList=tree.dataProvider as IList; tmpTree.itemUpdated(item); if (treeData.hasChildren(item)) { var children:ICollectionView=treeData.getChildren(item); var cursor:IViewCursor=children.createCursor(); while (!cursor.afterLast) { toggleChildren(cursor.current, tree); cursor.moveNext(); } } } } private function toggleParents (item:Object, tree:Tree):void{ if (item == null) { return; } else { var numChecks:int = 0; var numUnChecks:int = 0; var numCats:int = 0; var treeData:ITreeDataDescriptor=tree.dataDescriptor; var children:ICollectionView=treeData.getChildren(item); var cursor:IViewCursor=children.createCursor(); while (!cursor.afterLast) { if(cursor.current[_selectedField]){ numChecks++; }else{ numUnChecks++; } cursor.moveNext(); } if(numChecks>0&& numUnChecks>0){ item[_selectedField] = "11" }else if(numChecks>0){ item[_selectedField]=true; }else{ item[_selectedField]=false; } var tmpTree:IList=tree.dataProvider as IList; tmpTree.itemUpdated(item); if(tree.getParentItem(item)!=null){ toggleParents(tree.getParentItem(item),tree); } } } } } 画面代码:
[Bindable] public var collection:ArrayCollection=new ArrayCollection([{"name": "上海", "selected": false, "children": [{"name": "黄浦", "selected": false}, {"name": "浦东", "selected": true, "children": []}, {"name": "静安", "selected": false}, {"name": "徐汇", "selected": false}]}, {"name": "北京", "selected": false, "children": [{"name": "海淀", "selected": false}, {"name": "朝阳", "selected": true}, {"name": "丰台", "selected": false}]}]);
<mx:Tree x="29" y="48" width="100%" height="100%" id="groupTree" dataProvider="{collection}" showRoot="true" fontSize="14" fontWeight="bold" doubleClickEnabled="true" paddingLeft="20" itemRenderer="com.anydata.consumer.renderers.TreeCheckBoxRenderer" itemOpen="groTree_itemOpeningHandler(event)" labelField="name" defaultLeafIcon="@Embed(source='assets/ico_phone.gif')" folderClosedIcon="@Embed(source='assets/ico_team.gif')" folderOpenIcon="@Embed(source='assets/ico_team.gif')"></mx:Tree>