1 Reply Latest reply on Feb 24, 2011 11:56 PM by Flex harUI

    Why won't List display ArrayCollection?


      Hi all,


      I cannot for the life of me figure out why the List I created will not display any of the values in my ArrayCollection.  I've read and watched so much databinding material, that I think it must be something extremely small or absolutely huge that I'm missing.  If anyone could give me a pointer or two it would be so greatly appreciated, I've been on this for days now.


      I have two .mxml's (MyCards and NewCard).  The idea is that in the NewCard View the user types in a Title, and text for side 1 and side 2 of a flash card.  The program then saves all 3 of these properties into an Object and puts that Object into an ArrayCollection.  This ArrayCollection is display in a List in the MyCards.mxml file.  The problem is, nothing shows up.


      Here's part of MyCards.mxml showing how I'm implementing and binding the ArrayCollection to the List:



                     public var card:Object = new Object();
                     public var nc:NewCard = new NewCard(); // create new instance of NewCard
                     public var cards:ArrayCollection = new ArrayCollection();
                     public function add():void
                          cards.addItem(nc.myCard); // add new Item to ArrayCollection 'cards'

                <s:Button label="Delete"/>
                <s:Button label="Home" click="button1_clickHandler(event)" skinClass="skins.homeButtonSkin"/>
           <s:Image x="0" y="-80" height="603" source="mainapp1.jpg"/>
           <s:List id="myCardsList" x="10" y="10" left="0" right="0" top="0" bottom="0" width="1004"
                     height="500"  dataProvider="{cards}"
                     enabled="true" >
                          <s:MobileItemRenderer label="{data.Title}"/>




      And then here's how I'm 'adding' the cards in the NewCard.mxml:



                     public var myCard:CardVO = new CardVO(); // create new instance of CardVO

                     public function button2_clickHandler(event:MouseEvent):void  // save button
                          var myc:MyCards = new MyCards();  
                          //card.fTitle = titleCard.text;
                          titleCard.text = "Card Added!";
           <s:TextInput id="titleCard" x="240" y="10" height="62" chromeColor="#515851" color="#060606"
                           contentBackgroundAlpha="1.0" contentBackgroundColor="#FFFFFF" text="{myCard.Title}" change="{myCard.Title = titleCard.text}"/>
                id = "groupt" x="161" y="88" width="703" height="357"  >
                <!-- text property of mtext1 and mtext2 is bound and returned to the get/set functions in CardVO in the 'change' event-->
                <!-- change sets setter values to those retrieved from textAreas-->
                <s:TextArea id="mtext2" visible="false" x="0" y="0" width="703" height="357"
                               color="#000000" contentBackgroundAlpha="1.0"
                               contentBackgroundColor="#FFFFFF" editable="true" enabled="true"
                               paddingTop="70" text="{myCard.Side2}" change = "{myCard.Side2 = mtext2.text}"
                <s:TextArea id="mtext1" x="0" y="0" width="703" height="357" color="#030303"
                               contentBackgroundAlpha="1.0" contentBackgroundColor="#FFFFFF" editable="true"
                               enabled="true" fontFamily="Arial" fontStyle="normal" fontWeight="normal"
                               lineThrough="false" paddingTop="70" text="{myCard.Side1}" change="{myCard.Side1 = mtext1.text}"
                               textAlign="center" textDecoration="none" verticalAlign="middle"/>