How to change datagrid's row background color?

In your porject create a folder named components . In the components folder create a new actionscript class named MyDataGrid and paste into it contents from below:

package components {     import mx.controls.DataGrid;     import flash.display.Sprite;     import flash.display.Shape;     import mx.core.FlexShape;     import flash.display.Graphics;     import mx.controls.listClasses.ListBaseContentHolder;     public class MyDataGrid extends DataGrid     {         public function MyDataGrid()         {             super();         }         override protected function drawRowBackground(s:Sprite, rowIndex:int,                                             y:Number, height:Number, color:uint, dataIndex:int):void         {             var contentHolder:ListBaseContentHolder = ListBaseContentHolder(s.parent);              var background:Shape;             if (rowIndex < s.numChildren)             {                 background = Shape(s.getChildAt(rowIndex));             }             else             {                 background = new FlexShape();
                background.name = "background";
                s.addChild(background);
            }

            background.y = y;

            // Height is usually as tall is the items in the row, but not if
            // it would extend below the bottom of listContent
            var height:Number = Math.min(height,
                                         contentHolder.height -
                                         y);

            var g:Graphics = background.graphics;
            g.clear();

            var color2:uint;
            if(dataIndex<this.dataProvider.length)
            {
                if(this.dataProvider.getItemAt(dataIndex).color)
                {
                    color2 = this.dataProvider.getItemAt(dataIndex).color;
                }
                else
                {
                    color2 = color;
                }
            }
            else
            {
                color2 = color;
            }
            g.beginFill(color2, getStyle("backgroundAlpha"));
            g.drawRect(0, 0, contentHolder.width, height);
            g.endFill();
        }
    }
}

Now if your data providing array or array colection will have object with property named color in hexadecimals values, then this color will be applied to your datagrid row background color.

Below a simple Application code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:components="components.*">
<mx:Array id="mdp">
            <mx:Object color="0xff3377" message="przyklad 1"/>
            <mx:Object color="0xff1122" message="przyklad 2"/>
            <mx:Object color="0xff3322" message="przyklad 3"/>
            <mx:Object color="0xff1122" message="www.w3labs.pl"/>
            <mx:Object message="bez wlasciwosci kolor"/>
            <mx:Object message="bez wlasciwosci kolor"/>
            <mx:Object message="bez wlasciwosci kolor"/>
            <mx:Object message="bez wlasciwosci kolor"/>
</mx:Array>
<components:MyDataGrid dataProvider="{mdp}"  height="391"/>
</mx:Application>

Complete Source
Code in action

Polish version