Flex4 states 用法

<?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"> 
 
 <fx:Declarations>
  <!-- 将非可视元素（例如服务、值对象）放在此处 -->
 </fx:Declarations>
 <s:states>
  <!--定义两个State-->
  <s:State name="state_login"/>
  <s:State name="state_index"/>
 </s:states>
 
 <!--窗口panel_login设置为state_login，程序运行时显示-->
 <s:Panel id="panel_login" title="Login" horizontalCenter="0" verticalCenter="0" includeIn="state_login">
  <s:Form id="form_login">
   <s:FormItem label="UserName:">
    <s:TextInput/>
   </s:FormItem>
   
   <s:FormItem label="PassWord:">
    <s:TextInput displayAsPassword="true"/>
   </s:FormItem>
  </s:Form>
  
  <s:controlBarLayout>
   <s:HorizontalLayout paddingTop="2" horizontalAlign="right"/>
  </s:controlBarLayout>
  <s:controlBarContent>
   <s:Button id="btn_cancel" label="cancel" />
   
   <!--btn_login点击时切换为state_index状态显示-->
   <s:Button id="btn_login" label="Login" click="currentState='state_index'"/>
  </s:controlBarContent>  
 </s:Panel>
 
 <!--窗口panel_2设置为state_index-->
 <s:Panel id="panel_2" title="state_2" includeIn="state_index">
  <!--还原为上一个state状态显示-->
  <s:Button click="currentState=''"/>
 </s:Panel>
</s:Application>