简单的功能描述:

1.一个用户登录界面,点击忘记密码以后切换到忘记密码状态

2.在忘记密码界面点击返回登录后切换到登陆画面

功能很简单,和Flex3有很大的区别,所以做一个记录

 

 /Files/pochonlee/myflex.swf

 

点击运行后

<?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="500" minHeight="500" width="100%" height="100%" viewSourceURL="srcview/index.html">
    
<s:states>
        
<s:State name="defaultState"/>
        
<s:State name="forgotState"/>
    
</s:states>
    
<fx:Declarations>
        
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
    
</fx:Declarations>
    
<s:Panel width="447" height="223" horizontalCenter="0" verticalCenter="0" id="mainPanel" title="用户登录" title.forgotState="找回密码">
        
<mx:Form id="loginForm" horizontalCenter.forgotState="0" horizontalCenter.defaultState="0" width.defaultState="300" height.defaultState="100" verticalCenter.defaultState="-40" width.forgotState="300" height.forgotState="100" verticalCenter.forgotState="-40">
            
<mx:FormItem label="邮箱:" id="itemEmail">
                
<s:TextInput id="txtEmail"/>
            
</mx:FormItem>
            
<mx:FormItem label="密码:" id="itemPass" includeIn="defaultState">
                
<s:TextInput id="txtPass" displayAsPassword="true"/>
            
</mx:FormItem>
        
</mx:Form>
        
<mx:ControlBar horizontalCenter="0" verticalCenter="30" horizontalCenter.forgotState="0" verticalCenter.forgotState="30" id="controllerBar">
            
<mx:LinkButton id="backLink" label="忘记密码" label.forgotState="返回登录" click.defaultState="backLink_clickHandlerChange(event)" click.forgotState="backLink_clickHandler(event)"/>
            
<mx:Spacer width="100%" id="spacer"/>
            
<mx:Button label="登录" id="btnSign" label.forgotState="提交"/>
        
</mx:ControlBar>
        
<!--s:transitions>
            <mx:Transition>
                <s:Parallel target="{itemPass}" >

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-11-07
  • 2021-06-25
  • 2022-12-23
  • 2022-12-23
  • 2021-12-13
猜你喜欢
  • 2021-05-16
  • 2021-10-05
  • 2022-12-23
  • 2022-12-23
  • 2022-02-25
  • 2022-02-19
  • 2021-09-10
相关资源
相似解决方案