Flex中Tree控件增加Checkbox

首先重写TreeItemRenderer

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113

package net.noday.demo {    import flash.events.Event; import mx.controls.CheckBox; import mx.controls.treeClasses.TreeItemRenderer; import mx.controls.treeClasses.TreeListData;    /**  * 支持CheckBox的TreeItemRenderer  */  public class TreeCheckBoxRenderer extends TreeItemRenderer {     public function TreeCheckBoxRenderer()     {         super();     }            /**      * 表示CheckBox控件从data中所取数据的字段      */          private var _selectedField:String = "selected";            protected var checkBox:CheckBox;            /**      * 构建CheckBox      */          override protected function createChildren():void     {         super.createChildren();         checkBox = new CheckBox();         addChild( checkBox );         checkBox.addEventListener(Event.CHANGE, changeHandler);     }            /**      * 点击checkbox时,更新dataProvider      * @param event      */          protected function changeHandler( event:Event ):void     {         if( data && data[_selectedField] != undefined )         {             data[_selectedField] = checkBox.selected;         }     }             /**      * 初始化控件时, 给checkbox赋值      */          override protected function commitProperties():void     {         super.commitProperties();         trace(data[_selectedField])         if( data && data[_selectedField] != undefined )         {             checkBox.selected = data[_selectedField];         }         else         {             checkBox.selected = false;         }     }            /**      * 重置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);         var startx:Number = data ? TreeListData( listData ).indent : 0;                    if (disclosureIcon)         {             disclosureIcon.x = startx;                startx = disclosureIcon.x + disclosureIcon.width +4;                            disclosureIcon.setActualSize(disclosureIcon.width,                                          disclosureIcon.height);                            disclosureIcon.visible = data ?                                      TreeListData( listData ).hasChildren :                                      false;         }                    if (icon)         { //          icon.x = startx; //          startx = icon.x + icon.measuredWidth;             icon.x = startx + checkBox.getExplicitOrMeasuredWidth() + 4;//             icon.setActualSize(icon.measuredWidth, icon.measuredHeight);         }                    checkBox.move(startx, ( unscaledHeight - checkBox.height ) / 2 );                               label.x = icon.x + icon.width +4;// //      label.x = startx + checkBox.getExplicitOrMeasuredWidth();     } } }

然后加入到Tree中

 

1	<mx:Tree width="150" height="100%" dataProvider="{personList}" itemRenderer="net.noday.demo.TreeCheckBoxRenderer" labelField="label"></mx:Tree>