8 Replies Latest reply on Jul 4, 2011 12:16 AM by Abhay_flex

    Problem with mx:repeater

    Abhay_flex

      I am not able to get repeater to work. I have a flex mobile application where in I have created a view component. In this view component, I have to use repeater for dynamic radio button list. I have defined mx namespace ( see below ) but it is not prompting the repeater component when I start typing <mx:

       

      <s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

      xmlns:mx="library://ns.adobe.com/flex/mx"

      xmlns:s="library://ns.adobe.com/flex/spark"

      overlayControls="false" title="Title" initialize="initData()">

       

      <fx:Declarations>

      <s:RadioButtonGroup id="radiogroup1"/>

      <!-- Place non-visual elements (e.g., services, value objects) here -->

      </fx:Declarations>

       

      <fx:Script>

      <![CDATA[

      import mx.collections.ArrayCollection;

       

       

       

      // Initialize initDG ArrayCollection variable from the ArrayCollection.

      public function initData():void {

      }

       

      ]]>

      </fx:Script>

       

      <s:VGroup x="305" y="164" width="402" height="202" gap="10" paddingLeft="20" paddingTop="20">

      <s:RadioButton width="140" label="Button 1" groupName="radiogroup1"/>

      <s:RadioButton width="151" label="Button 2" groupName="radiogroup1"/>

      </s:VGroup>

       

       

      </s:View>

       

      I also tried to use the repeater in actionscript, even there, I am not seeing mx.core.Repeater.  Is that a library version issue ? 

        • 1. Re: Problem with mx:repeater
          Karl_Sigiscar_1971 Level 3

          You can use the SkinnableDataContainer, specify and itemRenderer and set the autoDrawBackground property to true or false in your renderer.

          • 2. Re: Problem with mx:repeater
            Abhay_flex Level 1

            Do you have an example / smaple code  ?   also is this an alternative to using Repeater ?

            • 3. Re: Problem with mx:repeater
              Karl_Sigiscar_1971 Level 3

              Yes, this is an alternative.

               

              Using <mx:Repeater> was already not best practice in Flex 3. It was best using <mx:List> for performance reasons. You had to use <mx:Repeater> only if you wanted to get rid of the background color in item renderers, but this is now possible with the new autoDrawBackground item renderer property.

               

               

               

              <s:SkinnableDataContainer itemRenderer="com.mycompany.MyItemRenderer">
                  <s:layout><s:VerticalLayout horizontalAlign="center"/></s:layout>
                  <s:ArrayCollection>
                      <fx:Object firstName="Deepa" lastName="Subramaniam" phoneNumber="415-555-1111" />
                      <fx:Object firstName="Glenn" lastName="Ruehle" phoneNumber="415-555-2222" />
                      <fx:Object firstName="Ely" lastName="Greenfield" phoneNumber="415-555-3333" />
                      <fx:Object firstName="Alex" lastName="Harui" phoneNumber="415-555-4444" />
                      <fx:Object firstName="Ryan" lastName="Frishberg" phoneNumber="415-555-5555" />
                  </s:ArrayCollection>
              </s:SkinnableDataContainer>

               

              MyItemRenderer.mxml
              

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

              <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  xmlns:mx="library://ns.adobe.com/flex/mx"
                                  height="20"
                                  autoDrawBackground="false">    
                   <fx:Script>
                        <![CDATA[              
                             import com.
              mycompany.EmbeddedAssets;              
                        ]]>
                   </fx:Script>

                   <s:layout>
                        <s:HorizontalLayout />
                   </s:layout>
                  
                   <s:BitmapImage source="{data.source}"/>
                   <s:Spacer width="10" />
                   <s:Label text="{data.label}"/>
                  
              </s:ItemRenderer>
              • 4. Re: Problem with mx:repeater
                Karl_Sigiscar_1971 Level 3

                Another alternative is DataGroup:

                 

                <s:DataGroup itemRenderer=...>  
                    <s:dataProvider>  
                        <mx:ArrayList> 
                            <s:Button/> 
                            <s:Button/> 
                            <s:Button/> 
                        </mx:ArrayList>  
                    </s:dataProvider>  
                </s:DataGroup>
                • 5. Re: Problem with mx:repeater
                  Abhay_flex Level 1

                  oK..THNX ..Let me try that out.  btw, how do I get the itemrenderer to display a radio button in the radiobutton group ?

                   

                  I am not able to get this to work : here is my code-

                   

                  application mxml

                  ================

                   

                  ...

                  ...

                   

                  <s:ArrayCollection id="rad">

                  <s:source>

                  <fx:Object label="Sub Feature 1" data="f1"/>

                  <fx:Object label="Sub Feature 2" data="f2"/>

                  <fx:Object label="Sub Feature 3" data="f3"/>

                  <fx:Object label="Sub Feature 4" data="f4"/>

                  <fx:Object label="Sub Feature 5" data="f5"/>

                  <fx:Object label="Sub Feature 6" data="f6"/>

                  </s:source>

                  </s:ArrayCollection>

                   

                  ...

                  ...

                   

                   

                   

                  <s:DataGroup id="sfList" x="305" y="168" width="402" height="209" itemRenderer="MyItemRenderer1" dataProvider="{rad}">

                  </s:DataGroup>

                   

                   

                  MyItemRenderer1.mxml

                  ==================

                   

                   

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

                  <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"

                  xmlns:s="library://ns.adobe.com/flex/spark"

                  xmlns:mx="library://ns.adobe.com/flex/mx"

                  height="20"

                  autoDrawBackground="false">    

                   

                  <s:layout>

                  <s:BasicLayout/>

                  </s:layout>

                   

                  <s:RadioButton value="{data.label}" groupName="radiogroup1"/>

                   

                  </s:ItemRenderer>

                   

                  It shows me only 1 radio button with no label

                   

                  itemrenderer.JPG

                  • 6. Re: Problem with mx:repeater
                    Abhay_flex Level 1

                    I was able to get it to work using s:SkinnableDataContainer

                     

                    application

                    ==========

                    <s:ArrayCollection id="rad">

                    <s:source>

                    <fx:Object label="Sub Feature 1" grp="radiogroup1"/>

                    <fx:Object label="Sub Feature 2" grp="radiogroup1"/>

                    <fx:Object label="Sub Feature 3" grp="radiogroup1"/>

                    <fx:Object label="Sub Feature 4" grp="radiogroup1"/>

                    </s:source>

                    </s:ArrayCollection>

                     

                    <s:SkinnableDataContainer id="sfList" x="305" y="168" width="402" height="209" itemRenderer="MyItemRenderer1" dataProvider="{rad}"/>

                     

                     

                    item renderer

                    ==========

                    <s:RadioButton label="{data.label}" groupName="radiogroup1"/>

                     

                     

                    But all the radio buttons are not part of same group evenif I am providing same groupname in the item renderer. Why could that be ?

                    • 8. Re: Problem with mx:repeater
                      Abhay_flex Level 1

                      Yep ! Exactly what I was looking for.  Thanks.

                       

                      In my dataprovider, I was setting groupname as a value, and a reference was what I needed.

                       

                      so

                       

                      <fx:Object val="One" gr="{radiogroup1}" />

                       

                      instead of

                       

                      <fx:Object val="One" gr="radiogroup1" />