flex自定义用ArrayCollection做数据源的带checkbox的tree(功能
发布时间:2020-12-15 04:20:11 所属栏目:百科 来源:网络整理
导读:自定义组件: 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;im
自定义组件: 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": "静安",{"name": "徐汇","selected": false}]},{"name": "北京","children": [{"name": "海淀",{"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> 写得不容易,看过给声好好歹! (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |