Monday, November 29, 2010

datagrid cell color

Hi

we can give color to datagrid cell based on the data using itemrenderers... here i am going to fill my color to datagrid cell in two ways. first is

by overriding the updateDisplayList method

override protected function updateDisplayList(unscaledWidth:Number,

unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var g:Graphics= graphics;
if(data.Salary<=15000){ g.clear(); g.beginFill(0XFF0000); g.drawRect(0,0,unscaledWidth, unscaledHeight); } }


another

way is using label's opaqueBackground property...





<mx:datagridcolumn datafield="Name">

<mx:itemrenderer>

<mx:component>

<mx:label opaquebackground="{data.Salary <= 15000?'0xFF0000':null}"/>

</mx:component>

</mx:itemrenderer>

</mx:datagridcolumn>






output shows whos salary is low or eq 15000 in red color :



if we click on header of the datagrid to sort the column after savaral clicks ouput is like below
first datagrid is using updateDisplayList() method and second datagrid is using label opaqueBackground property...






so opaqueBackground property is simple and very effctive...



Happy Flexing....

No comments:

Post a Comment