as3 TweenMax TweenLite方法

as3 TweenMax TweenLite方法补充(暂停、重新播放、倒序播放)。现在来好好的学习一下：

TweenLite.to(mc, 1.5, {x:100});

里面的mc指所作用的对象,1.5指运动的时间，{x:100} 表示mc的x属性变化，最终停下来时x的值为100. (即mc从当前位置,经过1.5秒，匀速移动到x=100的位置)

TweenLite.from(mc, 1.5, {x:100})

里面的mc指所作用的对象,1.5指运动的时间, 这里是指，mc从当前位置,经过1.5秒，从x=100的位置移动到当前mc所在的位置。“注意与上面的区别，他们恰好相反”）

下面我们以上面的TweenLite.to() 来讲解相关属性：

TweenLite.to() 
 TweenLite.from()
//返回的都是TweenLite类型


TweenLite.to(mc, 1.5, {x:100});
//我们还可以在{}里加些其他相关的属性

下面有delay属性其表示延迟delay时间后才发生Tween :

1 TweenLite.to(mc, 1, {x:100, delay:2}); 
2 //表示需要经过2秒，mc才执行发生移动

我们还可以在{}加入alpha、 ease(缓动) onComplete(所调用的方法名)等属性：

1 TweenLite.to(mc, 1.5, {x:100, ease:Elastic.easeOut, delay:0.5, onComplete:myFunction});
2 function myFunction():void
3 {
4     trace("tween finished");
5 }
6 
7 /*上面的 ease:Elastic.easeOut是缓动类的一种类型 onComplete:myFunction 表示tween执行完后就会调用myFunction方法（即执行完Tween后，紧接着就调用myFunction方法，）。*/

TweenLite还有一方法，如：pause(), resume(), reverse(), restart()

pause() 表示暂停

resume() 表示继续播放缓动

restart() 表示重头开始播放缓动

reverse() 表示按与原方向相反的方向缓动（例如：缓动了2秒后，调用该方法，就会经过相同的时间（2秒）按原路返回）

下面是一个对各个属性进行验证的小例子：

start_btn是开始按钮，即按下它才会执行缓动

btn 按钮是对一些方法的验证，你可以改变里面的相关方法进行验证如将 tween.reverse(); 改成tween.resume();

 1 import com.greensock.*;
 2 import com.greensock.easing.*;
 3 var isPause:Boolean;
 4 var tween:TweenLite;
 5 btn.enabled = false;
 6 start_btn.addEventListener(MouseEvent.CLICK,begin);
 7 btn.addEventListener(MouseEvent.MOUSE_DOWN,onDown);
 8 function begin(e:MouseEvent)
 9 {
10     btn.enabled = true;
11     tween = TweenLite.from(mc,10,{x:300,y:300,alpha:0.5,delay:2,onComplete:completeIt});
12 }
13 function completeIt()
14 {
15 
16     trace("缓动执行完毕，开始调用此方法");
17     trace(tween);
18     //TweenLite类型
19 
20 }
21 
22 function onDown(e:Event):void
23 {
24     if (isPause==false)
25     {
26         tween.pause();
27         isPause = true;
28     }
29     else
30     {
31         tween.reverse();
32         isPause = false;
33     }
34 
35 }

onComplete : Function – 缓动结束时执行的函数。
onCompleteParams : Array – 给 onComplete 参数指定的函数传递参数 (可选的)

					stageBallDowntween = TweenLite.to(nowStageDownBall,ballDownPerTime*(2-getSamePipOtherBallInfo_arr[1]),{rotation:360,x:e.target.x,y:e.target.y-stageBallHeight*getSamePipOtherBallInfo_arr[1],onComplete:completeIt,onCompleteParams:[]});

TweenLite可选属性：overwrite

overwrite属性来自 OverwriteManager 类

其有五种模式

0 : 速度最快的模式

1：适合按钮使用的模式 ,按钮发生 roll_over/roll_out 事件

2 ：默认模式。除了无速度（选择0）要求，和作用对象为按钮（选择2）外，一般用默认模式。

overwrite属性：默认值是 2 即 auto

一般用法：

1  TweenLite.to(mc, 1, {x:100, overwrite:2}); 
2 //推荐 使用这种， 2 代表的是模式2 即AUTO模式   也是默认值
3 
4 // 或者
5 
6 TweenLite.to(mc, 1, {x:100, overwrite:true});

//在使用模式时 ，需要初始化 即： 

OverwriteManager.init(2)
 /* 里面的模式2 只是起个初始化作用，  你可以将其修改为其他的模式，但是上面的初始化必不可少，否则无效（无效则用默认模式2） 。
模式修改是在overwrite里进行的。*/

//例如：

OverwriteManager.init(2)
//初始化
TweenLite.to(btn, 1, {x:100, overwrite:1});
//初始化模式为2，现在修改为1

TweenLite和TweenMax的比较

使用TweenLite，编译后文件较小，假如对文件大小有要求的话，推荐使用这种。

使用TweenMax，编译后文件较大，该类，功能很多，编译后文件较大。

他们的用法相似：

1 TweenLite.to(mc, 1.5, {x:100, y:200, onComplete:myFunction, ease:Strong.easeOut});
2 TweenMax.to(mc, 1.5, {x:100, y:200, onComplete:myFunction, ease:Strong.easeOut});

使用 TimelineLite

可以将其 TimelineLite看成MovieClip

它的作用是控制tween的运动，其当我们需要mc的运动一个接着一个

例子:

1 var myTimeline:TimelineLite = new TimelineLite();
2 myTimeline.append( new TweenLite(mc, 1, {x:100}) );
3 //添加进myTimeline;
4 myTimeline.append( new TweenLite(mc, 1, {y:200}) );
5 myTimeline.append( new TweenMax(mc, 1, {tint:0xFF0000}) );

上面的代码的结果是： mc首先移到x=100处，然后移动到y=200处，最后颜色发生渐变，渐变到0xFF0000

它们的运动是一个接着一个进行。

下面是一个测试例子，

要求一开始并没有发生tween运动，当鼠标滑上和滑下按钮menu时执行tween运动

即： var myTimeline:TimelineLite = new TimelineLite({paused:true});

这样开始时就不发生tween运动了。

TimelineLite的属性方法和TweenLite很多一样。

var tween = new TweenLite({paused:true});

//这样开始时也是不发生tween运动

下面是具体的代码：

 1 var myTimeline:TimelineLite = new TimelineLite({paused:true});
 2 myTimeline.append( new TweenLite(mc, 1, {x:100}) );
 3 myTimeline.append( new TweenLite(mc, 1, {y:200}) );
 4 myTimeline.append( new TweenMax(mc, 1, {tint:0xFF0000}) );
 5 
 6 menu.addEventListener(MouseEvent.ROLL_OVER, overHandler);
 7 menu.addEventListener(MouseEvent.ROLL_OUT, outHandler);
 8 
 9 function overHandler(event:MouseEvent):void
10 {
11     myTimeline.play();
12 }
13 
14 function outHandler(event:MouseEvent):void
15 {
16     myTimeline.reverse();
17 }

除此之外，

我们还可以在某个时刻或者某个标签插入tween运动，用到的方法是TimelineLite的insert()方法。

我们还可用TimelineLite的addlabel() 给某个时刻插入标签。

append() 的第二个参数offset表示上一个tween过后，在过offset时间执行本tween运动

例子：

 1 var myTimeline:TimelineLite = new TimelineLite();
 2 
 3 //在时刻为1秒的地方插入 tween运动，即第一秒结束后才运动
 4 myTimeline.insert( new TweenLite(mc, 2, {x:100}), 1);
 5 //提前1.5秒发生tween运动;
 6 myTimeline.append( new TweenLite(mc, 1, {y:200}), -1.5);
 7 // 为4秒时刻增加标签 spin;
 8 myTimeline.addLabel("spin", 4);
 9 
10 //在spin标签处添加tween动画;
11 myTimeline.insert( new TweenLite(mc, 1, {rotation:"360"}), "spin");

我们也可对多个运动同时进行运动

myArrayOfSprites是运动对象mc的数组

 1 myTimeline.insertMultiple( TweenMax.allFrom(myArrayOfSprites, 1, {y:"-100", autoAlpha:0}) ); 
 2 
 3 TweenLite.delayedCall(2, myFunction, [myParam1, myParam2]); 
 4 /*表示经过2秒后执行myFunction（）方法，[myParam1, myParam2是该方法的参数*/
 5 
 6 
 7 TweenLite.to(mc, 1, {x:"100"});
 8 //在原坐标的基础上增加100像素 注意与x:100的区别
 9 //如果传入的参数是数值，一定要转换为字符串:
10 TweenLite.to(mc, 1, {x:String(myVariable)});
11 
12 
13 TweenMax.pauseAll()
14 TweenMax.killAll();

转载修改于：http://blog.sina.com.cn/s/blog_8b7ca01301012d7n.html