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
Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: saving form (text input) to show in other state

In a very simple form, XML can be created as a String:

 

var xml : String = '<people>';

xml += '<person>';

xml += '<firstname>' + firstname.text + '</firstname>';

xml += '</person>';

xml += '</people>';

 

The string can be saved to a file using the File and FileStream classes.  It can also be read from a physical file, using FileStream.

 

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/filesystem/FileStream.html

 

To parse XML read from a file, you can instantiate an XML object like:

 

var people : XML = new XML( filedata ); // filedata is the string read from the file

 

Then you just read off the contents like any Object in ActionScript.

 

firstname.text = people.person.firstname;

 

If more than one "people" is in the file, you can get the quantity by:

 

people.person.length();

 

And then loop on each "person" by:

 

people.person[i].firstname;

 

I hope this helps.  Let us know if you need more information.

 

 

 

 

New Developer
Posts: 325
Registered: ‎10-28-2010
My Device: Blackberry Bold 9900
My Carrier: Telus

Re: saving form (text input) to show in other state

Thats awesome Jtegen! Looks like a great starting point. I will definitely explore this method.

 

Thanks so much!

---------------------------------
My PlayBook Apps: Pocket Portrait Lighting, Pocket Food Photography, Allergen Free Cooking, Easy Agenda
New Developer
Posts: 325
Registered: ‎10-28-2010
My Device: Blackberry Bold 9900
My Carrier: Telus

Re: saving form (text input) to show in other state

Hello everyone,

 

I am back from New York and am going to give this another try. The thing I seem to still be confused about is this:

 

In order to use the actionscript or xml methods that were described, do I have to create seperate files or does that code go into my mainapp.mxml file where all my UI coding is placed?

---------------------------------
My PlayBook Apps: Pocket Portrait Lighting, Pocket Food Photography, Allergen Free Cooking, Easy Agenda
Highlighted
Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: saving form (text input) to show in other state

Each "page" and sometimes "views" in a "pages" would be its own object/file.  this makes coding easier and down the road, possibly reuse code elements (another story).  It is best to start with a skeleton application and build up from there.

New Developer
Posts: 199
Registered: ‎12-29-2010
My Device: Not Specified

Re: saving form (text input) to show in other state

[ Edited ]

Sorry if this has been covered, I skimmed the pages and didn't see anything like what Im' about to propose...

 

If the data is to never leave the application, I suggest either serializing manually, or using the PersistenceManager (which will serialize for you).

 

Serialization (post by me): http://blog.killerspaz.com/2011/02/02/flex-serialization/

PersistenceManager (by Jonathan Campos): http://www.unitedmindset.com/jonbcampos/2010/11/01/flex-4-5-persistencemanager/

 

Both assume Flex, and PersistenceManager assumes Flex 4.5 (Hero).

 

 

I suggest both of these over something liek XML because it's faster, and doesn't require you to have to parse XML or write out fancy string concatenations.

 

Granted there is E4X in Flex, but you lose strict typing - in my suggestions above you will keep this typing for static compile time checks, as well as help with code completion.

 

 

*EDIT*

As a note, the Serialization post assumes Flex 4 for the use of Base64Encoder/Decoder. If you want to write out raw bytes, that's perfectly fine in pure AS3 projects.. I typically use the Encoder/Decoder to satisfy easier copy/paste mechanisms... Great for debugging across systems or to get a user's state that can be passed via IM or email, etc. There's many different approaches you can use.

New Developer
Posts: 325
Registered: ‎10-28-2010
My Device: Blackberry Bold 9900
My Carrier: Telus

Re: saving form (text input) to show in other state

@killerspaz,

 

Thanks for the info! I read the page on the persistence manager. Where exactly do you put that code? Does it go in the mainapp.xml file or do you create a seperate file for that? It seems pretty straight forward, but once again I don't have much experience with this so I don't know exactly what to do with the code.

 

Sorry, I may have gotten too ambitious for this project considering I'm new to this. My first two apps had nothing to do with user input, so they were more or less a breeze.

---------------------------------
My PlayBook Apps: Pocket Portrait Lighting, Pocket Food Photography, Allergen Free Cooking, Easy Agenda
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: saving form (text input) to show in other state

hey alex,

 

welcome back from NY and hope your project went well!

 

Below is a code using the link that killerspaz posted in the previous post. It uses the persistance manager class and it saves your data to the system every time. so when you open up your app, you always get what you left it. You can use it as a guide and translate it into your app.

 

SaveInputHome.mxml:

 

 

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
		xmlns:s="library://ns.adobe.com/flex/spark" title="Home" creationComplete="onCreationComplete(event)">
	<!--
	make sure to set up your creationComplete attribute to the function you
	initially want to run
	!-->
	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;
			
			import spark.core.managers.PersistenceManager;
			
			/** 
			 * set the persistance manager object outside of any functions
			 * so it is accessible by any functions in your application
			 */
			private var p:PersistenceManager = new PersistenceManager();
			
			
			/** 
			 * set up your initial items using the creation complete event dispatched when
			 * your app is loaded
			 */
			protected function onCreationComplete(event:FlexEvent):void
			{
				/** 
				 * here we set the text area's text property to the string stored 
				 * in the textAreaData field
				 * 
				 * Note that you can name it anything you want, just stay consistent
				 */
				textArea.text = p.getProperty("textAreaData") as String;
				
			}
			
			
			/**
			 * When the user hits the save button this function is performed
			 */
			protected function saveBtn_clickHandler(event:MouseEvent):void
			{
				/** 
				 * set the textAreaData key to the value of the text area object below
				 */
				p.setProperty("textAreaData", textArea.text);
				
				/** save the data to the disk */
				p.flush();
				
				/** just changing the status of the label to notify the user of submission */
				
				statusLabel.text = "Saved!";
			}

		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<s:Label id="statusLabel" width="150" height="52" x="100" y="50" />
	<s:TextArea id="textArea" width="500" height="300" x="100" y="100" />
	<!--
		make sure to set up your event handler for the click via the click attribute
	!-->
	<s:Button id="saveBtn" label="Save" width="150" height="52" x="100" y="450" click="saveBtn_clickHandler(event)" />
</s:View>

 

 

I left comments there to guide you through it. basically all the actionscript goes in between <fxSmiley Frustratedcript> tags and the <![CDATA[... ]]>.

 

and dont ever give up on something just because you think you were too ambitious. the way i look at it, if you havent broken something, then you havent worked hard enough yet! good luck with your app!

J. Rab (Blog) (Twitter)
--
1. If you liked my post or found it useful please click on the thumbs up and provide a Like!
2. If my post solved your problem please click on the Accept as Solution button. Much appreciated!

Approved Apps: OnTrack | ssShots | Hangman
New Developer
Posts: 325
Registered: ‎10-28-2010
My Device: Blackberry Bold 9900
My Carrier: Telus

Re: saving form (text input) to show in other state

[ Edited ]

Thanks so much JRab! I got that working. I was able to translate it into my app. Here is the code:

 

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        actionBarVisible="false" contentBackgroundAlpha="1.0"
        creationComplete="onCreationComplete(event)" tabBarVisible="false" title="Portfolio">
    <!--
    make sure to set up your creationComplete attribute to the function you
    initially want to run
    !-->
    <fxSmiley Frustratedcript>
        <![CDATA[
            import mx.events.FlexEvent;
            
            import spark.core.managers.PersistenceManager;
            
            /**
             * set the persistance manager object outside of any functions
             * so it is accessible by any functions in your application
             */
            private var pSmiley TongueersistenceManager = new PersistenceManager();
            
            
            /**
             * set up your initial items using the creation complete event dispatched when
             * your app is loaded
             */
            protected function onCreationComplete(event:FlexEvent):void
            {
                /**
                 * here we set the text area's text property to the string stored
                 * in the textAreaData field
                 *
                 * Note that you can name it anything you want, just stay consistent
                 */
                textArea.text = p.getProperty("textAreaData") as String;
                
            }
            
            
            /**
             * When the user hits the save button this function is performed
             */
            protected function saveBtn_clickHandler(event:MouseEvent):void
            {
                /**
                 * set the textAreaData key to the value of the text area object below
                 */
                p.setProperty("textAreaData", textArea.text);
                
                /** save the data to the disk */
                p.flush();
                
                
            }
            
        ]]>
    </fxSmiley Frustratedcript>
    <fxSmiley Very Happyeclarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fxSmiley Very Happyeclarations>
    <s:Image x="0" y="0" width="100%" height="100%" source="profile_bg.png"/>
    <s:TextArea id="textArea" x="18" y="74" width="985" height="40" color="#FFFFFF"
                contentBackgroundAlpha="0.38" contentBackgroundColor="#000000" fontSize="16"
                text="Name:"/>
    <s:TextArea id="textArea1" x="18" y="118" width="985" height="40" contentBackgroundAlpha="0.38"
                contentBackgroundColor="#000000" fontSize="16" text="Address:"/>
    <s:TextArea id="textArea2" x="18" y="163" width="985" height="40" contentBackgroundAlpha="0.38"
                contentBackgroundColor="#000000" fontSize="16" text="Phone:"/>
    <s:TextArea id="textArea4" x="104" y="210" width="899" height="108" contentBackgroundAlpha="0.38"
                contentBackgroundColor="#000000" fontSize="16"/>
    <s:TextArea id="textArea5" x="149" y="334" width="854" height="108" contentBackgroundAlpha="0.38"
                contentBackgroundColor="#000000" fontSize="16"/>
    <s:TextArea id="textArea6" x="159" y="464" width="844" height="108" contentBackgroundAlpha="0.38"
                contentBackgroundColor="#000000" fontSize="16"/>
    
    
    
    
    <s:Button id="saveBtn" x="850.7" y="16" width="150" height="39" label="Save"
              chromeColor="#1B1B1B" click="saveBtn_clickHandler(event)" color="#ABABAB"/>

    <!--
    make sure to set up your event handler for the click via the click attribute
    !-->
</s:View>

 

The only issue I'm having now is that I have more than one TextArea, and only the first TextArea box is being saved when I click save. How do I get them all to save?

 

And thanks for the encouragement. Sometimes its easy to get a little discouraged.

---------------------------------
My PlayBook Apps: Pocket Portrait Lighting, Pocket Food Photography, Allergen Free Cooking, Easy Agenda
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: saving form (text input) to show in other state

hey alex,

 

glad you're back on track! to add more "keys" you can simply add it via the setProperty() method of the PersistentManager class. just like how we added the "textAreaData" we can add another property like "textAreaData2" (yeah im creative with my naming schemes hah). you can basically add an unlmited amount of "keys". and to read back the key and to set the text property of any given Text Area, just do it like in the code btu with the new key. it will be best done in the creationComplete method. good luck!

J. Rab (Blog) (Twitter)
--
1. If you liked my post or found it useful please click on the thumbs up and provide a Like!
2. If my post solved your problem please click on the Accept as Solution button. Much appreciated!

Approved Apps: OnTrack | ssShots | Hangman
New Developer
Posts: 325
Registered: ‎10-28-2010
My Device: Blackberry Bold 9900
My Carrier: Telus

Re: saving form (text input) to show in other state

@JRab,

 

Everything worked beautifully. I can't thank you enough. I now have a major issue solved, and can carry on with the rest of the development. Without your help, killerspaz's, and anyone else who replied to my questions, my project would've been nothing more than a farfetched idea.

 

Thank you so much for all your help, and for encouraging me to continue trying. I really appreciate all the help.

 

Ps. My photography project went perfectly in New York JRab! It was a perfect mix of relaxation and getting the perfect shots I wanted. I spent 4 days wandering around the streets and getting lost in the amazing city with my girlfriend, taking pictures of daily life. It could'nt have gone any better.

---------------------------------
My PlayBook Apps: Pocket Portrait Lighting, Pocket Food Photography, Allergen Free Cooking, Easy Agenda