• 【设为首页】
  • 【收藏闪客居】
当前位置:主页>Flex>文章内容
  • Flex利用MDI模拟用户登入设计
  • 来源:相濡以沫 作者:onlyzhangqin 2008-06-12 【


示例:(由于地址链接关系,请有IE,FF好像不行。或者自行下载:http://www.box.net/shared/6pfgq21ogg  测试:只要name==password就可!!)

源代码:

1.主界面程序:Login.mxml(一个壳子o(∩_∩)o...)

Xml代码 复制代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:Application xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%"  
  3.       creationComplete="initFrame()">  
  4.      <mx:Script>  
  5.          <![CDATA[  
  6.           import mx.controls.Alert;  
  7.              public function initFrame():void{  
  8.                   (new User()).showModal();  
  9.                     
  10.              }  
  11.  
  12.          ]]>  
  13.      </mx:Script>  
  14. </mx:Application>  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:Application xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%"  
  3.       creationComplete="initFrame()">  
  4.      <mx:Script>  
  5.          <![CDATA[ 
  6.           import mx.controls.Alert; 
  7.              public function initFrame():void{ 
  8.                   (new User()).showModal(); 
  9.                    
  10.              } 
  11.  
  12.          ]]>  
  13.      </mx:Script>  
  14. </mx:Application>  

 2.登入框界面程序:User.mxml(简单的验证,你可以使用后台验证:RemoteObject,HttpService,WebService..you pick oneo(∩_∩)o...)

Xml代码 复制代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <Window xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml"    
  3.      xmlns:flexmdi="flexmdi.containers.*" title="User Login" layout="absolute" width="330" height="228"  
  4.      minButtonVisible="true" maxButtonVisible="true" closeButtonVisible="false" creationComplete="initUser()">  
  5.      <mx:Script>  
  6.           <![CDATA[  
  7.               import mx.controls.Alert;   
  8.               import mx.events.CloseEvent;  
  9.               import mx.events.CloseEvent  
  10.              public function initUser():void {  
  11.                    
  12.              }  
  13.              public function checkUser():void {  
  14.                  if(uname.text=="" || upass.text==""){  
  15.                      Alert.show("请输入用户名和密码",null,1);  
  16.                  }else if(uname.text == upass.text){  
  17.                  // do something and then close the login frame  
  18.                     closeWindow();  
  19.                     (new AfterLogin()).showModal();  
  20.                  } else {  
  21.                      Alert.show("用户名或者密码不正确", null, 1);  
  22.                  }      
  23.              }  
  24.              public function isQuit():void{  
  25.                 Alert.show("Seriously? Close it?", null, 3, null, handleAlertResponse);  
  26.              }  
  27.             public function handleAlertResponse(event:CloseEvent):void  
  28.             {  
  29.                 if(event.detail == mx.controls.Alert.YES)  
  30.                 {  
  31.                     closeWindow();  
  32.                       
  33.                 }  
  34.             }  
  35.           ]]>  
  36.      </mx:Script>  
  37.     <flexmdi:MDICanvas id="mdiCanvas" horizontalScrollPolicy="off" verticalScrollPolicy="off"  
  38.             width="306" height="178" backgroundColor="#FFFFFF" backgroundAlpha="0">  
  39.         <mx:Label x="23" y="28" text="Name:" width="69" fontSize="16"/>  
  40.         <mx:Label x="23" y="75" text="Password:" fontSize="16"/>  
  41.         <mx:TextInput id="uname" x="128" y="26" fontSize="16"/>  
  42.         <mx:TextInput id="upass" x="128" y="73" fontSize="16" fontFamily="Times New Roman" width="160"/>  
  43.         <mx:Button id="uexit" x="160" y="130" label="Exit" click="isQuit()" themeColor="#18FF00" fontSize="16"/>  
  44.         <mx:Button x="50" y="130" label="Login" click="checkUser()" themeColor="#18FF00" fontSize="16"/>  
  45.     </flexmdi:MDICanvas>  
  46. </Window>  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <Window xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml"   
  3.      xmlns:flexmdi="flexmdi.containers.*" title="User Login" layout="absolute" width="330" height="228"  
  4.      minButtonVisible="true" maxButtonVisible="true" closeButtonVisible="false" creationComplete="initUser()">  
  5.      <mx:Script>  
  6.           <![CDATA[ 
  7.               import mx.controls.Alert;  
  8.               import mx.events.CloseEvent; 
  9.               import mx.events.CloseEvent 
  10.              public function initUser():void { 
  11.                   
  12.              } 
  13.              public function checkUser():void { 
  14.                  if(uname.text=="" || upass.text==""){ 
  15.                      Alert.show("请输入用户名和密码",null,1); 
  16.                  }else if(uname.text == upass.text){ 
  17.                  // do something and then close the login frame 
  18.                     closeWindow(); 
  19.                     (new AfterLogin()).showModal(); 
  20.                  } else { 
  21.                      Alert.show("用户名或者密码不正确", null, 1); 
  22.                  }     
  23.              } 
  24.              public function isQuit():void{ 
  25.                 Alert.show("Seriously? Close it?", null, 3, null, handleAlertResponse); 
  26.              } 
  27.             public function handleAlertResponse(event:CloseEvent):void 
  28.             { 
  29.                 if(event.detail == mx.controls.Alert.YES) 
  30.                 { 
  31.                     closeWindow(); 
  32.                      
  33.                 } 
  34.             } 
  35.           ]]>  
  36.      </mx:Script>  
  37.     <flexmdi:MDICanvas id="mdiCanvas" horizontalScrollPolicy="off" verticalScrollPolicy="off"  
  38.             width="306" height="178" backgroundColor="#FFFFFF" backgroundAlpha="0">  
  39.         <mx:Label x="23" y="28" text="Name:" width="69" fontSize="16"/>  
  40.         <mx:Label x="23" y="75" text="Password:" fontSize="16"/>  
  41.         <mx:TextInput id="uname" x="128" y="26" fontSize="16"/>  
  42.         <mx:TextInput id="upass" x="128" y="73" fontSize="16" fontFamily="Times New Roman" width="160"/>  
  43.         <mx:Button id="uexit" x="160" y="130" label="Exit" click="isQuit()" themeColor="#18FF00" fontSize="16"/>  
  44.         <mx:Button x="50" y="130" label="Login" click="checkUser()" themeColor="#18FF00" fontSize="16"/>  
  45.     </flexmdi:MDICanvas>  
  46. </Window>  

 3.用户正确登入之后界面程序:(简单的问候o(∩_∩)o...)

Xml代码 复制代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <Window xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300">  
  3. <mx:Label text="恭喜你哦,用户名和密码都对了" fontSize="16"/>  
  4. </Window>  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <Window xmlns="ext.containers.windows.*" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300">  
  3. <mx:Label text="恭喜你哦,用户名和密码都对了" fontSize="16"/>  
  4. </Window>  

 

代码中需要用到的包 ext.containers.windows.*,flexmdi.containers.*"附带的代码都有,你可以从前面提到的博客或者网站中下载到。

附件:http://www.box.net/shared/q5r9xt4row




上一篇:Flex程序与包装页面(wrapper)通信方法小结   下一篇:在Flex中使用嵌入字体鲜为人知的秘密
  • 用户名:新注册) 密码: 匿名评论
  • 评论内容:(不能超过250字,需审核后才会公布,请自觉遵守互联网相关政策法规)

Copyright © 2006-2008 flashas.net All Rights Reserved.
网站内容咨询: admin#flashas.net (#为@) 联系QQ:40777822 浙ICP备06033001号
(本网站最佳浏览解析度为1024*768, 建议使用IE 6.0或以上版本浏览器。)