I have come across a few cases where it was useful to have the column and row positions within an itemRenderer and so have made this sample to demonstrate how to do that.
Here is the application code:
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:script>
<!–[CDATA[
import mx.events.DataGridEvent;
import mx.collections.ArrayCollection;
private static var object1:Object = new Object();
object1.name = "Object 1";
private static var object2:Object = new Object();
object2.name = "Object 2";
private static var object3:Object = new Object();
object3.name = "Object 3";
private static var object4:Object = new Object();
object4.name = "Object 4";
private static var object5:Object = new Object();
object5.name = "Object 5";
private static var object6:Object = new Object();
object6.name = "Object 6";
private static var object7:Object = new Object();
object7.name = "Object 7";
private var things:Array = [object1, object2, object3, object4, object5, object6, object7]–>
[Bindable]
public var thingsAC:ArrayCollection = new ArrayCollection(things);
]]>
</mx:script>
<mx:datagrid id="dg" width="510" height="100">
draggableColumns="false" dataProvider="{thingsAC}"
horizontalScrollPolicy="on"
rowCount="4">
<mx:columns>
<mx:datagridcolumn width="200" headertext="Name" datafield="name">
<mx:datagridcolumn width="200" headertext="Column 2" itemrenderer="MyIR">
<mx:datagridcolumn width="200" headertext="Column 3" itemrenderer="MyIR">
<mx:datagridcolumn width="200" headertext="Column 4" itemrenderer="MyIR">
</mx:datagridcolumn>
</mx:datagridcolumn>
</mx:datagridcolumn>
</mx:datagridcolumn></mx:columns></mx:datagrid></mx:application>
Here is the code for my itemRenderer:
<mx:vbox xmlns:mx="http://www.adobe.com/2006/mxml" horizontalalign="center">
implements="mx.controls.listClasses.IDropInListItemRenderer"
preinitialize ="init();">
<mx:script>
<!–[CDATA[
import mx.controls.DataGrid;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.BaseListData;
import flash.events.Event;
import mx.collections.ArrayCollection;
[Bindable]–> public var _lbl:String;
private function onChange(event:Event):void{
var myListData:DataGridListData = DataGridListData(listData);
}
private var _listData:BaseListData;
private var myDG:DataGrid;
public function get listData():BaseListData {
return _listData;
}
public function set listData( value:BaseListData ):void {
_listData = value;
myDG = _listData.owner as DataGrid;
}
public function init():void {
addEventListener("dataChange", handleDataChanged);
}
public function handleDataChanged(event:Event):void {
// Cast listData to DataGridListData.
var myListData:DataGridListData = DataGridListData(listData);
var row:int=myListData.rowIndex+myDG.verticalScrollPosition;
//to make 1 based
var col:int=myListData.columnIndex+1;
_lbl="row: " + String(row) +
" column: " + String(col);
}
]]>
</mx:script>
<mx:label id="lbl" text="{_lbl}">
</mx:label>
</mx:vbox>
Here is the running application:
This movie requires Flash Player 9
Browse the source of this example.
Download a zipfile containing the source to this sample.
4 Comments »
Recent Comments