最近在flex项目中,实现了该功能,share下:
xxxx.mxml
TCheckBoxHeaderRender.as:
TCheckBoxItemRender.as:
xxxx.mxml
<mx:DataGrid id="overViewDataGrid" width="100%" height="100%" rowCount="5" dataProvider="{_dataProvider}" itemClick="showDetailInfo()">
<mx:columns>
<component:TCheckBoxColumn width="25" id="checkBoxColumn"
draggable="false" resizable="false" sortable="false"
headerRenderer="{new ClassFactory(TCheckBoxHeaderRender)}"
itemRenderer="{new ClassFactory(TCheckBoxItemRender)}" >
</component:TCheckBoxColumn>
<mx:DataGridColumn headerText="Name" labelFunction="formatName"/>
<mx:DataGridColumn headerText="IP Address" labelFunction="formatIP"/>
<mx:DataGridColumn headerText="Running" labelFunction="formatOS"/>
<mx:DataGridColumn headerText="Confidence" labelFunction="formatConfidence"/>
</mx:columns>
</mx:DataGrid>
TCheckBoxHeaderRender.as:
public class TCheckBoxHeaderRender extends TCheckBox{
private var _data:TCheckBoxColumn;
private var column:TCheckBoxColumn;
private var dg:DataGrid;
private var dgDataArr:ArrayCollection;
public function TCheckBoxHeaderRender(){
super();
this.showMiddle = true;
this.addEventListener(Event.CHANGE,onChange);
}
override public function get data():Object{
return _data;
}
override public function set data(value:Object):void{
_data = value as TCheckBoxColumn;
selected = _data.cloumnSelected;
}
private function onChange(event:Event):void{
dg = DataGrid(listData.owner);
column = dg.columns[listData.columnIndex];
dgDataArr = dg.dataProvider as ArrayCollection;
column.cloumnSelected = this.selected;
column.selectItems = new Array();
checkButtonState();
dgDataArr.refresh();
}
private function checkButtonState():void {
if(this.selected){
column.selectItems = (dg.dataProvider as ArrayCollection).toArray();
if(column.isDisable){
column.canRemove = false;
}else {
column.canRemove = true;
}
}else {
column.canRemove = false;
}
if(dgDataArr.length>0){
if(dgDataArr[0]!=""){
for(var i:int = 0; i < dgDataArr.length ; i++){
Object(dgDataArr[i]).isSelected = this.selected;
if(dgDataArr.length==1&&this.selected&&!column.isDisable){
column.canEdit = true;
}else{
column.canEdit = false;
}
}
}
}
}
}
TCheckBoxItemRender.as:
public class TCheckBoxItemRender extends TCheckBox{
private var currentData:Object;
private var model:TModelLocator = TModelLocator.getInstance();
public function TCheckBoxItemRender(){
super();
this.showMiddle = true;
this.addEventListener(MouseEvent.CLICK,onClickCheckBox);
this.addEventListener(Event.CANCEL,onClickCheckBox);
}
override public function set data(value:Object):void{
this.selected = value.isSelected;
this.currentData = value;
}
private function onClickCheckBox(e:Event):void{
var dg:DataGrid = DataGrid(listData.owner);
var column:TCheckBoxColumn = dg.columns[listData.columnIndex];
this.currentData.isSelected = this.selected;
if(this.selected){
column.selectItems.push(this.currentData);
}else{
for(var i:int = 0; i<column.selectItems.length; i++){
if(column.selectItems[i] == this.currentData){
column.selectItems.splice(i,1)
}
}
}
if(column.isDisable) {
column.canRemove = false;
column.canEdit =false;
}else{
if(column.selectItems.length==1) {
column.canRemove = true;
column.canEdit = true;
}else if(column.selectItems.length>1) {
column.canEdit = false;
column.canRemove = true;
}else {
column.canEdit = false;
column.canRemove = false;
}
}
changeCheckBoxHeader();
}
private function changeCheckBoxHeader():void{
var dg:DataGrid = DataGrid(listData.owner);
var dgDataArr:ArrayCollection = dg.dataProvider as ArrayCollection;
var totalColumnSize:int =dgDataArr.length;
var allSelected=true;
var selectColumnArr:Array = dg.columns[0].selectItems;
var selectColumnSize:int = selectColumnArr.length;
if(selectColumnSize!=totalColumnSize){
allSelected = false;
}
var headerColumn :TCheckBoxColumn = dg.columns[0];
if(allSelected){
headerColumn.cloumnSelected=true;
}else{
headerColumn.cloumnSelected=false;
}
dgDataArr.refresh();
}
}