flex的动画效果

<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
clipAndEnableScrolling="true" (动画显示控制在本区域范围内)    
creationComplete="application1_creationCompleteHandler(event)">
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.events.EffectEvent;
import mx.events.FlexEvent;

import spark.effects.Animate;
import spark.effects.animation.MotionPath;
import spark.effects.animation.SimpleMotionPath;

private var _timer:Timer;

protected function application1_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
animate.width = 100;
animate.height = 100;
animate.y = -this.height; (设置y坐标初始位置)
animate.x = 0; (设置x坐标初始位置)
}

protected function cb_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
var showMotionPath1:SimpleMotionPath = new SimpleMotionPath("y");
showMotionPath1.valueTo = this.height / 2; (路径1-y轴上的运动)
var showMotionPath2:SimpleMotionPath = new SimpleMotionPath("x");
showMotionPath2.valueTo = this.width / 2; (路径2-x轴上的运动)
var showMotionPaths:Vector.<MotionPath> = new Vector.<MotionPath>();
showMotionPaths.push(showMotionPath1);
showMotionPaths.push(showMotionPath2); (把两个路径放入vector集合中)
var showAnimate:spark.effects.Animate = new spark.effects.Animate();
showAnimate.target = animate; (动画对象) showAnimate.motionPaths = showMotionPaths;

showAnimate.duration = 1000; (动画执行的时长)
showAnimate.addEventListener(EffectEvent.EFFECT_END,showAnimate_effectEndHandler); (给动画加一个完成的监听事件)
showAnimate.play(); (开始播放) }

private function showAnimate_effectEndHandler(event:EffectEvent):void
{
_timer = new Timer(3000,1); (完成上面的播放后3秒后执行timer事件1次)
_timer.addEventListener(TimerEvent.TIMER_COMPLETE,timer_timerCompleteHandler);
_timer.start();
}

private function timer_timerCompleteHandler(event:TimerEvent):void
{
var hiddenMotionPath:SimpleMotionPath = new SimpleMotionPath("y");
hiddenMotionPath.valueTo = -this.height;

var hiddenMotionPaths:Vector.<MotionPath> = new Vector.<MotionPath>();
hiddenMotionPaths.push(hiddenMotionPath);

var hiddenAnimate:spark.effects.Animate = new spark.effects.Animate();
hiddenAnimate.target = animate;
hiddenAnimate.motionPaths = hiddenMotionPaths;
hiddenAnimate.duration = 1000;

hiddenAnimate.play();

}
]]>
</fx:Script>
<s:Group id="animate" width="100" height="100">
<s:Rect top="0" bottom="0" left="0" right="">
<s:fill>
<s:SolidColor color="#BBBBBB"/>
</s:fill>
</s:Rect>
<s:Label text="动画效果" color="#000000"/>
</s:Group>
<s:Button id="cb" x="325" y="169" label="看效果" click="cb_clickHandler(event)"/>
</s:Group>

猜你喜欢

转载自mujinglanqq1.iteye.com/blog/2106333