Sharing the Code

Programming stuff that might be useful to others

Custom Item Renderer in Flex

The documentation isn’t very good on how to create custom item renderers for things like data grids. Below is an example of a ‘blank’ one. You extend Canvas and implement IDropInListItemRenderer and update it’s appearence in the ‘data’ setter. Remeber to reset the visual state each time e.g. remove all children, since item renderers are reused in difference places of the parent component.

Sample.mxml:
[sourcecode language=’xml’]








[/sourcecode]

BlankItemRenderer.as:
[sourcecode language=’java’]
package com.markhorgan.project.view.components
{
import mx.controls.listClasses.IDropInListItemRenderer;
import mx.containers.Canvas;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.BaseListData;

public class BlankItemRenderer extends Canvas implements IDropInListItemRenderer
{
private var _listData:BaseListData;

[Bindable(“dataChange”)]
public function get listData():BaseListData
{
return _listData;
}

public function set listData(value:BaseListData):void
{
_listData=value;
}

public override function set data(value:Object):void
{
super.data=value;
var cellData:Object=data[DataGridListData(listData).columnIndex];
//Use cellData to render the cell

}

}
}
[/sourcecode]

Comments are closed