2 Replies Latest reply on Apr 27, 2010 1:36 PM by laxmidi

    Datagrid Itemrenderer: Display an Image or Text, Depending on Value

    laxmidi Level 1

      Hi,

       

      I'm trying to code an itemrenderer for my datagrid. I'd like the datagrid to show an image in one circumstance and the rest of the time just show the regular data. I've figured out how to make the itemrenderer produce the image, but I'm having problems returning the regular data. So, for example:

       

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">

           <mx:Script>

      <![CDATA[

               override public function set data (value:Object):void {

       

                     super.data = value;

       

                     if ( value.Grade == 'Colder') {

       

                     myImage.visible = true;

                     }

       

                     else {

                     myImage.visible = false;

                     //PSEUDO CODE: return the data to the datagrid. Display the data (which is text).

       

                     }

           }

       

      ]]>

      </mx:Script>

       

       

      <mx:Image id="myImage"  source="assets/image1.png"

      visible="false"/>

      </mx:Canvas>

       

      How do I return the text data to the datagrid, when "Grade" is not "Colder"? So, in one case show an image and in all other cases show the data, which is text. It should be an easy fix. Any advice?

       

      Thanks.

       

      -Laxmidi

        • 1. Re: Datagrid Itemrenderer: Display an Image or Text, Depending on Value
          Flex harUI Adobe Employee

          You can't "return the data".  The renderer instance is responsible for all

          visuals.  Use a child Label or UITextField to display text and make it

          visible when the Image is not.

          1 person found this helpful
          • 2. Re: Datagrid Itemrenderer: Display an Image or Text, Depending on Value
            laxmidi Level 1

            Hi harUI,

             

            Thanks you for the message and help. "Return" was the wrong term to use. My problem was accessing the data in the mx:Text.

             

            I kept trying to use a binding expression to bind the data to mx:Text, but it had to be done in the function-- not in the mxml. Flex, of course, didn't know what 'value' was until it was passed into the function.

             

            Here's the working version below:

             

             

            <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:text="flash.text.*">

                 <mx:Script>

                 <![CDATA[

                      override public function set data (value:Object):void {

                      if(value != null) {

             

                           super.data = value;

             

                           if ( value.Grade == 'Colder') {

                           myImage.visible = true;

                           }

                    

                      else {

                           myImage.visible = false;

                           myData.text = value.Grade;

                           myData.visible = true;

             

             

                           }  

             

                     }

            }

             

             

            ]]>

            </mx:Script>

             

             

            <mx:Image id="myImage"  source="assets/image1.png"

                  visible="false"/>

            <mx:Text id="myData"  visible="false" />

             

             

            </mx:Canvas>