Flex中显示DataGrid行号(row number)

      为公司开发产品管理系统，显示用户信息使用了DataGrid控件。第一列数据想要动态自增，但是好像没有相应的属性。经过查找实验，问题得以解决，忍住心中狂喜记录于此，前车后辙，省去后来同道朋友的一些麻烦……

 

DataGrid控件显示列是一个<mx:DataGridColumn >,它有一个属性：labelFunction。其作用是显示时候要调用的函数，等于对DataGrid的dataprovider（一般是 ArrayCollection ）提供的数据进行二次加工，获得最终想要的内容。

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml " layout="absolute"
    creationComplete="initApp()">
<mx:Script><![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;

[Bindable]private var _acDP:ArrayCollection;

public function initApp():void
{
   var oItem:Object;
   _acDP = new ArrayCollection();
   oItem = {Album:"The Lost Chord", Artist:"The Moody Blues", Price:"15.99" };
   _acDP.addItem(oItem);
   oItem = {Album:"Meddle", Artist:"Pink Floyd", Price:"17.99" };
   _acDP.addItem(oItem);
   oItem = {Album:"Trespass", Artist:"Genesis", Price:"18.99" };
   _acDP.addItem(oItem);

}//initApp

private function lfRowNum(oItem:Object,iCol:int):String
{
    var iIndex:int = _acDP.getItemIndex(oItem) + 1;
    return String(iIndex);
}

]]></mx:Script>

<mx:VBox>
<mx:DataGrid id="dgSource" dataProvider="{_acDP}"
     editable="true" >
    <mx:columns>
      <mx:Array>
        <mx:DataGridColumn headerText="Row#" labelFunction="lfRowNum" />
        <mx:DataGridColumn headerText="Album" dataField="Album" />
        <mx:DataGridColumn headerText="Artist" dataField="Artist" />
        <mx:DataGridColumn headerText="Price" dataField="Price" />
       </mx:Array>
    </mx:columns>
</mx:DataGrid>
</mx:VBox>
</mx:Application>

 

以上代码摘自网友的博客，这里想说一下注意事项：lfRowNum() 函数的两个参数一定要有，否则可能程序不能正常起到作用，万万不可忘记。

 

 

2010-11-28