Flex: Itemrenderer and custom css styles
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
<mx:itemRenderer>
<mx:Component>
}
else {
}
}
}
<mx:Label
text=”{data.firstName}” />
<mx:Label
text=”{data.lastName}” />
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
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.
Note:
If using the Advanced Datagrid you need to change ListBase to:
mx.controls.listClasses.AdvancedListBase
for this example to work.