TOP →
覚え書き →
Flex → This Page
Flexサンプル
DataGrid 行に行番号表示
サンプル概要
DataGrid の行内に行番号を表示します。
サンプルイメージ
サンプルソース
単純に DataGridColumn の labelFunction を実装してやるだけで実現できます。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.collections.XMLListCollection;
import mx.controls.dataGridClasses.DataGridColumn;
/** 表示用XML */
[Bindable]
private var xmldata:XML =
<root>
<List text="AAAAAAAAAA" number="1" />
<List text="BBBBBBBBBB" number="2" />
<List text="CCCCCCCCCC" number="3" />
<List text="DDDDDDDDDD" number="4" />
<List text="EEEEEEEEEE" number="5" />
</root>;
[Bindable]
public var list:XMLListCollection = new XMLListCollection(xmldata.List);
/**
* 行番号を表示
*
* @param i_item アイテムオブジェクト
* @param i_column カラム列
*/
private function dispRowNum(i_item:Object, i_column:DataGridColumn):String {
var index:int = list.getItemIndex(i_item) + 1;
return String(index);
}
]]>
</mx:Script>
<!-- データグリッド -->
<mx:DataGrid id="dataGrid" x="10" y="10" dataProvider="{list}">
<mx:columns>
<mx:DataGridColumn headerText="行番号" labelFunction="dispRowNum"/>
<mx:DataGridColumn headerText="文字" dataField="@text"/>
<mx:DataGridColumn headerText="数字" dataField="@number"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
|
サンプルソースのダウンロード
サンプルのダウンロード(ZIP圧縮)(Flex builder 2 用のプロジェクトファイルも同梱)
更新履歴
2008/04/08 本ページ新規追加
TOP →
覚え書き →
Flex → This Page