http://blog.yotuo.net/post/2009/11/DataGrid-CheckBoxColumn.html
最近在尝试着用Flex做个文件按管理的工具，在文件列表中为了操作方便，想到了再列表控件DataGird中添加一个含有复选框的列，在表头的复选框可以实现全选功能，但DataGird自身并无此功能。参照网上的相关资料，总算折腾出来了，现把源码奉上，希望对需要的朋友有点帮助，不足之处也请高手指点。
最终的CheckBoxColumn包包含四个相关的类文件，分别是：
1、CenterCheckBox.as：通过重写CheckBox基类来实现复选框的居中显示；
2、CheckBoxColumn.as：继承自DataGridColumn的一个新类，为了实现需要，增添了几个新属性；
3、CheckBoxHeaderRenderer.as：继承自CenterCheckBox 类，用于DataGrid表头的复选框，实现全选功能；
4、CheckBoxItemRenderer.as：继承自CenterCheckBox 类，用于DataGrid表中的数据行；
各文件源码如下：
1、CenterCheckBox.as
package Common.YotuoUpload.CheckBoxColumn
{
import flash.display.DisplayObject;
import mx.controls.CheckBox;
import flash.text.TextField;
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 );
}
}
}
}
}
2、DataGridColumn.as
package Common.YotuoUpload.CheckBoxColumn
{
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);
}
}
}
3、CheckBoxHeaderRenderer.as
package Common.YotuoUpload.CheckBoxColumn
{
import flash.events.Event;
import mx.collections.ArrayCollection;
import mx.controls.CheckBox;
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类中使用绑定而出现点击全选页面没有更改状态的错误
}
}
}
4、CheckBoxItemRenderer.as
package Common.YotuoUpload.CheckBoxColumn
{
import flash.events.Event;
import flash.events.MouseEvent;
import mx.controls.CheckBox;
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
调用示例：
1、在mxml中作为控件调用：
2、通过代码动态调用：
PS：该组件要求在数据源中存在属性isSelected（Boolean类型，用来记录当前行是否被选中）属性，这样就限制了程序的通用性，试了很多方法都未很好解决，希望有办法解决的朋友给以指点。
示例运行效果：
