LTweenLite Class
LTweenLite是比较常用的一个动画库,包含各种缓动效果,使用LTweenLite能够简化动画制作的代码编写工作。
Constructor
LTweenLite
()
public
Item Index
Methods
- LTweenLite.pauseAll static
- LTweenLite.remove static
- LTweenLite.removeAll static
- LTweenLite.resumeAll static
- LTweenLite.to static
Properties
- LTweenLite.PlayStyle static
Methods
LTweenLite.remove
(
public
static
-
tween
[静态方法]停止当前的缓动动画。
Parameters:
-
tween
LTweenLiteChild当前正在进行缓动的对象.
Example:
LInit(1000/50,"legend",800,450,main);
var tween;
function main(){
LGlobal.setDebug(true);
var rect = new LSprite();
rect.x = 50;
rect.y = 50;
rect.graphics.drawRect("#FF00FF",1,[0,0,20,20],true,"#FF00FF");
addChild(rect);
tween = LTweenLite.to(rect,1,{x:500,loop:true,ease:LEasing.Sine.easeInOut})
.to(rect,1,{x:50,ease:LEasing.Quad.easeInOut});
var stopButton = new LButtonSample1("stop");
stopButton.x = 50;
circle.y = 50;
stopButton.y = 100;
addChild(stopButton);
stopButton.addEventListener(LMouseEvent.MOUSE_UP,stopTween);
}
function stopTween(e){
LTweenLite.remove(tween);
}
LTweenLite.removeAll
()
public
static
[静态方法]停止所有正在进行的缓动动画。
Example:
LInit(1000/50,"legend",800,450,main);
function main(){
LGlobal.setDebug(true);
var circle = new LSprite();
circle.x = 50;
circle.y = 50;
circle.graphics.drawArc("#FF0000",1,[0,0,20,0,Math.PI*2],true,"#FF0000");
addChild(circle);
var rect = new LSprite();
rect.x = 50;
rect.y = 50;
rect.graphics.drawRect("#FF00FF",1,[0,0,20,20],true,"#FF00FF");
addChild(rect);
LTweenLite.to(circle,1,{x:500,y:400,scaleX:3,scaleY:3,loop:true,ease:LEasing.Strong.easeInOut})
.to(circle,1,{x:700,y:50,scaleX:1,scaleY:1,ease:LEasing.Quint.easeIn})
.to(circle,1,{x:50,y:50,ease:LEasing.Quint.easeIn});
LTweenLite.to(rect,1,{x:500,loop:true,ease:LEasing.Sine.easeInOut})
.to(rect,1,{x:50,ease:LEasing.Quad.easeInOut});
var stopButton = new LButtonSample1("stopAll");
stopButton.x = 50;
circle.y = 50;
stopButton.y = 100;
addChild(stopButton);
stopButton.addEventListener(LMouseEvent.MOUSE_UP,stopTween);
}
function stopTween(e){
LTweenLite.removeAll();
}
LTweenLite.resumeAll
()
public
static
[静态方法]重新播放被暂停的所有缓动动画。
Example:
LTweenLite.pauseAll();
LTweenLite.resumeAll();
LTweenLite.to
(
LTweenLiteChild
public
static
-
target
-
duration
-
vars
[静态方法]用于创建一个LTweenLiteChild实例动画,让某对象的某些属性缓动到指定的目标的值(从当前值)。
Parameters:
-
target
Object要缓动的对象(这里注意类型是Object,并不仅仅是LSprite,LBitmap).
-
duration
Float持续的时间(单位是秒)
-
vars
Object一个Object,包含你想要缓动的所有属性,比如 onComplete, ease, etc。举例, 将一个 对象mc.x 缓动到 100 ,将 mc.y 缓动到 200 ,缓动结束后执行一个函数 myFunction, 这时候,你可以这么写: TweenLite.to(mc, 1, {x:100, y:200, onComplete:myFunction});
除了使用对象的属性之外,你也可以使用一些特殊的值:
属性 类型 说明 tweenTimeline float 动画播放的类型,默认值为LTweenLite.TYPE_FRAME。
LTweenLite.TYPE_FRAME:用桢来播放动画。
LTweenLite.TYPE_TIMER:用时间来播放动画。
为了测试两者的区别,接下来的demo在进行缓动时首先延迟2秒钟,使用LTweenLite.TYPE_FRAME播放是无间断,而使用LTweenLite.TYPE_TIMER播放则会直接跳到结束。测试链接
delay float 延时几秒后开始缓动,这在有先后顺序的缓动效果中很有用 ease LEasing (or Function) 应用在variables上的缓动函数,比如LEasing.Quad.easeIn or LEasing.Cubic.easeOut。默认值是LEasing.None.easeIn. onComplete Function 在缓动效果结束时触发此方法。回调函数是有参数的,使用方法同下面的例子。 onStart Function 在缓动开始时触发此方法.回调函数是有参数的,使用方法同下面的例子。 onUpdate Function 当属性值发生改变时(缓动进行中的每一帧,每一秒)触发此方法。回调函数是有参数的,使用方法同下面的例子。 loop Boolean 如果设定为 true, 缓动就会持续循环. playStyle LTweenLite.PlayStyle 只有设定loop为true, playStyle才会有效。测试链接 coordinate Array 你可以自定义缓动路径,路径的每个点必须是LPoint对象,或者类似于{x:1,y:2}的形式,测试链接
Returns:
LTweenLiteChild:
一个LTweenLiteChild的实例
Example:
LInit(1000/50,"legend",800,450,main);
function main(){
LGlobal.setDebug(true);
var circle = new LSprite();
circle.x = 50;
circle.y = 50;
circle.graphics.drawArc("#FF0000",1,[0,0,20,0,Math.PI*2],true,"#FF0000");
addChild(circle);
var rect = new LSprite();
rect.x = 50;
rect.y = 100;
rect.graphics.drawRect("#FF00FF",1,[0,0,20,20],true,"#FF00FF");
addChild(rect);
LTweenLite.to(circle,2,{x:500,y:400,scaleX:3,scaleY:3,ease:LEasing.Strong.easeInOut})
.to(circle,2,{x:700,y:50,scaleX:1,scaleY:1,ease:LEasing.Quint.easeIn,onComplete:function(e){
trace(e.currentTarget);
trace(e.target);//circle
}});
LTweenLite.to(rect,1,{x:500,loop:true,ease:LEasing.Sine.easeInOut})
.to(rect,1,{x:50,ease:LEasing.Quad.easeInOut});
}
Properties
LTweenLite.PlayStyle
Object
public
static
缓动动画循环的类型
属性 | 说明 |
---|---|
LTweenLite.PlayStyle.None | 无效果 |
LTweenLite.PlayStyle.Init | 每次缓动都从第一次缓动开始时的值开始进行。 |