Flex DataGrid带列统计功能

转自：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:"天幻",annualsalary:"30000"},{name:"鬼母",annualsalary:"45000"},{name:"癞皮狗",annualsalary:"150000"},{name:"叮当",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;	
	}	
}