Flex: Changing the colour of the sort part of an AdvancedDataGrid

Question

I have a very dark background to my grids so I need to make all the markings in the headers white. I've been able to do that w/everything except the arrow icons in the AdvancedDataGrid. http://flexvenom.wordpress.com/2007/12/04/howto-setting-a-custom-sortitemrenderer-to-the-advanceddatagrid/ has a solution, but then it kills the sort sequence number. How can I just make everything in the header (except the background) white?

I'm running the 3.5 SDK.

Answer 1

In the end it was a lot simpler than what I was trying (having an item renderer draw the whole sort part) but it was still pretty complicated, in that I had to make 2 very light-weight renderers. I could have just had the sequence number just stay one colour, but decided to get a little fancy and have a mouse over colour and a normal colour.

The header renderer (ubicAdvancedDataGridHeaderRenderer.mxml) is:

<?xml version="1.0" encoding="utf-8"?>
<mx:AdvancedDataGridHeaderRenderer xmlns:mx="http://www.adobe.com/2006/mxml"
      color="{ColourGlobals.TEXT_AGAINST_DARK}"
      mouseOver="bMouseOver = true" mouseOut="bMouseOver = false">
    <mx:Script><![CDATA[
        public var bMouseOver:Boolean = false;
    ]]></mx:Script>
</mx:AdvancedDataGridHeaderRenderer>

then the sort renderer is:

package assets.GridTools {
import mx.controls.advancedDataGridClasses.AdvancedDataGridSortItemRenderer;

public final class ubiAdvancedDataGridSortItemRenderer extends AdvancedDataGridSortItemRenderer {
    override protected function commitProperties():void {
        super.commitProperties();
        const oHeader:ubicAdvancedDataGridHeaderRenderer = owner as ubicAdvancedDataGridHeaderRenderer;
        label.textColor = oHeader.bMouseOver ? ColourGlobals.DARK : ColourGlobals.TEXT_AGAINST_DARK;
    }
}
}

Don't ask my why I made one Flex and the other AS. It works, so not being broke, I ain't gonna fix it.