為Flex 2 DataGrid加上行號

來源:互聯網
上載者:User

       英文原文:http://www.cflex.net/showfiledetails.cfm?ChannelID=1&Object=File&objectID=735

    有些時候,我們需要在DataGrid控制項中顯示當前行的行號,如果DataGrid的資料庫源(dataProvider)是一個Collection的話,這個問題就好處理了,只需要在DataGrid中增加一虛擬計算資料行,通過自訂該列的labelFunction,並在該Function調用getItemIndex中計算當前行的index並加上1就再以字元返回就可以了,注意:這些行號是動態產生的,總是按一定的順序,並且與其他列的排序沒有關係,如果你想讓行號隨著行的變化而變化的話(通常是對某一列進行排序時),那麼你就需要為所有行重新分配行號,這需要在dataProvider中自己用程式來控制,範例程式碼如下:

<?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>

 

null

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.