Tweener/TweenLite

Tweener 是按对象添加渐变的，要想对多个对象添加渐变，就要做多个渐变。
 Tweener.addTween(spriteA, {x:”800”, time:3});
 Tweener.addTween(spriteB, {x:”300”, time:3});
 但你可以很方便的对一个对象的不同属性添加渐变。
使用Tweener的另一个好处是它让你更方便的创建序列。其中有两种方法可以实现。
1)在构造函数里设置一个onComplete回调函数。代码例子如下：
import caurina.transitions.Tweener;
public function TweenerSequence()
  {
   stage.scaleMode = StageScaleMode.NO_SCALE;
   stage.align = StageAlign.TOP_LEFT;
   
   sprite = new Sprite();
   sprite.graphics.beginFill(0xff0000);
   sprite.graphics.drawRect(-50, -25, 100, 50);
   sprite.graphics.endFill();
   sprite.x = 100;
   sprite.y = 100;
   addChild(sprite);
   
   Tweener.addTween(sprite, {x:800, time:3, transition:"easeInOutCubic", onComplete:tween1End});
  }
  
  private function tween1End():void
  {
   Tweener.addTween(sprite, {y:400, time:3, transition:"easeInOutCubic", onComplete:tween2End});
  }
  
  private function tween2End():void
  {
   Tweener.addTween(sprite, {rotation:360, time:4, transition:"easeInOutCubic"});
  }
2)delay属性。它是以秒数为单位的数字，Tweener会在这个时间后开始执行。代码例子如下：
{
   
   sprite = new Sprite();
   sprite.graphics.beginFill(0xff0000);
   sprite.graphics.drawRect(-50, -25, 100, 50);
   sprite.graphics.endFill();
   sprite.x = 100;
   sprite.y = 100;
   addChild(sprite);
   
   Tweener.addTween(sprite, {x:800, time:3, transition:"easeInOutCubic"});
   Tweener.addTween(sprite, {y:400, time:3, transition:"easeInOutCubic", delay:3});
   Tweener.addTween(sprite, {rotation:360, time:4, transition:"easeInOutCubic", delay:6});
  }
 注意：一个需要小心的地方是用delay给同一个对象的同一属性添加两个渐变的时候，只要第二个渐变的延迟时间不短于第一个渐变的执行时间，那么两个渐变都会被执行。下面的例子，sprite会移动到x轴800的位置，然后移动到100。
 Tweener.addTween(sprite,{x:800, time:3});
 Tweener.addTween(sprite,{x:100, time:3, dalay:3});
 但如果第二个渐变的延迟不能让第一个渐变结束，而出现时间上的交集，第一个渐变就会被第二个渐变覆盖，根本不会被执行。
 Tweener.addTween(sprite,{x:800, time:3});
 Tweener.addTween(sprite,{x:100, time:3, dalay:2.5});
 在这里，sprite会静止2.5秒然后移动到x轴100的位置。
 
 Tweener的缺点是松散的数据类型管理。

TweenLite/TweenGroup
1)  单个补间
 import gs.TweenLite;
 import gs.easing.Elastic;
 
 private var sprite:Sprite;
 private var tween:TweenLite;
 
 tween = new TweenLite(sprite, 3, {x:800, y:400, rotation:360});
 tween.ease = Elastic.easeInOut;
2)  补间序列-第一种方法
 private var sprite:Sprite;
 private var tween1:TweenLite;
 private var tween2:TweenLite;
 private var tween3:TweenLite;
 
 tween1 = new TweenLite(sprite, 3, {x:800});
 tween2 = new TweenLite(sprite, 3, {y:400, delay:3, overwrite:0});
 tween3 = new TweenLite(sprite, 3, {rotation:360, delay:6, overwrite:0});
 
 补间序列- 第二种方法
 private var sprite:Sprite;
 private var tween1:TweenLite;
 private var tween2:TweenLite;
 private var tween3:TweenLite;
 
 public function TweenLiteSequence2()
  {
   stage.scaleMode = StageScaleMode.NO_SCALE;
   stage.align = StageAlign.TOP_LEFT;
   
   sprite = new Sprite();
   sprite.graphics.beginFill(0xff0000);
   sprite.graphics.drawRect(-50, -25, 100, 50);
   sprite.graphics.endFill();
   sprite.x = 100;
   sprite.y = 100;
   addChild(sprite);
   
   tween1 = new TweenLite(sprite, 3, {x:800, onComplete:onTween1End});
  }
  
  private function onTween1End():void
  {
   tween2 = new TweenLite(sprite, 3, {y:400, onComplete:onTween2End});
  }
  
  private function onTween2End():void
  {
   tween3 = new TweenLite(sprite, 3, {rotation:360});
  }
 
TweenGroup：
package {
 
 import flash.display.*;
 
 import gs.TweenGroup;

 [SWF(backgroundColor=0xffffff)]
 public class TweenGroupDemo1 extends Sprite
 {
  private var sprite:Sprite;
  private var group:TweenGroup;
  
  public function TweenGroupDemo1()
  {
   stage.scaleMode = StageScaleMode.NO_SCALE;
   stage.align = StageAlign.TOP_LEFT;
   
   var s1:Sprite = makeSprite(100, 100, 0xff0000);
   var s2:Sprite = makeSprite(100, 200, 0x00ff00);
   var s3:Sprite = makeSprite(100, 300, 0x0000ff);
   var s4:Sprite = makeSprite(100, 400, 0xffff00);
   
   TweenGroup.allTo([s1, s2, s3, s4], 3, {x:800});
   
   /*
   var tg:TweenGroup = TweenGroup.allTo([s1, s2, s3, s4], 1, {x:800});           //排序执行
   tg.align = TweenGroup.ALIGN_SEQUENCE;;                                     
   */
  }
  
  private function makeSprite(xpos:Number, ypos:Number, color:uint):Sprite
  {
   var s:Sprite = new Sprite();
   s.graphics.beginFill(color);
   s.graphics.drawRect(-50, -25, 100, 50);
   s.graphics.endFill();
   s.x = xpos;
   s.y = ypos;
   addChild(s);
   return s;
  }
 }
}