转自:http://blog.sina.com.cn/s/blog_6b80d2ca0100vgfh.html
效果图如下:
Application.mxml
<?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"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:local="local.*">
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
private var dp:ArrayCollection = new ArrayCollection([
{name:"天幻",sex:"男",annualsalary:""},
{name:"天幻",sex:"男",annualsalary:"30000"},
{name:"鬼母",sex:"男",annualsalary:"45000"},
{name:"癞皮狗",sex:"男",annualsalary:"150000"},
{name:"叮当",sex:"男",annualsalary:"300000"}
]);
public function columnFunction(col:DataGridColumn):String{
var n:int = dp.length;
var avg:Number = 0;
for (var i:int=0;i<n;i++){
// Alert.show(dp[i][col.dataField]);
avg += Number(dp[i][col.dataField]);
}
avg /= n;
return "平均年薪(RMB): " + avg.toFixed(0);
}
]]>
</fx:Script>
<local:FooterDataGrid id="dg1" width="400" height="200" initialize="dg1.dataProvider = dp"
paddingBottom="0" paddingTop="0" verticalAlign="middle">
<local:columns>
<local:FooterDataGridColumn width="140" dataField="name" headerText="Name">
<mx:DataGridColumn dataField="name" headerText="Name"/>
</local:FooterDataGridColumn>
<local:FooterDataGridColumn width="60" dataField="sex" headerText="性别">
<mx:DataGridColumn dataField="sex" headerText="性别"/>
</local:FooterDataGridColumn>
<local:FooterDataGridColumn dataField="annualsalary" headerText="年薪(RMB)">
<mx:DataGridColumn dataField="annualsalary" labelFunction="columnFunction"/>
</local:FooterDataGridColumn>
</local:columns>
</local:FooterDataGrid>
</s:Application>
DataGridFooter.as
package local
{
import flash.display.Shape;
import flash.display.DisplayObject;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.controls.listClasses.IDropInListItemRenderer;
import mx.controls.listClasses.IListItemRenderer;
import mx.controls.DataGrid;
import mx.core.EdgeMetrics;
import mx.core.IFlexDisplayObject;
import mx.core.UIComponent;
import mx.skins.Border;
import mx.core.mx_internal;
use namespace mx_internal;
public class DataGridFooter extends UIComponent
{
public function DataGridFooter()
{
super();
}
protected var overlay:Shape;
protected var dataGrid:DataGrid;
override protected function createChildren():void
{
dataGrid = parent as DataGrid;
overlay = new Shape();
addChild(overlay);
}
override protected function updateDisplayList(w:Number, h:Number):void
{
overlay.graphics.clear();
// destroy the old children
while (numChildren > 1)
removeChildAt(1);
// make new ones
var cols:Array = dataGrid.columns;
var firstCol:int = dataGrid.horizontalScrollPosition;
var colIndex:int = 0;
var n:int = cols.length;
var i:int = 0;
while (colIndex < firstCol)
{
// find first visible column;
if (cols[i++].visible)
colIndex ++;
}
var vm:EdgeMetrics = dataGrid.viewMetrics;
var lineCol:uint = dataGrid.getStyle("verticalGridLineColor");
var vlines:Boolean = dataGrid.getStyle("verticalGridLines");
overlay.graphics.lineStyle(1, lineCol);
var xx:Number = 0;
var yy:Number = 0;
while (xx < w)
{
var col:DataGridColumn = cols[i++];
if (col is FooterDataGridColumn)
{
var fdgc:FooterDataGridColumn = col as FooterDataGridColumn;
fdgc.footerColumn.owner = fdgc.owner;
var renderer:IListItemRenderer = (fdgc.footerColumn.itemRenderer) ?
fdgc.footerColumn.itemRenderer.newInstance() :
dataGrid.itemRenderer.newInstance();
renderer.styleName = fdgc.footerColumn;
if (renderer is IDropInListItemRenderer)
{
IDropInListItemRenderer(renderer).listData = new DataGridListData((fdgc.footerColumn.labelFunction != null) ? fdgc.footerColumn.labelFunction(col)
: fdgc.footerColumn.headerText,
fdgc.dataField, i - 1, null,
dataGrid, -1);
}
renderer.data = fdgc;
addChild(DisplayObject(renderer));
renderer.x = xx;
renderer.y = yy;
renderer.setActualSize(col.width - 1, dataGrid.rowHeight);
if (vlines)
{
overlay.graphics.moveTo(xx + col.width, yy);
overlay.graphics.lineTo(xx + col.width, h);
}
}
xx += col.width;
}
lineCol = dataGrid.getStyle("horizontalGridLineColor");
if (dataGrid.getStyle("horizontalGridLines"))
{
overlay.graphics.lineStyle(1, lineCol);
overlay.graphics.moveTo(0, yy);
overlay.graphics.lineTo(w, yy);
}
// draw separator at top of footer
lineCol = dataGrid.getStyle("borderColor");
overlay.graphics.lineStyle(1, lineCol);
overlay.graphics.moveTo(0, 0);
overlay.graphics.lineTo(w, 0);
}
}
}
FooterDataGrid.as
package local
{
import flash.display.DisplayObject;
import mx.controls.DataGrid;
import mx.core.IUIComponent;
import mx.core.EdgeMetrics;
import mx.styles.ISimpleStyleClient;
public class FooterDataGrid extends DataGrid
{
public function FooterDataGrid()
{
super();
}
protected var footer:DataGridFooter;
protected var footerHeight:int = 22;
override protected function createChildren():void
{
super.createChildren();
if (!footer)
{
footer = new DataGridFooter();
footer.styleName = this;
addChild(footer);
}
}
override protected function adjustListContent(unscaledWidth:Number = -1,
unscaledHeight:Number = -1):void
{
super.adjustListContent(unscaledWidth, unscaledHeight);
listContent.setActualSize(listContent.width, listContent.height - footerHeight);
footer.setActualSize(listContent.width, footerHeight);
footer.move(listContent.x, listContent.y + listContent.height + 1);
}
override public function invalidateDisplayList():void
{
super.invalidateDisplayList();
if (footer)
footer.invalidateDisplayList();
}
}
}
FooterDataGridColumn.as
package local
{
import mx.controls.dataGridClasses.DataGridColumn;
[DefaultProperty("footerColumn")]
public class FooterDataGridColumn extends DataGridColumn
{
public function FooterDataGridColumn()
{
super();
}
public var footerColumn:DataGridColumn;
}
}