Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Adobe AIR Development

Reply
Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Issue Putting Data from ArrayCollection into List

I'm having trouble getting data that has been pulled from a textArea and put into an ArrayCollection to be displayed in a List.  The data is being saved and then read as a file from local storage.  When I run the application, nothing appears in the created list even though I get no compile-time errors.  Thank you for any help.

 

Here is my List code:

 

 

<fx:Script>
 <![CDATA[
 import dh.DataHandling;
 import mx.collections.ArrayCollection;
 import mx.collections.ArrayList;
 import mx.events.FlexEvent;
 import spark.effects.SlideViewTransition;
 
 [Bindable]
 private var dataR:DataHandling = new DataHandling();
 
 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);
 }
 
 ]]>
 </fx:Script>
 
 
 <fx:Declarations>
 <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 <s:actionContent>
 <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" width="1004" height="500" top="0" bottom="0" left="0" right="0"
  dataProvider="{dataR.cards as ArrayCollection}">
 <s:itemRenderer>
 <fx:Component>
 <s:MobileIconItemRenderer label="{data.textTitle}"/>
 </fx:Component>
 </s:itemRenderer>
 </s:List>

 

 

Here's the "saving/reading the file" class used in creating the ArrayCollection:  ( DataHandling.as )

 

 

package dh
{
 public class DataHandling
 {
 import flash.events.IOErrorEvent;
 import flash.filesystem.File;
 import flash.filesystem.FileMode;
 import flash.filesystem.FileStream;
 
 import mx.collections.ArrayCollection;
 
 [Bindable]
 public var cards:ArrayCollection = new ArrayCollection();
 public var file:File;
 public var fileStream:FileStream;
 public var fileName:String = "Initial String";
 public var directory:String = "SimpleSaveFromAIR";
 public var textTitle:String;
 
 
 public function DataHandling()
 {
 }
 public function add():void
 {
 // new object
 var card:Object = new Object();
 card.tcard = textTitle;

 cards.addItem(card);
 }
 
 public function save():void
 {
 
 file = File.documentsDirectory.resolvePath(directory + "\\" + fileName);
 // FileStream for writing the file
 fileStream = new FileStream();

 fileStream.open(file, FileMode.WRITE);
 fileStream.writeObject(cards);
 fileStream.close();
 }

 public function read():void
 {
 // get correct path
 file = File.documentsDirectory.resolvePath(directory + "\\" + fileName);
 
 // read if exists
 if(file.exists)
 {
 
 fileStream = new FileStream();
 fileStream.open(file, FileMode.READ);
 cards = fileStream.readObject() as ArrayCollection;
 fileStream.close();
 }
 else
 {
 // some sample data + save if file does not exist
 cards = new ArrayCollection();
 var card:Object = new Object();
 card.tcard = "title";
 card.mtext1 = "text";
 
 cards.addItem(card);
 save();
 }
 }
 }
}
Highlighted
Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Issue Putting Data from ArrayCollection into List

Probably need to back up and see where the problem might originate.

 

Try a couple of things:

  • In the main class, replace dataR to just an ArrayCollection and fill some dummy data in that collection to see if it will display in the list.  If it does, then you know the issue lies in your DataHanling class.  If it does not, then you know its in the control or rendering logic.
  • In the DataHandling class, file separators are forward slash '/'.  Think UNIX/Posix.
  • I would verify via trace() that the data you're getting from the file system is correct.
  • In your data binding, you should not have to {dataR.cards as ArrayCollection}.  Are you getting compile errors if you leave "as ArrayCollection" off?

That's a start at least.

Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Re: Issue Putting Data from ArrayCollection into List

Ok thanks for the help.

 

I replaced dataR to just an ArrayCollection with some test data and it worked perfectly.  I also switched the file separators.  Oh, and no I wasn't getting any compile errors without using dataR.cards as ArrayCollection, some of example/lessons I was reading were using it, so I thought it might be useful, but it isn't in this case.

 

After using trace(), I have figured out that I don't seem to be adding the Objects to the cards ArrayCollection correctly.  When using the Debugger and trace I get:

 

 [object Object]  (for the value of 'card.tcard' when using trace(cards.toString())  

 

hello  (for my test data from previously, so I know that part is working, as 'hello' is being displayed in the list)

warning: unable to bind to property 'tcard' on class 'String' (class is not an IEventDispatcher)  

 

    ( I get the warning after trying to add the text from tcard to the ArrayCollection )

 

I guess my question now is how to pull the text from the 'tcard' TextInput from my .mxml file into the DataHandling class so I can add it?

 

Many thanks for helping me figure all this out.  =)

 

Here's part of my current .mxml file:

 

 

public function view1_initializeHandler(event:FlexEvent):void
			{
				
				var testItem:Object = new Object();
				testItem = "hello";
				dataR.cards.addItem(testItem);
				
				trace(dataR.cards.toString());
				
			}



/// later on

<s:List  id="myCardsList" x="10" y="10" width="1004" height="500" top="0" bottom="0" left="0" right="0" 
			 dataProvider="{dataR.cards}">
		<s:itemRenderer>
			<fx:Component>
				<s:MobileIconItemRenderer labelField="{data.tcard}"/>
			</fx:Component>
		</s:itemRenderer>
	</s:List>

 

 

Here's part of my current DataHandling class:

 

 

public function add():void
		{
			// new object
			var card:Object = new Object();
			card.tcard = textTitle;
			//card.mtext1 = mtext1.text;
			///card.mtext2 = mtext2.text;
			cards.addItem(card);
			
			trace(cards.toString());
		}

 

 

 

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Issue Putting Data from ArrayCollection into List

Getting a little confused.

 

Text from a text input field is accessed by:

 

mytextinput.text

 

Looking into an object in more detail can be done by:

 

import mx.utils.ObjectUtil;


trace( ObjectUtil.toString( myobject ).toString() ); 

 

Typically, when you're dealing with objects, you have various attributes to set.  For example:

 

var entry : Object = new Object();

entry.label = mytextinput.text;

entry.data = 'blablabla';

 

I have no idea if any of this helps, since it is not real clear to me what you're trying to do with the data storage or its format/schema.

Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Re: Issue Putting Data from ArrayCollection into List

What I can't seem to do is pull the text from the Text input field that is in my 'MyCards.mxml' file and add it to the Object I am creating in my dataHandling.as class.  

 

My goal is to have multiple tcards (the Title Card) that the user creates and then views them from the list displayed in the 'MyCards.mxml' file.  These cards will have more (main) text associated with them.  This is the mtext1 and mtext2 attributes of the Object.  Sort of like having a flash card with a title and two sides of text to view.  

 

What I'm not sure of now is how access that text input field or if I'm using card.mtext1 wrong.  Should I be using .data instead?

 

Thanks.

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Issue Putting Data from ArrayCollection into List

Text from the text input has to be physically set to the attribute of an allocated object.  This can occur at some event (change,button,focus).

 

Something lke:

 

myallocatedobject.widget = mytextinput.text;

 

Attributes of an object can be anything you want.  Object are "meta" containers that gives the developer great flexibility.  However, if you're using objects in an array/array collection to a list, lists typically "look" for certain attributes (normally 'label').  The list typically does not care about any other attributes that might be set.

 

So you could have

 

card.mtext1 = mytextinput.text;

 

I hope some of this will ring a bell for you and lead you in the correct direction.