flex DataGrid checkbox

四个相关的类文件，分别是：

1、 CenterCheckBox.as：通过重写CheckBox基类来实现复选框的居中显示；

2、CheckBoxColumn.as：继 承自DataGridColumn的一个新类，为了实现需要，增添了几个新属性；

3、 CheckBoxHeaderRenderer.as：继承自CenterCheckBox 类，用于DataGrid表头的复选框，实现全选功能；

4、 CheckBoxItemRenderer.as：继承自CenterCheckBox 类，用于DataGrid表中的数据行

------------------------

package comp
{
 import flash.display.DisplayObject;
 import flash.text.TextField;
 
 import mx.controls.CheckBox;

 public class CenterCheckBox extends CheckBox  
 {    
  // 居中展现    
  override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void    
  {    
   super.updateDisplayList(unscaledWidth, unscaledHeight);    
   var n:int = numChildren;    
   for(var i:int = 0; i < n; i++)    
   {    
    var c:DisplayObject = getChildAt(i);    
    if( !(c is TextField))    
    {    
     c.x = Math.round((unscaledWidth - c.width) / 2);    
     c.y = Math.round((unscaledHeight - c.height) /2 );    
    }    
   }    
  }    
 }  
------------------

package comp
{
 import mx.controls.dataGridClasses.DataGridColumn;

 public class CheckBoxColumn extends DataGridColumn{  
  
  public var cloumnSelected:Boolean=false;//保存该列是否全选的属性（用户先点击全选后在手动的取消几行数据的选中状态时，这里的状态不会改 变）            
  
  public var selectItems:Array = new Array();// 用户保存用户选中的数据  
  
  
  public function CheckBoxColumn(columnName:String=null){  
   super(columnName);   
  }  
 } 

}

----------------

package comp
{
 import flash.events.Event;
 
 import mx.collections.ArrayCollection;
 import mx.controls.DataGrid;

 public class CheckBoxHeaderRenderer extends CenterCheckBox{     
  
  private var _data:CheckBoxColumn;//定义CheckBox列对象       
  public function CheckBoxHeaderRenderer(){  
   super();  
   this.addEventListener(Event.CHANGE,onChange);//CheckBox状态变化时触发此事件  
   this.toolTip = "全选";  
  }  
  
  
  override public function get data():Object{  
   return _data;//返回的是CheckBox列的对象  
   
  }  
  
  override public function set data(value:Object):void{  
   _data = value as CheckBoxColumn;  
   //trace(_data.cloumnSelected);  
   selected = _data.cloumnSelected;  
  }  
  
  private function onChange(event:Event):void{                  
   
   var dg:DataGrid = DataGrid(listData.owner);//获取 DataGrid对象  
   var column:CheckBoxColumn = dg.columns[listData.columnIndex];//获取整列的显示对 象  
   
   var dgDataArr:ArrayCollection = dg.dataProvider as  ArrayCollection;  
   
   column.cloumnSelected = this.selected;//更改列的全选状态  
   
   column.selectItems = new Array();// 重新初始化用于保存选中列的对象  
   
   if(this.selected){//如果为全部选中的化就将数据源赋值给column.selectItems，不是就不管他，上一步已经初始化为空  
    column.selectItems = (dg.dataProvider as ArrayCollection).toArray();  
    
   }  
   if(dgDataArr.length>0){  
    if(dgDataArr[0]!=""){  
     for(var i:int = 0; i < dgDataArr.length ; i++){  
      Object(dgDataArr[i]).dgSelected = this.selected;//更改没一行的选中状态  
     }   
    }    
   }   
   dgDataArr.refresh();//刷新 数据源，达到强制更新页面显示效果的功能，防止在使用时没有在VO类中使用绑定而出现点击全选页面没有更改状态的错误        
  }  
 } 

}

----------

package comp
{
 import flash.events.Event;
 
 import mx.controls.DataGrid;

 public class CheckBoxItemRenderer extends CenterCheckBox{  
  private var currentData:Object; //保存当前一行值的对象  
  
  public function CheckBoxItemRenderer(){  
   super();  
   this.addEventListener(Event.CHANGE,onClickCheckBox);  
   this.toolTip = "选择";  
  }  
  
  override public function set data(value:Object):void{  
   this.selected = value.dgSelected;  
   this.currentData = value; //保存整行的引用  
  }  
  
  //点击check box时，根据状况向selectedItems array中添加当前行的引用，或者从array中移除  
  private function onClickCheckBox(e:Event):void{   
   var dg:DataGrid = DataGrid(listData.owner);//获取DataGrid对象  
   var column:CheckBoxColumn = dg.columns[listData.columnIndex];//获取整列的显示对 象  
   var selectItems:Array = column.selectItems;  
   this.currentData.dgSelected = this.selected;// 根据是否选中的状态，更改数据源中选中的标记  
   if(this.selected){  
    selectItems.push(this.currentData);  
   }else{  
    for(var i:int = 0; i<selectItems.length; i++){  
     if(selectItems[i] == this.currentData){  
      selectItems.splice(i,1)  
     }  
    }  
   }  
  }  
 } 

}

---------------------------------application

<?xml version="1.0" encoding="utf-8"?>   
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark"
      minWidth="1024" minHeight="768"  
      creationComplete="Init()" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:comp="comp.*" >   
 <fx:Script>   
  <![CDATA[   
   import comp.CheckBoxHeaderRenderer;
   import comp.CheckBoxItemRenderer;
   
   import mx.collections.ArrayCollection;   
   
   public var dataArray:ArrayCollection = new ArrayCollection;   
   
   private function Init():void{   
    dataArray.addItem({isSelected:false,name:'zhangsan',phone:'2270',email:'[email protected]'});   
    dataArray.addItem({isSelected:false,name:'lisi',phone:'2270',email:'[email protected]'});   
    dgUser.dataProvider = dataArray;   
   }   
  ]]>   
 </fx:Script>   
 <mx:DataGrid id="dgUser" x="10" y="10" width="450" height="200">   
  <mx:columns>   
   <comp:CheckBoxColumn dataField="isSelected" width="25"     
             draggable="false" resizable="false" sortable="false"  
             headerRenderer="{new ClassFactory(comp.CheckBoxHeaderRenderer)}"  
             itemRenderer="{new ClassFactory(comp.CheckBoxItemRenderer)}"  />   
   <mx:DataGridColumn headerText="姓名" dataField="name"/>   
   <mx:DataGridColumn headerText="电话" dataField="phone"/>   
   <mx:DataGridColumn headerText="邮件" dataField="email"/>   
  </mx:columns>   
 </mx:DataGrid>   
</s:Application>