性能数据: http://blog.greensock.com/tweening-speed-test/
– 诸多特性- 除了处理对象数字属性(x ,y )外,还能补间动画滤镜效果,
颜色, 声音, 色彩, 帧, 饱和度, 对比度, 色调, 色系, 亮度, 贝塞尔,
线条转换
贝塞尔曲线,
pause/resume, reverse(), restart(), 环绕值, 定点播放,最近旋转, 还有更多.
重写管理器是一个重要的新的亮点. 用于处理同一对象动画重叠时的效果.
– 可扩展性- 参考 TweenLite.as
– 可管理性 –
– 便于使用 –
– 更新-
– AS2 and AS3 – both.
2) $duration : Number – 持续时间
3) $vars : Object – 参数对象
示例:
渲染 tweenmyClip 的 透明度 到 0.5 在 1秒内.
TweenMax.to(myClip, 1, {alpha:0.5})
delay : Number – 延时渲染
ease : Function – 缓动效果
easeParams : Array – 上面的参数
onStart : Function – 开始时调用
onStartParams : Array – 参数
onUpdate : Function – 更新时调用
onUpdateParams : Array – 参数
onComplete : Function – 完成时调用
onCompleteParams : Array – 参数
persist : Boolean – 持久
renderOnStart : Boolean – 渲染时机 ture 等待延时 false 不等待
overwrite : int – 重叠渲染方式:
– 0 (NONE):
– 1 (ALL):
– 2 (AUTO):
– 3 (CONCURRENT):
onStartListener : Function – 开始事件.
监听它
tweenMaxInstance.addEventListener(TweenEvent.START, myFunction);
onUpdateListener : Function – 更新处理器
onCompleteListener : Function – 完成处理器
tweenMaxInstance.addEventListener(TweenEvent.COMPLETE, myFunction);
yoyo : Number – 渲染完成后倒放. 值为 0 时,不会停.
loop : Number – 重复. 值为 0 时,不会停.
timeScale : Number – 渲染速度 1 = 正常速度 , 0.5 = 一半的速度, 2 = 2倍速度
有一个全局的静态属性 TweenMax.globalTimeScale 影响所有的 TweenMax 和TweenFilterLite 渲染动画(但不影响 TweenLite)
startAt : Object – 开始参数,用于渲染开始位置.
比如:
如果你的影片当前位置为 100,你想渲染为 位置 0 到 500.
TweenMax.to(mc, 2, {x:500, startAt:{x:0}})
removeTint : Boolean – 为真移除色彩
示例:
设置控制点 x,y 坐标为 250,50.使你的 my_mc 在 0,0 坐标:
TweenMax.to(my_mc, 3, {x:500, y:0, bezier:[{x:250, y:50}]});
bezierThrough : Array – 控制点数组方式.
TweenMax.to(mc_mc, 3, {x:500, y:0, bezier:[{x:250, y:50},{x:250, y:100},{x:250, y:200}]});
orientToBezier : Array (or Boolean) – 带方向的贝塞尔曲线
TweenMax 需要4个参数:
1) 位置属性1 (“x”)
2) 位置属性2 (“y”)
3) 旋转属性property (“rotation”)
4) 度数(可选项- 确定方向)
属性类型 数组.
属性可以无限嵌套. 如果参数只传 true ,则默认为: [[“x”, “y”, “rotation”, 0]].
提示: 不要忘记外层的括号,它代表参数的容器.
roundProps : Array – 渲染?: TweenMax.to(mc, 2, {x:300, y:200, alpha:0.5, roundProps:[“x”,”y”]});
blurFilter : Object – 模糊滤镜
glowFilter : Object – 发光滤镜
colorMatrixFilter : Object – 颜色滤镜:
colorize, amount, contrast, brightness, saturation, hue, threshold, relative, matrix
dropShadowFilter : Object – 阴影滤镜:
alpha, angle, blurX, blurY, color, distance, strength, quality
bevelFilter : Object – 倾斜滤镜:
angle, blurX, blurY, distance, highlightAlpha, highlightColor, shadowAlpha, shadowColor, strength, quality
关键属性:
– progress : Number 进度 0 没有 0.5 一半 1 完成
– timeScale : Number 动画速度
– paused : Boolean 暂停
– reversed : Boolean 倒放
关键方法:
– TweenMax.to(target:Object, duration:Number, vars:Object):TweenMax
– TweenMax.from(target:Object, duration:Number, vars:Object):TweenMax
– TweenMax.getTweensOf(target:Object):Array
– TweenMax.isTweening(target:Object):Boolean
– TweenMax.getAllTweens():Array
– TweenMax.killAllTweens(complete:Boolean):void
– TweenMax.killAllDelayedCalls(complete:Boolean):void
– TweenMax.pauseAll(tweens:Boolean, delayedCalls:Boolean):void
– TweenMax.resumeAll(tweens:Boolean, delayedCalls:Boolean):void
– TweenMax.delayedCall(delay:Number, function:Function, params:Array, persist:Boolean):TweenMax
– TweenMax.setGlobalTimeScale(scale:Number):void
– addEventListener(type:String, listener:Function, useCapture:Boolean, priority:int, useWeakReference:Boolean):void
– removeEventListener(type:String, listener:Function):void
– pause():void
– resume():void
– restart(includeDelay:Boolean):void
– reverse(adjustStart:Boolean, forcePlay:Boolean):void
– setDestination(property:String, value:*, adjustStartValues:Boolean):void
– invalidate(adjustStartValues:Boolean):void
– killProperties(names:Array):void
必看的例子:
To tween the clip_mc MovieClip over 5 seconds, changing the alpha to 0.5, the x to 120 using the Back.easeOut
easing function, delay starting the whole tween by 2 seconds, and then call a function named “onFinishTween” when
it has completed and pass in a few parameters to that function (a value of 5 and a reference to the clip_mc),
you’d do so like:
import gs.*;
import gs.easing.*;
TweenMax.to(clip_mc, 5, {alpha:0.5, x:120, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:[5, clip_mc]});
function onFinishTween(argument1:Number, argument2:MovieClip):void {
trace(“The tween has finished! argument1 = ” + argument1 + “, and argument2 = ” + argument2);
}
If you have a MovieClip on the stage that is already in it’s end position and you just want to animate it into
place over 5 seconds (drop it into place by changing its y property to 100 pixels higher on the screen and
dropping it from there), you could:
import gs.*;
import gs.easing.*;
TweenMax.from(clip_mc, 5, {y:”-100″, ease:Elastic.easeOut});
To set up an onUpdate listener (not callback) that traces the “progress” property of a tween, and another listener
that gets called when the tween completes, you could do:
import gs.*;
import gs.events.TweenEvent;
TweenMax.to(clip_mc, 2, {x:200, onUpdateListener:reportProgress, onCompleteListener:tweenFinished});
function reportProgress($e:TweenEvent):void {
trace(“tween progress: ” + $e.target.progress);
}
function tweenFinished($e:TweenEvent):void {
trace(“tween finished!”);
}
提示: