不知道爲什麼列表不會顯示來自ArrayCollection的數據

Question

我正在製作一個閃存卡應用程序，並且正在使用ArrayCollection對象來存儲每張卡的單個數據。當用戶點擊'保存'按鈕時，兩個textAreas和'標題'textinput中的文本將作爲一個包含閃存卡文本的.title，.side1和.side2屬性的對象存儲在AC中。

我在一個單獨的課程中創建了一個列表我想要顯示用戶創建的每張卡片的標題，但經過幾天的研究和環視後，我仍然無法使顯示列出標題。
如果有人能指出我在正確的方向，它將非常感激。我NewCard.mxml的

部分：

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

<fx:Script> 
    <![CDATA[ 


     import flash.events.EventDispatcher; 

     import mx.collections.ArrayCollection; 

     import spark.effects.SlideViewTransition; 

     import views.MyCards; 


     protected function button1_clickHandler(event:MouseEvent):void // back button 
     { 

      { 
       navigator.pushView(views.MyFlashCardsHome, event.relatedObject); 
      } 
     } 
     protected function button2_clickHandler(event:MouseEvent):void // save button 
     { 

      var myc:MyCards = new MyCards(); 
      var card:Object = new Object(); 

      myc.add(); 
      titleCard.text = "Card Added!"; 

     } 

     protected function button3_clickHandler(event:MouseEvent):void // flip button 
     { 
      rotateEffect.play(); 
      if(rotateEffect.isPlaying) 
      { 
       if(mtext1.visible) 
       { 
        mtext2.visible = true; 
        mtext1.visible = false; 
        //mtext2.text = "two"; 
        groupt.layoutDirection = "rtl"; 
       } 
       else 
       { 
        mtext2.visible = false; 
        mtext1.visible = true; 
        //mtext1.text = "one"; 
        groupt.layoutDirection = "rtl"; 

       } 
      } 

     } 


     protected function button4_clickHandler(event:MouseEvent):void // push home button 
     { 
      var slideViewTransition:SlideViewTransition = new SlideViewTransition(300, SlideViewTransition.SLIDE_RIGHT); 
      navigator.pushView(views.HomePage, event.relatedObject, slideViewTransition); 
     } 
    ]]> 
</fx:Script> 

<fx:Declarations> 
    <s:Rotate3D id="rotateEffect" duration="300" target="{groupt}" 
       angleYFrom="0" angleYTo="180" 
       autoCenterTransform="true" 
       effectStart="flipButton.enabled=false;" 
       effectEnd="flipButton.enabled=true;"/> 
</fx:Declarations> 

<s:actionContent> 
    <s:Button height="50" label="Study" click="button1_clickHandler(event)" cornerRadius="0" 
       fontFamily="_sans"/> 
    <s:Button height="62" click="button4_clickHandler(event)" cornerRadius="0" skinClass="skins.homeButtonSkin"/> 
</s:actionContent> 

<s:Image x="0" y="-80" width="1024" height="600" source="@Embed('mainapp1.jpg')"/> 

<s:TextInput id="titleCard" x="240" y="10" height="62" chromeColor="#515851" color="#060606" 
      contentBackgroundAlpha="1.0" contentBackgroundColor="#FFFFFF" text="Title"/> 

<s:SkinnableContainer 
    id = "groupt" x="161" y="88" width="703" height="357" > 

    <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="Enter Text Here: (Side Two)" textAlign="center"/> 

    <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="Enter Text Here: (Side One)" 
       textAlign="center" textDecoration="none" verticalAlign="middle"/> 

</s:SkinnableContainer> 
<s:Button x="763" y="10" height="62" label="Save" click="button2_clickHandler(event)" 
      cornerRadius="0" fontFamily="_sans"/> 

<s:Label x="5" y="34" color="#49A6D6" fontFamily="Georgia" fontStyle="italic" fontWeight="bold" 
     paddingLeft="25" text="My"/> 

<s:Label x="68" y="34" width="73" color="#E0B338" fontFamily="Georgia" fontStyle="italic" 
     fontWeight="bold" paddingLeft="0" text="Flash"/> 

<s:Label x="138" y="34" color="#49A6D6" fontFamily="Georgia" fontStyle="italic" fontWeight="bold" 
     text="Cards!"/> 

<s:Button id="flipButton" x="468" y="460" height="50" label="Flip" chromeColor="#2428D8" 
      click="button3_clickHandler(event)" fontFamily="_sans"/> 

我MyCards.mxml的

部分：

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

<fx:Script> 
    <![CDATA[ 
     import flash.events.IOErrorEvent; 
     import flash.filesystem.File; 
     import flash.filesystem.FileMode; 
     import flash.filesystem.FileStream; 

     import mx.collections.ArrayCollection; 
     import mx.collections.ArrayList; 
     import mx.events.CollectionEvent; 
     import mx.events.FlexEvent; 

     import spark.effects.SlideViewTransition; 
     import spark.events.IndexChangeEvent; 

     import views.NewCard; 



     public var file:File; 
     public var fileStream:FileStream; 
     public var fileName:String = "Initial String"; 
     private var directory:String = "SimpleSaveFromAIR"; 

     public var nc:NewCard = new NewCard(); 
     public var card:Object = new Object(); 


     [Bindable] 
     public var cards:ArrayCollection = new ArrayCollection(); 



     protected function button1_clickHandler(event:MouseEvent):void // pushed home button 
     { 
      var svt:SlideViewTransition = new SlideViewTransition(300, SlideViewTransition.SLIDE_RIGHT); 
      navigator.pushView(views.HomePage, event.relatedObject, svt); 
     } 



     public function add():void 
     { 
      var nc:NewCard = new NewCard(); 
      var card:Object = new Object(); 

      card.fTitle = nc.titleCard.text; //adding text to object from NewCard.mxml class 
      cards.addItem(card); 


     } 


     /* public function save():void 
     { 
      file = File.documentsDirectory.resolvePath(directory + "/" + fileName); 
      fileStream = new FileStream(); 
      fileStream.open(file, FileMode.WRITE); 
      fileStream.writeObject(cards); 
      fileStream.close(); 
     } */ 

     public function myCardsList_creationCompleteHandler(event:FlexEvent):void 
     { 
      cards.addEventListener(CollectionEvent.COLLECTION_CHANGE, refreshList); 
      trace(cards.list); // no data at all shows up here 

     } 

     private function refreshList(event:CollectionEvent):void 
     { 
      trace("cards refreshed "+ cards.list); 
     } 

     public function testButton_clickHandler(event:MouseEvent):void 
     { 
      card.fTitle = nc.titleCard.text; 
      cards.addItem(card); 
      //trace(cards.list); // add data that has been added shows up here 

     } 



    ]]> 
</fx:Script> 
<s:actionContent> 
    <s:Button id="testButton" label="Button" click="testButton_clickHandler(event)" /> 
    <s:Button label="Delete"/> 
    <s:Button label="Home" click="button1_clickHandler(event)" skinClass="skins.homeButtonSkin"/> 
</s:actionContent> 

<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}" labelField="fTitle" 
     enabled="true" > 
    </s:List> 

再次任何幫助感激。

CardVO類：

package 

{ 公共類CardVO { 私人VAR _title：字符串; //從getter/setter函數返回的值 private var _side1：String; private var _side2：String;

//get the "Title", "Side1" and "Side2" values from textAreas (later) and set them 
    // above variables 

    public function get Title():String {return _title;} 
    public function set Title(value:String):void { _title = value; } 

    public function get Side1():String {return _side1;} 
    public function set Side1(value:String):void {_side1 = value;} 

    public function get Side2():String {return _side2;} 
    public function set Side2(value:String):void {_side2 = value;} 


} 

}

** NEWCARD片段：**

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

....

<!-- 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}" 
       textAlign="center"/> 

    <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"/> 

</s:SkinnableContainer> 

MyCards片段：

public function add():void 
     { 

      var nc:NewCard = new NewCard(); // create new instance of NewCard 
      cards.addItem(nc.myCard); // add new Item to ArrayCollection 'cards' 
      trace(cards.list); 
     } 

Mycards清單代碼

<s:List id="myCardsList" x="10" y="10" left="0" right="0" top="0" bottom="0" width="1004" 
     height="500" change="myCardsList_changeHandler(event)" dataProvider="{cards}" 
     enabled="true" > 
    <s:itemRenderer> 
     <fx:Component> 
      <s:MobileItemRenderer label="{data.title}"/> 
     </fx:Component> 
    </s:itemRenderer> 
    </s:List> 

Answer 1

假設你正在使用的List組件，您應該可以指定要使用labelField屬性顯示的領域。

<s:List id="myFlashCardList" dataProvider="{cards}" labelField="fTitle"/> 

編輯2：

好像你正試圖在這裏做（和糾正我，如果我錯了）什麼，是讓用戶創建NewCard的新實例對象，然後將其添加到您的cards ArrayCollection。您的列表將顯示用戶創建的卡片的標題。

假如是這樣的話，我認爲你正在做的有點複雜得多，它需要的。 ArrayCollections可以保存任何類型的類或對象的，所以你不必創建一個新的Object，並把它添加到ArrayCollection中每次添加新卡的時間。

我會做的是創建一個Card類和使用NEWCARD組件填充它。完成後，將該Card類添加到ArrayCollection。事情是這樣的：

的CardVO類：

package 
{ 
    public class CardVO 
    { 
    private var _title:String; 
    private var _side1:String; 
    private var _side2:String; 


    public function get Title():String { return _title; } 
    public function set Title(value:String):void { _title = value; } 

    public function get Side1():String { return _side1; } 
    public function set Side1(value:String):void { _side1 = value; } 

    public function get Side2():String { return _side2; } 
    public function set Side2(value:String):void { _side2 = value; } 
    } 
} 

然後在您的NewCard.mxml文件使用一個CardVO來存儲數據：

<fx:Script> 
    <![CDATA[ 

     ... 

     [Bindable] public var myCard:CardVO = new CardVO(); 

     ... 
    ]]> 
</fx:Script> 
<s:SkinnableContainer id = "groupt"> 
    <s:TextArea id="mtext2" text="{myCard.Side2}" change="{myCard.Side2 = mtext2.text}"/> 

    <s:TextArea id="mtext1" text="{myCard.Side1}" change="{myCard.Side1 = mtext1.text}" /> 
</s:SkinnableContainer> 

然後在用戶創建後他們的卡，您將CardVO對象傳遞給您的ArrayCollection。

... 
public function add():void 
{ 
    var nc:NewCard = new NewCard(); 

    cards.addItem(nc.myCard); 
} 
... 

這是一個非常簡短的例子，所以隨意問任何沒有意義的問題。如果您還沒有這樣做，您還應該查看Data Binding。一旦掌握了它，它將爲您節省大量時間並使您的應用程序更加高效。 :)