I ran into issues with Flex Itemrenderers after applying custom styles to a Datagrid.

Displaying the data in a standard Datagrid Column worked fine, such as:

<mx:DataGridColumn headerText="First Name" dataField="firstName" >

But an itemrenderer component just ignored all style declarations.

All I wanted to achieve is having my itemrenderer using the same text color and
textSelectedColor as I declared for the DataGrid in my css file.

After a bit of research I found a solution that works.

In order to use some declared styles from the ListBase (in my case the Datagrid) in my
custom itemrenderer I had to override its updateDisplayList Method.

My inline itemrenderer now looks like this



import mx.controls.listClasses.ListBase;
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
super.updateDisplayList(unscaledWidth, unscaledHeight )  ;
if(owner is ListBase) {
if(ListBase(owner).isItemSelected(data) ) {

setStyle(“color”, ListBase(owner).getStyle(“textSelectedColor”) );


else {

setStyle(“color”, ListBase(owner).getStyle(“color”) );





text=”{data.firstName}” />

text=”{data.lastName}” />




Now this seems all a bit weird cause it has to be done for each itemrenderer and each style that needs to be applied.
But it is the only quick solution I could find so far.

If using the Advanced Datagrid you need to change ListBase to:


for this example to work.