flex登陆框实例

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()">
	<mx:states>
	    <!--新建“index”State-->
		<mx:State name="index">
		    <!--移除“登录框”-->
			<mx:RemoveChild target="{panel1}"/>
			<!--添加新的组件-->
			<mx:AddChild position="lastChild">
				<mx:Label x="231" y="174" text="欢迎来到主页" fontFamily="Georgia" fontSize="20" />
			</mx:AddChild>
		</mx:State>
	</mx:states>
	<mx:Script>
		<![CDATA[
		    import mx.controls.Alert;
		    private function initApp():void
		    {
		    	//显示校验码
		       lblCheckCode.text=GenerateCheckCode(); 
		    }
			private function loginHandle():void
			{
				//空的情况
				if(txtUsername.text==""||txtPassword.text=="")
				{
					Alert.show("请输入完整数据!");
				}
				else
				{
					//合法用户
					if(txtUsername.text=="Administrator"&&txtPassword.text=="123456"&&txtCheckCode.text.toLocaleLowerCase()==lblCheckCode.text.toLowerCase())
					{
						currentState="index";
					}
					//登录失败
					else  
					{
						//校验码错误
						if(txtCheckCode.text.toLowerCase()!=lblCheckCode.text.toLowerCase()) 
					    {
					       Alert.show("校验码错误!");
					       //重新生成校验码
					       lblCheckCode.text=GenerateCheckCode(); 
					    }
					    //用户名或密码错误
					    else  
						  Alert.show("用户名或密码错误!");
					}
				}
			}
			private function resetHandle():void
			{
				txtUsername.text="";
				txtPassword.text="";
				txtCheckCode.text="";
			}
 
            //生成随机码
			private function GenerateCheckCode():String
			{
				//初始化
				var ran:Number;
				var number:Number;
				var  code:String;
				var checkCode:String ="";
				//生成四位随机数
				for(var i:int=0; i<4; i++)
				{
					//Math.random生成数为类似为0.1234
					ran=Math.random();
					number =Math.round(ran*10000); 
					//如果是2的倍数生成一个数字
					if(number % 2 == 0)
					  //"0"的ASCII码是48  
					  code = String.fromCharCode(48+(number % 10)); 
					//生成一个字母
					else  
					  //"A"的ASCII码为65
					  code = String.fromCharCode(65+(number % 26)) ;
					checkCode += code;
				}
				return checkCode;
			}
 
		]]>
	</mx:Script>
	<mx:Panel x="337.5" y="261" width="349" height="257" layout="absolute" title="用户登录" fontFamily="Georgia" fontSize="12" id="panel1">
		<!--  "用户名"标签  -->
		<mx:Label x="41.5" y="33" text="用户名"/> 
		<!--  "密码"标签  -->   
		<mx:Label x="42.5" y="81" text="密码"/> 
		<!--  "用户名"输入框  -->    
		<mx:TextInput x="94.5" y="33" id="txtUsername"/>  
		<!--  "密码"输入框  -->
		<mx:TextInput x="95.5" y="81" id="txtPassword" displayAsPassword="true"/>
		<!--  "登录"按钮  --> 
		<mx:Button x="82.5" y="159" label="登录" id="btnLogin" click="loginHandle()"/> 
        <!--  "重置"按钮  --> 
		<mx:Button x="181.5" y="159" label="重置" id="btnReset" click="resetHandle()"/> 
		<!--  "校验码"标签  --> 
		<mx:Label x="165.5" y="125" id="lblCheckCode" width="42.5" color="#377CD0"/>
		<mx:LinkButton x="216" y="123" label="看不清楚?" id="linkbtnReGenerate" click="lblCheckCode.text=GenerateCheckCode();" fontFamily="Georgia" fontSize="11"/>
		<mx:Label x="39.5" y="123" text="校验码"/>
		<!--  "校验码"输入框  --> 
		<mx:TextInput x="96.5" y="121" id="txtCheckCode" width="61" maxChars="4"/>
	</mx:Panel>
</mx:Application>