Check Spark DataGrid cells' contents programmatically?

0
votes

I'm using the Spark DataGrid for the first time and finding it generally very usable. There's something I'd like to do with the contents of my grid now that I've drawn it though and I'm a bit stuck as how to proceed.

I'd like to make a function that runs through each cell of a certain column in the DataGrid, that checks each value against an Array of predefined values; if it finds a match, it should then highlight the cell as conflicting, by changing its colour.

I know you can access a particular cell's item renderer, by using the getItemRendererAt() function, and passing the column and row indices. But I can't see how I would, for example, loop through the values in each column.

I may well be going about this all wrong, in which case feel free to push me onto the right path. Equally if it's possible to do what I'm trying to do, I'd love to hear how.

Thanks!

2
actionscript-3flashapache-flexflex4flex-spark

2 Answers

1
votes

Actually, you should create your own <s:GridItemRenderer /> and use it as an itemRenderer of your dataGrid.

This way, you will be able to change the color of the cell depending on the data property of the <s:GridItemRenderer />.

Here is an example of how you could do it:

<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx = "http://ns.adobe.com/mxml/2009" 
   xmlns:s = "library://ns.adobe.com/flex/spark" 
   xmlns:mx = "library://ns.adobe.com/flex/mx" >

    <fx:Script>
        <![CDATA[
        private function isValid(value:uint):Boolean
        {
            //whatever;
            return true;
        }

        ]]>
    </fx:Script>

    <s:BorderContainer width="100%" height="100%">
        <s:borderStroke>
            <s:SolidColorStroke color="{isValid(data)?#00FF00:#FF0000}" />
        </s:borderStroke>
        <s:UITextField label="{data}" />
    </s:BorderContainer>

</s:GridItemRenderer>
1
votes

Using the example above, also Override the "set data" to change the color everytime you change the data, and not only on the grid creation

<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx = "http://ns.adobe.com/mxml/2009" 
                xmlns:s = "library://ns.adobe.com/flex/spark" 
                xmlns:mx = "library://ns.adobe.com/flex/mx"  >

<fx:Script>
    <![CDATA[
        import mx.controls.ColorPicker;
        import mx.events.FlexEvent;
        import mx.utils.ColorUtil;

        override public function set data(value:Object):void{
            super.data = value;

            if(data.different == 1){
                solidColor.color = 255;
            }
        }

    ]]>
</fx:Script>

<s:BorderContainer width="100%" height="100%">
    <s:borderStroke>
        <s:SolidColorStroke   id="solidColor" />
    </s:borderStroke>
    <s:UITextFieldGridItemRenderer label="{data.name}" />
</s:BorderContainer>
</s:GridItemRenderer>

Then the next steps are easy, clone your dataProvider from the datagrid and then compare both, and if the item is changed, just set "1" to ,for example, the flag "different" in the example above and then the itemRenderer will call itself and change de color automatically