发现一个Flex登录特效（不错的）

nianshi

浏览: 416423 次
性别:
来自: 济南

最近访客更多访客>>

hbzyb

zhangxiaopei

gaohejie

showerliang

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Flex

Flex Adobe OSX CSS XML

如

Xml代码

<? xml version = "1.0" encoding = "utf-8" ?>
< mx:Application xmlns:mx = "http://www.adobe.com/2006/mxml"
xmlns:eff = "com.adobe.ac.mxeffects.*"
paddingBottom = "0" paddingLeft = "0" paddingTop = "0" paddingRight = "0"
horizontalAlign = "center" verticalAlign = "middle" xmlns = "*" viewSourceURL = "srcview/index.html" >
< mx:Script >
<![CDATA[
import com.adobe.ac.mxeffects.Gate;
import com.adobe.ac.mxeffects.Flip;
import mx.effects.Sequence;
import mx.effects.Parallel;
import mx.effects.Resize;
import mx.effects.Fade;
import mx.effects.Iris;
import com.adobe.ac.mxeffects.DistortionConstants;
private const min_width:int = 350;
private const min_height:int = 200;
public function gotoChatRoom() : void {
var mySequence:Sequence = new Sequence();
var gate:Gate = new Gate(login);
gate.siblings = [ chatRoom ];
gate.direction = DistortionConstants.LEFT;
gate.smooth = true;
gate.distortion = 10;
gate.mode = Gate.OPEN;
gate.duration = 1000;
mySequence.addChild(gate);
var parallel:Parallel = new Parallel();
var resize:Resize = new Resize();
resize.target = loginStack;
resize.widthTo = this.width-20;
resize.heightTo = this.height-20;
resize.duration = 1000;
parallel.addChild(resize);
resize = new Resize();
resize.target = chatRoom;
resize.widthTo = this.width-20;
resize.heightTo = this.height-20;
resize.duration = 1000;
parallel.addChild(resize);
mySequence.addChild(parallel);
mySequence.play();
}
public function gotoLogin() : void {
var mySequence:Sequence = new Sequence();
var gate:Gate = new Gate(chatRoom);
gate.siblings = [ login ];
gate.direction = DistortionConstants.LEFT;
gate.smooth = true;
gate.distortion = 10;
gate.mode = Gate.CLOSE;
gate.duration = 1000;
mySequence.addChild(gate);
var parallel:Parallel = new Parallel();
var resize:Resize = new Resize();
resize.target = loginStack;
resize.widthTo = min_width;
resize.heightTo = min_height;
resize.duration = 1000;
parallel.addChild(resize);
resize = new Resize();
resize.target = chatRoom;
resize.widthTo = min_width;
resize.heightTo = min_height;
resize.duration = 1000;
parallel.addChild(resize);
mySequence.addChild(parallel);
mySequence.play();
}
]]>
</ mx:Script >
< mx:Style source = "/assets/OSX.css" />
< mx:VBox >
< mx:ViewStack id = "loginStack" width = "350" height = "200" >
< mx:Panel id = "login" title = "Login" horizontalAlign = "center"
verticalAlign = "middle" backgroundColor = "0xAAAAAA" >
< mx:Form >
< mx:FormItem label = "Username" >
< mx:TextInput id = "userName" />
</ mx:FormItem >
< mx:FormItem label = "Password" >
< mx:TextInput displayAsPassword = "true" id = "password"
enter = "gotoChatRoom();" />
</ mx:FormItem >
< mx:FormItem >
< mx:Button label = "Login" click = "gotoChatRoom();" />
</ mx:FormItem >
</ mx:Form >
</ mx:Panel >
< mx:Panel id = "chatRoom" title = "Chat Room" >
< mx:VBox width = "100%" height = "100%" >
< mx:TextArea id = "log" fontSize = "12" width = "100%" height = "100%"
editable = "false" />
</ mx:VBox >
< mx:ControlBar >
< mx:TextInput id = "msg" width = "100%" fontSize = "12" enter = "" />
< mx:Button label = "Send" click = "" />
< mx:Button label = "Logout" click = "gotoLogin()" />
</ mx:ControlBar >
</ mx:Panel >
</ mx:ViewStack >
</ mx:VBox >
</ mx:Application >

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns:eff="com.adobe.ac.mxeffects.*" 
    paddingBottom="0" paddingLeft="0" paddingTop="0" paddingRight="0"
    horizontalAlign="center" verticalAlign="middle" xmlns="*" viewSourceURL="srcview/index.html">

  <mx:Script>
       <![CDATA[
           import com.adobe.ac.mxeffects.Gate;
           import com.adobe.ac.mxeffects.Flip;
           import mx.effects.Sequence;
           import mx.effects.Parallel;
           import mx.effects.Resize;
           import mx.effects.Fade;
           import mx.effects.Iris;
           import com.adobe.ac.mxeffects.DistortionConstants;
           
           private const min_width:int = 350;
           private const min_height:int = 200;

           public function gotoChatRoom() : void {
              var mySequence:Sequence = new Sequence();

              var gate:Gate = new Gate(login);
              gate.siblings = [ chatRoom ];
              gate.direction = DistortionConstants.LEFT;    
              gate.smooth = true;
              gate.distortion = 10;
              gate.mode = Gate.OPEN;
              gate.duration = 1000;
              mySequence.addChild(gate);
            
              var parallel:Parallel = new Parallel();
              var resize:Resize = new Resize();
              resize.target = loginStack;
              resize.widthTo = this.width-20;
              resize.heightTo = this.height-20;
              resize.duration = 1000;
              parallel.addChild(resize);
              
              resize = new Resize();
              resize.target = chatRoom;
              resize.widthTo = this.width-20;
              resize.heightTo = this.height-20;
              resize.duration = 1000;
              parallel.addChild(resize);             
              mySequence.addChild(parallel);
              
              mySequence.play();
           }
           
           public function gotoLogin() : void {
              var mySequence:Sequence = new Sequence();

              var gate:Gate = new Gate(chatRoom);
              gate.siblings = [ login ];
              gate.direction = DistortionConstants.LEFT;    
              gate.smooth = true;
              gate.distortion = 10;
              gate.mode = Gate.CLOSE;
              gate.duration = 1000;
              mySequence.addChild(gate);
            
              var parallel:Parallel = new Parallel();
              var resize:Resize = new Resize();
              resize.target = loginStack;
              resize.widthTo = min_width;
              resize.heightTo = min_height;
              resize.duration = 1000;
              parallel.addChild(resize);
              
              resize = new Resize();
              resize.target = chatRoom;
              resize.widthTo = min_width;
              resize.heightTo = min_height;
              resize.duration = 1000;
              parallel.addChild(resize);             
              mySequence.addChild(parallel);
              
              mySequence.play();
           }
       ]]>

    </mx:Script>
    
    <mx:Style source="/assets/OSX.css"/>

    <mx:VBox>
    <mx:ViewStack id="loginStack" width="350" height="200">
      <mx:Panel id="login" title="Login" horizontalAlign="center" 
        verticalAlign="middle" backgroundColor="0xAAAAAA" >      
      	<mx:Form >      	
      		<mx:FormItem label="Username">
      			<mx:TextInput id="userName" />
      		</mx:FormItem>      		
      		<mx:FormItem label="Password">
      			<mx:TextInput displayAsPassword="true" id="password" 
      			  enter="gotoChatRoom();"/>
      		</mx:FormItem>      
      		<mx:FormItem>
      			<mx:Button label="Login" click="gotoChatRoom();" />
      		</mx:FormItem>      	
      	</mx:Form>      	
      </mx:Panel>
      
      <mx:Panel id="chatRoom" title="Chat Room" >      	 
      	<mx:VBox width="100%" height="100%">
      	  <mx:TextArea id="log" fontSize="12" width="100%" height="100%" 
      	    editable="false" />
      	</mx:VBox>
      	<mx:ControlBar>
      	  <mx:TextInput id="msg" width="100%" fontSize="12" enter=""/>
      		<mx:Button label="Send" click="" /> 
      		<mx:Button label="Logout" click="gotoLogin()" /> 
      	</mx:ControlBar>      
      </mx:Panel>
    </mx:ViewStack>
    </mx:VBox>

</mx:Application>

分享到：

Flex程序员的四重境界 | Flex面试题

2010-08-27 16:45
浏览 2006
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

发现一个Flex登录特效（不错的）

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

发现一个Flex登录特效（不错的）

评论

发表评论

相关推荐

Flex小记录

flex实现滑动显示隐藏效果

flex DataTimePicker时间控件

ActionScript 生成伪Guid

Flex中Image组件怎么才能非等比例拉伸图片

Flex中Accordion用法

Flex（替代session过期）实现用户长时间不操作要求重新登录的处理

ActionScript 3.0 Socket编程

12个简单易用的flex函数

Flex自定义控件——Pagebar分页控件

Flex资源，很全，很牛！

Flex 窗体 最大化、最小化实例

在Flex中复制文字到操作系统的剪贴板

Flex让Slider控件拖动时显示Tooltip

Flex给Alert加个Icon

在Flex中用Validator验证数字、字符串、Email、电话号码等

Flex中使用FileReference类下载文件

Flex使用ArrayCollection的filterFunction属性过滤DataGrid

Flex 树形控件（Tree ）的使用

FLEX3中应用CSS完全详解手册(下)

最近访客更多访客>>

Flex 窗体最大化、最小化实例