Flex中用state来表示不同的状态的经典的例子

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	
	<mx:states>
		<mx:State name="Register">
			<mx:AddChild relativeTo="{loginForm}" position="lastChild">
				<mx:target>
					<mx:FormItem id="confirm" label="Confirm:">
						<mx:TextInput/>
					</mx:FormItem>
				</mx:target>
			</mx:AddChild>
			<mx:SetProperty target="{loginPanel}" name="title" value="Register"/>
			<mx:SetProperty target="{loginButton}" name="label" value="Register"/>
			<mx:SetStyle target="{loginButton}"
						 name="color" value="blue"/>
			<mx:RemoveChild target="{registerLink}"/>
			<mx:AddChild relativeTo="{spacer1}" position="before">
				<mx:target>
					<mx:LinkButton id="loginLink" label="Return to Login" click="currentState=''"/>
				</mx:target>
			</mx:AddChild>
		</mx:State>
	</mx:states>
	
	<!-- Define a Panel container that defines the login form.-->
	<mx:Panel title="Login" id="loginPanel"
			  horizontalScrollPolicy="off" verticalScrollPolicy="off"
			  paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
		
		<mx:Text width="100%" color="blue"
				 text="Click the 'Need to Register?' link to change state. Click the 'Return to Login' link to return to the base state."/>
		
		<mx:Form id="loginForm" >
			<mx:FormItem label="Username:">
				<mx:TextInput/>
			</mx:FormItem>
			<mx:FormItem label="Password:">
				<mx:TextInput displayAsPassword="true"/>
			</mx:FormItem>
		</mx:Form>
		<mx:ControlBar>
			<mx:LinkButton id="registerLink"   label="Need to Register?"
						   click="currentState='Register'"/>
			<mx:Spacer width="100%" id="spacer1"/>
			<mx:Button label="Login" id="loginButton"/>
		</mx:ControlBar>
	</mx:Panel>
	
</mx:Application>