Flex 2 Datagrid not highlighting row

I had an issue in a Flex 2 project yesterday where a Datagrid would not highlight the selected row. All the styles were set up for this but it still would not work. The unfortunate matter is that this project (at least for the time being) is stuck in Flex 2 which is not open source.

I dug into the Flex 3 source code for Datagrid (I don’t recommend this unless you need to). I found a method called drawSelectionIndicator() which gets called to set up the selection. There are several methods that get called overall but the one that finally does the background color is drawRowBackground(). Somewhere down the line, the color being passed to drawRowBackground was not what was set in the stylesheet (see below). So, I created a custom DataGrid class that extended the original and overrode the drawRowBackground method. The source code is from Flex 2 so I made a few changes to make it work in Flex 2. Here it is:

override protected function drawRowBackground(s:Sprite, rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void
{
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 tempHeight:Number = height;
var height:Number = Math.min(height,
s.height -
y);
if( height < 0 )
height = tempHeight;

// set the row color to what was passed in
var rowColor:uint = color;
// if the row is selected, override the row color with the selectionColor from the stylesheet
if( this.selectedIndices.indexOf(rowIndex) != -1 )
{
rowColor = getStyle("selectionColor");
}
var g:Graphics = background.graphics;
g.clear();
g.beginFill(rowColor, getStyle("backgroundAlpha"));
g.drawRect(0, 0, this.width, height);
g.endFill();
}

The main addition here is the check for this.selectedIndices.indexOf(rowIndex) != -1. This checks to see if the row is selected or not. If it is, it gets the selectionColor from the styles and uses that instead of the default color that was passed in.

This might not be the most elegant solution but in my case it worked.

Oh yeah, here are the styles for the DataGrid that I referenced:

.QuoteList
{
backgroundAlpha: 1;
backgroundColor: #000000;
alternatingItemColors: #000000, #040084;
headerColors: #ebe9ee, #cccccc;
horizontalGridLines: true;
horizontalGridLineColor: #ffffff;
verticalGridLineColor: #ffffff;
rollOverColor: #4844c8;
textRollOverColor: #ffffff;
borderThickness: 0;
selectionColor: #4844c8;
color: #ffffff;
textSelectedColor: #ffffff;
headerStyleName: "QuoteListHeaderStyle";
}

.QuoteListHeaderStyle {
color: #000000;
fontWeight: bold;
textDecoration: none;
}