7 Replies Latest reply on Jun 16, 2009 5:16 AM by Dustin69

    How to bind image visibility in item renderer to whether item is selected

    Dustin69

      Hi all

       

       

      I have an ADG item renderer containing an image whose visible property I want to bind to whether the item is selected or not. I've simplified it down but the general idea is as follows:

       

       

      <mx:AdvancedDataGridRendererProvider columnIndex="0" columnSpan="0" rowSpan="1" depth="3">

           <mx:renderer>

                <mx:Component>

                     <mx:HBox width="100%" buttonMode="true" mouseChildren="false">

                          <mx:HBox width="50%" horizontalScrollPolicy="off">

                               <mx:Label text="{data.myVar1}"/>

                               <mx:Image source="@Embed(source='myImage.png')" visible="{}"/>

                     </mx:HBox>

                          <mx:HBox width="50%" horizontalScrollPolicy="off">

                               <mx:Label text="{data.myVar2}"/>

                               <mx:Image source="@Embed(source='myImage.png')" visible="{}"/>

                          </mx:HBox>

                     </mx:HBox>

                </mx:Component>

           </mx:renderer>

      </mx:AdvancedDataGridRendererProvider>

       

       

       

      I'm sure this will be an easy one for someone but I haven't been able to figure it out.

       

       

      Thanks all

      Dustin

        • 1. Re: How to bind image visibility in item renderer to whether item is selected
          *Prashant Shelke* Level 4

          According to my understanding you want to show this image only for selected row/s from datagrid. If so then i think set selected:Boolean property to Object of datagrid dataProvider list.Inititall this property will be false which will be visible = {data.selected}, & on itemClick event you can check in iteration as of dataProvider length


          if(rowCnt == dataGrid.selectedIndex)

          {

               dataGrid.dataProvider.getItemAt(rowCnt).selected = true;

          }

          else

          {

               dataGrid.dataProvider.getItemAt(rowCnt).selected = false;

          }


          by this way you can show images for mulitple selected rows also.

          1 person found this helpful
          • 2. Re: How to bind image visibility in item renderer to whether item is selected
            Dustin69 Level 1

            Thanks Prashant. How do I add the 'selected' bool to the dataprovider though ? Currently the dataprovider for the AdvancedDataGrid is set up as follows:

             

                    <mx:dataProvider>
                        <mx:GroupingCollection id="gc" source="{myArray}">
                             <mx:Grouping label="GroupingLabel">
                                <mx:GroupingField name="myName" compareFunction="myCompare1">
                                    <mx:summaries>
                                      <mx:SummaryRow summaryPlacement="group">
                                          <mx:fields>
                                            <mx:SummaryField dataField="myName"
                                                label="CountMyName" operation="COUNT"/>
                                         </mx:fields>
                                      </mx:SummaryRow>
                                    </mx:summaries>
                                   </mx:GroupingField>
                                <mx:GroupingField name="myType" compareFunction="myCompare2">
                                    <mx:summaries>
                                      <mx:SummaryRow summaryPlacement="group">
                                        <mx:fields>
                                            <mx:SummaryField dataField="myType"
                                                label="CountMyType" operation="COUNT"/>
                                        </mx:fields>
                                      </mx:SummaryRow>
                                    </mx:summaries>
                                 </mx:GroupingField>
                            </mx:Grouping>
                        </mx:GroupingCollection>
                    </mx:dataProvider>      

            • 3. Re: How to bind image visibility in item renderer to whether item is selected
              Dustin69 Level 1

              Hi Prashant,

               

              OK, I added a new Bool to the source array of the grouping collection for the dataprovider and have bound the image visible property and tested.

               

              It all works fine except for the fact that the image is not detecting changes to {data.selected}. Any ideas?

              • 4. Re: How to bind image visibility in item renderer to whether item is selected
                *Prashant Shelke* Level 4

                Have you added iteration on itemClick event as I mentioned above? & ensure "selected" attribute for object in dataProvider in [Bindable]

                • 5. Re: How to bind image visibility in item renderer to whether item is selected
                  Dustin69 Level 1

                  Thanks Prashant. Yeah I set everything up OK but it appears to be a data refresh issue. Anyway, I've designed the client a different way now to negate the need for this. Thanks very much for your help.

                  • 7. Re: How to bind image visibility in item renderer to whether item is selected
                    *Prashant Shelke* Level 4

                    Your always wel-come Dustin, anyways if you have designed your app in diff way then its ok. But still u want to knw how to deal with data refresh issue:

                    1. call dataProvider.refresh() after making any changes with objects underlying.

                    2. make sure attribute of object is Bindable


                    Cheers.