Flex效果组件的封装(写效果就不用这么累了)

Flex提供了16 种动画效果类

AnimateProperty:动画属性
Blur :模糊
Desolve :溶解
Fade :凋零
Glow :发光
Iris :瞳孔放大缩小
Move :移动
Pause :定格
Resize :改变大小
Rotate :旋转
SoundEffect :音效
(WipeLeft, WipeRight, WipeUp, WipeDown) :擦拭
Zoom :放大缩小


有13 种不同的方式来触发动画效果:
AddedEffect :加入容器
creationCompleteEffect :创建完成
focusInEffect :获得键盘输入
focusOutEffect :失去键盘输入
hideEffect :visable属性设置为false
mouseDownEffect :鼠标按下
mouseUpEffect :鼠标按起
moveEffect :被拖动
resizeEffect :重新设定大小
removedEffect :被移除
rollOutEffect :鼠标移到控件外
rollOverEffect :鼠标移到控件上
showEffect :visable属性设置为true


可以使用MXML来设置效果
<mx:Fade target="{loginWindow}" alphaFrom="1" alphaTo=".5" duration="500" startDelay="200" effectEnd="loginEffectHandler(event)"/>



但是如果程序中效果需要代码控制的,即需要as代码编写效果的时候,则这些效果的代码将会很多很杂。比如你需要一个移动和隐藏的效果
var move:Move = new Move ;
move.target = loginWindow ;
move.duration = 500 ;
move.xFrom = 100 ;
move.xTo = 200 ;
move.yFrom = 100 ;
move.yFrom = 200 ;
move.startDelay = 100 ;
move.addEventListener(EffectEvent.EFFECT_END,moveEffectHandler) ;
move.play() ;
var fade:Fade = new Fade ;
fade.alphaFrom = 1 ;
fade.alphaTo = 1;
fade.target= loginWindo ;
fade.startDelay = 200 ;
fade.duration = 500 ;
fade.addEventListener(EffectEvent.EFFECT_END,fadeEffectHandler) ;
fade.play() ;


考虑到精简代码,我将上诉效果封装到一个类中,代码如下

package com.utils.effect
{
import flash.display.DisplayObject;

import mx.effects.Blur;
import mx.effects.Fade;
import mx.effects.Glow;
import mx.effects.Move;
import mx.effects.Resize;
import mx.effects.Rotate;
import mx.events.EffectEvent;

public class ApplicationEffect
{
public function ApplicationEffect()
{
}

public static function setMove(displayObject:Object,xFrom:Number,xTo:Number,yFrom:Number,yTo:Number,dur:int,delay:int,fun:Function,easingFunction:Function=null):void
{
var move:Move = new Move ;
move.target = displayObject ;
if(xFrom != -1)
move.xFrom = xFrom ;
if(xTo != -1)
move.xTo = xTo ;
if(yFrom != -1)
move.yFrom = yFrom ;
if(yTo != -1)
move.yTo = yTo ;
move.duration = dur ;
move.startDelay = delay ;
if(easingFunction != null)
move.easingFunction = easingFunction ;
if(fun !=null)
move.addEventListener(EffectEvent.EFFECT_END,fun) ;
move.play() ;

}

public static function setResize(displayObject:Object,widthFrom:Number,widthTo:Number,heightFrom:Number,heightTo:Number,dur:int,delay:int,fun:Function,easingFunction:Function=null):void
{
var resize:Resize = new Resize ;
resize.target = displayObject ;
if(widthFrom != -1)
resize.widthFrom = widthFrom ;
if(widthTo != -1)
resize.widthTo = widthTo ;
if(heightFrom != -1)
resize.heightFrom = heightFrom ;
if(heightTo != -1)
resize.heightTo = heightTo ;
resize.duration = dur ;
resize.startDelay = delay ;
if(easingFunction != null)
resize.easingFunction = easingFunction ;
if(fun !=null)
resize.addEventListener(EffectEvent.EFFECT_END,fun);
resize.play();
}

public static function setFade(displayObject:Object,duration:Number,alphaFrom:Number,alphaTo:Number,delay:Number,fun:Function,easingFunction:Function=null):void
{
var fade:Fade = new Fade ;
fade.target=displayObject;
fade.duration=duration;
if(alphaFrom != -1)
fade.alphaFrom=alphaFrom;
if(alphaTo != -1)
fade.alphaTo=alphaTo;
if(delay != -1)
fade.startDelay = delay ;
if(easingFunction != null)
fade.easingFunction = easingFunction ;
if(fun !=null)
fade.addEventListener(EffectEvent.EFFECT_END,fun);
fade.play();
}

public static function setBlur(displayObject:Object,duration:Number,blurXFrom:Number,blurXTo:Number,blurYFrom:Number,blurYTo:Number,fun:Function,easingFunction:Function=null):void
{
var blur:Blur= new Blur ;
blur.target=displayObject ;
blur.duration=duration ;
if(blurXFrom != -1)
blur.blurXFrom=blurXFrom ;
if(blurXTo != -1)
blur.blurXTo=blurXTo ;
if(blurYFrom != -1)
blur.blurYFrom=blurYFrom ;
if(blurYTo != -1)
blur.blurYTo=blurYTo ;
if(easingFunction != null)
blur.easingFunction = easingFunction ;
if(fun !=null)
blur.addEventListener(EffectEvent.EFFECT_END,fun) ;
blur.play();
}
public static function setRotate(displayObject:Object,angleFrom:Number,angleTo:Number,fun:Function,easingFunction:Function=null):void
{
var rotate:Rotate = new Rotate;
rotate.target=displayObject;
if(angleFrom != -1)
rotate.angleFrom=angleFrom;
if(angleTo != -1)
rotate.angleTo=angleTo;
if(easingFunction != null)
rotate.easingFunction = easingFunction ;
if(fun !=null)
rotate.addEventListener(EffectEvent.EFFECT_END,fun);
rotate.play();
}

public static function setGlow(displayObject:DisplayObject,color:Number,alphaFrom:Number,alphaTo:Number,blurXFrom:Number,
blurXTo:Number,blurYFrom:Number,blurYTo:Number,dur:Number,delay:Number,fun:Function,easingFunction:Function=null):void
{
var glow:Glow = new Glow ;
glow.target = displayObject ;
if(color != -1)
glow.color = color ;
if(alphaFrom != -1)
glow.alphaFrom = alphaFrom;
if(alphaTo != -1)
glow.alphaTo = alphaTo;
if(blurXFrom != -1)
glow.blurXFrom = blurXFrom;
if(blurXTo != -1)
glow.blurXTo = blurXTo;
if(blurYFrom != -1)
glow.blurYFrom = blurYFrom;
if(blurYTo != -1)
glow.blurYTo = blurYTo ;
if(delay != -1)
glow.startDelay = delay ;
if(easingFunction != null)
glow.easingFunction = easingFunction ;
if(fun != null)
glow.addEventListener(EffectEvent.EFFECT_END,fun) ;
glow.play() ;
}

}
}


这样,使用效果会非常方便,使用方法如下

ApplicationEffect.setMove(loginWindow,0,100,0,100,500,200,moveEffectHandler,null) ;
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值