Home Tutorial Flex Flex4 Components View State in custom component in Flex4

 
 

Share on Google+Share on Google+
View State in custom component in Flex4
Posted on: July 9, 2010 at 12:00 AM
Advertisement
If your custom component has a more then one state then you will specify the view state in custom component not in your main application.

View State in custom component in Flex4:

If your custom component has a more then one state then you will specify the view state in custom component not in your main application. In this example you can see how can to declare view states in custom component.

Example:

mainapplication.mxml

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

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

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

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

minWidth="955" minHeight="600"

xmlns:LoginComp="mycomponent.*">

<s:Panel title="View Sate in custom component" width="380" height="231">

<LoginComp:logincomponent currentState="Login" x="15" y="15"/>

</s:Panel>

</s:Application>

customcomponent.mxml

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

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

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

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

title="Login Form"

title.Register="Registration Form"

chromeColor="#333333"

color="#CCCCCC"

backgroundColor="#555555"

width="347"

height="166">

<!-- Defines the view states.-->

<s:states>

<s:State name="Login"/>

<s:State name="Register"/>

</s:states>

<mx:Form>

<mx:FormItem label="Email Id:">

<s:TextInput text="abc@xyz.com"

color="#000000"/>

</mx:FormItem>

<mx:FormItem label="Password:">

<s:TextInput displayAsPassword="true"

text="password"

color="#000000"/>

</mx:FormItem>

<mx:FormItem id="confirmPassword"

label="Confirm Password:"

includeIn="Register">

<s:TextInput displayAsPassword="true"

text="password"

color="#000000"/>

</mx:FormItem>

<mx:FormItem direction="horizontal">

<mx:Spacer width="100%"/>

<mx:LinkButton id="registerlinkButton"

label="GO for Registration?"

label.Register="Return to Login"

click="currentState='Register'"

click.Register="currentState=''"/>

<s:Button id="loginButton"

label="Login" label.Register="Register"/>

</mx:FormItem>

</mx:Form>

</s:Panel>

Output:

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download mainapplication.mxml file code

Download customcomponent.mxml file code

Advertisement

Related Tags for View State in custom component in Flex4:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: July 9, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com