flex---->Flex 登录实例

转载 2012年03月30日 20:28:59
<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()">
 <mx:states>
  <mx:State name="LoginNewState">
   <mx:RemoveChild target="{panel}"/>
   <mx:AddChild position="lastChild">
    <mx:Label text="欢迎进入第一个Flex主页!" width="488" height="67" fontSize="22" fontFamily="Georgia" textAlign="center" alpha="1.0" fontStyle="normal" horizontalCenter="35" verticalCenter="31" color="#F5B333"/>
   </mx:AddChild>
   <mx:SetStyle name="color" value="#51DBF9"/>
  </mx:State>
 </mx:states>
<mx:Script>
 <![CDATA[
  import mx.controls.Alert;
  
  //验证登陆
  private function loginHandle():void
  {
   if(txtUsername.text==""||txtPassword.text==""){
    Alert.show("请输入用户名和密码!");
   }else{
    if(txtUsername.text=="admin"&&txtPassword.text=="123"
    &&txtCheckCode.text.toLowerCase()== lblCheckCode.text.toLowerCase()){
     Alert.show("登陆成功!");
     currentState="LoginNewState";
    }else{
     if(txtCheckCode.text.toLowerCase()!= lblCheckCode.text.toLowerCase()){
      
     Alert.show("验证码错误!");
     lblCheckCode.text=GrearateCheckCode();
     }else{
      
     Alert.show("用户名和密码错误!");
     }
     
    }
   }
  }
  //重置表单数据
  private function resetHandle():void
  {
   txtUsername.text="";
   txtPassword.text="";
  }
  
  //该函数是应用程序(Application)在初始化的时候就执行。
  private function initApp():void{
   //显示验证码
   lblCheckCode.text=GrearateCheckCode();
  }
  
  private function GrearateCheckCode():String{
   
   //定义变量
   var ran:Number;//0-1的随机数
   var number:Number;//是ran的10000倍的数
   var code:String;//生成单个的字母
   var checkCode:String="";//返回的验证码
   
   //生成四个随机数(转换为字符)
   for(var i:int=0;i<4;i++){
    ran=Math.random();
    number=Math.round(ran*10000);
    
    if(number%2==0){
    
    //通过fromCharCode()是用ASCII码来给字符串赋值,返回一个字母
    code=String.fromCharCode(48+(number%10));
    }
    else{
    code=String.fromCharCode(65+(number%26)); 
    }
    checkCode+=code;
    
   }
   return checkCode;
  }
 ]]>
</mx:Script> 
 <mx:Panel width="318" height="210" layout="absolute" title="Flex登陆界面" id="panel"
  horizontalAlign="center" verticalAlign="middle" color="#1894AF"
  fontFamily="Georgia" horizontalCenter="-7" verticalCenter="-13" fontSize="12" themeColor="#0356FE" fontWeight="normal">
 
  <mx:Label x="36" y="29" text="用户名:" fontSize="12"/>
  <mx:Label x="36" y="60" text="密   码:" width="45" fontSize="12"/>
  <mx:TextInput x="93" y="27" id="txtUsername"/>
  <mx:TextInput x="93" y="58" id="txtPassword" displayAsPassword="true" editable="true"/>
  <mx:Button x="95" y="130" label="登陆" id="btnLogin" click="loginHandle();"  fontSize="12" fontWeight="bold"/>
  <mx:Button x="177" y="130" label="重置" id="btnReset" click="resetHandle();" fontSize="12"/>
  <mx:Text x="34" y="91" text="验证码:" width="54" fontSize="12"/>
  <mx:TextInput x="94" y="89" width="49" id="txtCheckCode" fontSize="12"/>
  <mx:Text x="152" y="91" width="47" id="lblCheckCode" fontSize="14"/>
  <mx:LinkButton x="199" y="89" label="看不清?" width="71" id="LinkbtnReGreateCode" click="lblCheckCode.text=GrearateCheckCode()" fontSize="12" fontWeight="normal"/>
 </mx:Panel>
</mx:Application>

Flex 布局教程:实例篇

上一篇文章介绍了Flex布局的语法,今天介绍常见布局的Flex写法。你会看到,不管是什么布局,Flex往往都可以几行命令搞定。 我只列出代码,详细的语法解释请查阅《Flex布局教程:语法篇》。我的主...
  • javaloveiphone
  • javaloveiphone
  • 2016年04月08日 10:48
  • 1514

Flex 布局教程:实例篇

你会看到,不管是什么布局,Flex往往都可以几行命令搞定。 我只列出代码,详细的语法解释请查阅《Flex布局教程:语法篇》。我的主要参考资料是Landon Schropp的文章和Solved ...
  • u011627980
  • u011627980
  • 2016年06月27日 16:51
  • 5123

程序中,调用Bison和Flex结合的小例子(类似完成语法树)

接前面的例子:程序中,调用Bison和Flex结合的小例子 要做出存储语法树结构的全局变量: 1 [root@lex ~]# cd /soft/total 2 [root@lex total]...
  • Chinamming
  • Chinamming
  • 2013年11月26日 22:55
  • 1390

程序缘 Flex AIR之旅--第六章 编写用户登录界面

实现目标: 用户录入账户密码,从数据库中检查是否存在,如果存在,则登录主界面,并在主窗体显示相关用户信息。 实现方法: 1、  数据库定义在com.system. LoginUserInfo类中...
  • remzhang
  • remzhang
  • 2014年04月07日 15:14
  • 1330

Flex 布局:实例篇

转自:http://www.ruanyifeng.com/blog/2015/07/flex-examples.html 作者: 阮一峰 日期: 2015年7月14日 ...
  • zhang_Red
  • zhang_Red
  • 2015年11月03日 13:14
  • 4037

Flex 正则表达式 电话、邮箱验证

 一、常用验证 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|...
  • u010931818
  • u010931818
  • 2014年06月25日 09:41
  • 1388

Flex 弹性盒子布局使用教程

传统的网页布局(layout)解决方案,是基于盒模型,依赖display+float+position属性,这对于那些特殊的布局非常的不方便,比如垂直居中就不易于实现。 2009年,W3C提出了一种新...
  • lyznice
  • lyznice
  • 2017年01月02日 18:27
  • 2261

Flex通信-与Java实现Socket通信实例

Flex通信-与Java实现Socket通信实例 (给自己借鉴一下) Flex 环境准备 【服务器端】 JDK1.6,“java.net”包对网络编程提供了非常全面的支持,包括So...
  • a1164386685
  • a1164386685
  • 2014年11月26日 14:55
  • 482

Flex中视图(mxml)和代码(as)的完全分离

用类似 js 脚本的方法,可以在两个文件之间相互调用,非常方便。而它的本质其实是 在编译的时候,把两个文件的代码合并在一起,就像本文开头未分离时一样。这些代码 最终是定义在同一个类里面的,只是在我们写...
  • cceevv
  • cceevv
  • 2015年06月14日 15:55
  • 1940

布局神器---flexbox

1.flexboxflexbox: 是css3中的新的布局模式,可以控制未知容器元素的对齐方式、排列方向、排列顺序。 flex布局:(由父元素和它的直接子元素组成) 父元...
  • github_34514750
  • github_34514750
  • 2016年04月07日 22:08
  • 421
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:flex---->Flex 登录实例
举报原因:
原因补充:

(最多只允许输入30个字)