Flex 4 Datagrid s:MXDataGridItemRenderer issue - default styles are lost?

Question

All, I have implemented a HeaderRenderer on all my Datagrid columns. When I do this, it appears that all the default DataGrid column header styles are being lost, eg:

When I hover over a column header, the default in the DataGrid is to show it in another colour (same colour as the row selection colour) - this is not happening now.
When I click on a column header, the default in the DataGrid is to show it in another colour (same colour as the row selection colour) - this is not happening now.

Do I have re-apply these styles in my s:MXDataGridItemRenderer ? How is this done...

My renderer code is below...

<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                      xmlns:s="library://ns.adobe.com/flex/spark" 
                      xmlns:mx="library://ns.adobe.com/flex/mx" 
                      focusEnabled="true">
<s:states>
    <s:State name="none" />
    <s:State name="asc" />
    <s:State name="desc" />
</s:states>

<!-- border - bottom -->
<s:Rect bottom="0" right="0" left="0" height="1">
    <s:fill>
        <s:SolidColor color="0x9C9C9C" />
    </s:fill>
</s:Rect>
<!-- border - top -->
<s:Rect top="0" right="0" left="0" height="1">
    <s:fill>
        <s:SolidColor color="0x9C9C9C" />
    </s:fill>
</s:Rect>
<s:HGroup verticalAlign="middle" width="100%">
    <s:HGroup horizontalAlign="left" width="100%" paddingLeft="5">
    <s:Label id="lblData"  width="100%"
             top="0" left="5" right="0" bottom="0" 
             paddingTop="5" paddingBottom="5"
             verticalAlign="middle"
             color="black"
             text="{dataGridListData.label}"
             maxDisplayedLines="1"
             />
    </s:HGroup>
    <s:HGroup horizontalAlign="right" verticalAlign="middle" paddingRight="2" >
        <s:Label id="lblcolCount" 
                 top="0" left="0" right="0" bottom="0" 
                 paddingTop="5" paddingBottom="5"
                 verticalAlign="middle"
                 color="black"
                 text="{colCount}" />
        <mx:Image id="image_down" top="0" left="0"  bottom="0"
                  source.asc="{GridColumnSortControlAscending}"  verticalAlign="middle"
                  source.desc="{GridColumnSortControlDecending}"/>
    </s:HGroup>

</s:HGroup>
<fx:Script>
    <![CDATA[

        [Bindable]
        public var colCount:String = "";
          ]]>
</fx:Script>

I added the Flex tag to get your question more attention. – Jason Towne May 26 '11 at 15:10 — Jason Towne, May 26 '11 at 15:10

score 0 · Answer 1 · answered May 26 '11 at 15:49

0

Yes, you would lose all the styles when creating a custom renderer. You could look at the code for DataGridHeader and try to duplicate it, but personally I think it's too much work. I would just add a 'default' header renderer to all columns that you set your own style, then just add your new renderer from there.

Plus, who would ever want default Flex3 styling? yuck :P

answered May 26 '11 at 15:49

J_A_X

12,857
1
25
31

2

Thanks, but I actually found the solution...need to set the property autoDrawBackground="false" in the s:MXDataGridItemRenderer tag. Who would have guessed!!! - not obvious anywhere... – Mark May 26 '11 at 16:50

Flex 4 Datagrid s:MXDataGridItemRenderer issue - default styles are lost?

1 Answers1