【转】TweenMax参数说明

2010-09-01 [1125] news as3 tween

转自：http://blog.5d.cn/user12/dzxz/200809/500547.html

TweenMax 建立在 TweenLite 和 TweenFilterLite 基础之上，因此，又揉合了这二者的功能，使得功能更加的齐备，但是如果说易用性，觉得还是 TweenLite 来得方便一些。我的译文是从 TweenLite 开始的，接着是 TweenFilterLite 最后是 TweenMax ，这也恰好是这个类发展的轨迹，沿着这个轨迹一路读过来，会觉得容易理解很多。

TweenMax 建立在 TweenLite 核心类以及它的大哥 TweenFilterLite 基础之上，它为 Tween 家族增加了新的受欢迎的功能（尽管只是锦上添花），从而使家族更加的壮大，比如贝赛尔缓动、暂停/继续能力，简便的连续缓、16进制颜色缓动、以及更多的内容。

TweenMax

采用了与它的兄弟相似的易于学习的语法结构。实事上，因为它扩展自它们，TweenMax 可以做任何 TweenLite 和/或者 TweenFilterLite 能做的事，还加上了更多的特色。那么为什么要建立 3 个类，而不是 1 个呢？问的好，我的目标是：效率最大化，尺寸最小化。坦白的说，TweenLite 可能是所有的程序员在 90% 的项目中都需要用到的，而它仅有 3k。相对它的功能来说，它是非常高效和紧凑的。

但是如果你需要对滤镜进行缓动，或者更丰富的图像效果，比如说饱和度(saturation)、对比度(contrast)、色相(hue)、调色等等进行控制， 那就装上 TweenFilterLite 总共 6k 。还想要的更多？ No problem ！TweenMax 已经在总共 8k 的大小里面塞满了足够多的功能。

想查看相关的功能对比图，请访问 TweenMax.com 以获取更多信息。

( TweenMax 类包中直接包含有独立的 TweenLite 和 TweenFilterLite 类，因此下载这一个包就可以了，在 Flash 类路径中添加的时候，也只需要添加这一个路径就可以了----译者注)

TweenMax 创造了一种全新的功能，叫做 "bezierThrough"（暂译为贝塞尔通路），这个功能允许你定义一些点，通过贝塞尔曲线连接这些点，（通常的控制点只是用来拉近曲线，这里的点直接在曲线的路径上）。当然，如果你愿意，你可以用更正规的贝塞尔曲线。目前，TweenMax增加了下列功能（相对于 TweenFilterLite 而言)：

  • 进行贝塞尔缓动（包括指定通路 THROUGH 点和运动对象的自动方位导航(在贝塞尔曲线中移动时，对象的旋转角度是自动控制的，译者注))
  • 连续的缓动 或称为 序列化的缓动
  • 对对象数组(数组中存放了不同的对象，译者注)中的对象进行统一的缓动，使用 allTo() 和 allFrom()
  • 缓动中的 暂停/继续 功能，使用 pause() 和 resume() 方法，或者 "paused" 属性 (比如 myTween.paused = true)
  • isTweening 静态方法，用来判断一个对象是否正在进行缓动(比如 TweenMax.isTweening(my_mc))
  • 跳转至缓动的任何时段，使用 "progress" 属性。输入一个 0 到 1 之间的数值。 progress 值为零，将会把缓动的进程跳转到初始阶段，值为 1 时，跳转至 100% 完成状态，值为 0.5 时，将转至缓动过程的半山腰位置。
  • 例如: myTween.progress = 0.5;
  • 对 16 进制的颜色进行缓动，使用 hexColors 属性
  • 获取缓动效果的实例数组，该数组中包括了加在一个指定的目标对象上的所有的缓动效果的实例，该数组可以容纳 TweenMax 和 TweenLite 和 TweenFilterLite 三种类型的缓动实例。
  • 例如: TweenMax.getTweensOf(my_mc); // (如果 my_mc 上使用了不止一个的缓动效果，那么这里将返回一个数组，数组中是不同的缓动效果的实例，可以用来对每个缓动进行实时的控制，译者注)
  • 获取 TweenMax (和 TweenLite 和 TweenFilterLite) 的实例数组，使用用静态函数 getAllTweens()
  • 中止（杀死）所有的缓动(以及可选的完成部分缓动)
  • 暂停/继续 全部的缓动

参数

  1. target : Object - 目标 MovieClip (或其它对象)，对它的属性进行缓动
  2. duration : Number - 动画的时间长度（单位：秒）
  3. vars : Object -一个包含了多种属性的对象，用来存贮缓动结束时的各种属性值（如果你使用 TweenLite.from() 方法，这里的参数表示缓动的初始值）。

例如:

alpha: 目标对象在缓动结束时的 alpha (不透明度的级别)值。（当使用TweenMax.from()时，表示开始缓动时的 alpha 值)

举个例子，如果 target_obj.alpha 是 1，当这个缓动代码被执行时，将 alpha 参数设成 0.5 ，它将实现从 1 到 0.5 的渐变缓动。

x: 想要改变 MovieClip 的 x 位置，只需要将这个参数值设成你希望的缓动结束时的值即可。（如果使用 TweenMax.from()，则表示缓动开始时的 x 值）

专有属性

  • delay : Number - 延迟缓动 (以秒为单位)
  • ease : Function - 缓动函数. 例如，fl.motion.easing.Elastic.easeOut 函数。默认的是 Regular.easeOut函数
  • easeParams : Array - 用来存贮缓动公式所需要的额外数据. 当使用 Elastic 公式并且希望控制一些额外的参数，
  • 比如振幅和周期。大多数的缓动公式是不需要参数的，因此，你不需要给其它的缓动公式传递参数。
  • autoAlpha : Number - 用它来代替 alpha 属性，可以获得一些副加的效果，比如当 alpha 值缓动到 0时，
  • 自动将 visible 属性改为 false。当缓动开始前，autoAlpha 大于 0 时，它将会自动把 visible 属性变成 true 。
  • volume : Number - 改变 MovieClip 或者 SoundChannel 的音量，将缓动结束时的音量值写在这里即可。(如果使用 TweenMax.from()，这里的值表示缓动开始时的音量).
  • tint : Number - 改变可显示对象(DisplayObject)的色调/颜色，将缓动结束时的16进制值颜色值（比如0xFF0000）写在这里即可。(如果使用 TweenMax.from()，这里的值表示缓动开始时的颜色值).
  • 如果想要移除颜色，传一个 null 做为颜色值即可。
  • frame : Number - 将 MovieClip 缓动到指定的帧频
  • bezier : Array - Bezier 缓动，允许你以非线性的方式进行缓动。例如，将一个 MovieClip 从原始的 (0,0) 的位置，向右移动500像素，到(500,0)，在缓动的中间向下弯曲。只需要向贝赛尔数组中传递多个对象，每一个都是一个控制点（关于控制点是如何工作的请参考 Flash 的 curveTo() 绘图方法相关说明）。在这个例子中，假设我们的控制点是 x/y 坐标
  • 250,50。把 my_mc 放到 0,0 位置，然后执行下面的代码：
    TweenMax.to(my_mc, 3, {_x:500, _y:0, bezier:[{_x:250, _y:50}]});
  • bezierThrough : Array - 与上面的贝赛尔数组相似，但是它接收的不是控制点，而是贝赛尔曲线要经过的位置点。与控制点相比，这样的用法更加直观。
  • orientToBezier : Array (或者 Boolean 类型) - 设计师/开发人员经常用到的一个效果，让 MovieClip/Sprite 自动调整自身的方向（改变 rotation），使之符合贝赛尔路径的方向（就像是汽车在曲折的道路上需要不断调整方向一样----译者注）。orientToBezier 使得这一切变得简单。为了更精确的调整 rotation 属性，TweenMax 需要 4 方面的信息:
    1. 位置属性 1 (通常为 "x")
    2. 位置属性 2 (通常为 "y")
    3. 旋转属性 (通常为 "rotation")
    4. 旋转的度数(可选的 - 让它更容易的正确瞄准 MovieClip )
  • 当 orientToBezier 属性为数组时，该（容器）数组中的每个元素是包含了一组数据的数组（形如[[x1,y1,rota1,ang1],[x2,y2,rota2,ang2]]----译者注）。
  • 为了获得最大的灵活性，你可以向容器数组中传递任意数量的数组，逐个的指定旋转属性。这在进行 3D 工作进会很方便，因为你可以旋转多个坐标轴。如果进行的是标准的 2D x/y 坐标系贝赛尔缓动，只需要传递一个布尔值 true ，然后 TweenMax 将会使用一个典型的数组设置 [["x", "y", "rotation", 0]] 。
  • 提示：不要忘了这里存在着容器数组（注意：数组前后有两层方括号）
  • hexColors : Object - 尽管 16 进制颜色是一种技术上使用的数字，但当你试途按照数字增减的老办法来缓动时，你会发现颜色的变化并不平滑。为了更恰当的进行颜色缓动，通常需要独立的对红、绿、蓝的成分进行缓动。TweenMax 把这一切变得简单。将一个 16 进制颜色值缓动到另一个 16 进制颜色值，只需要使用这个 TweenMax 中专用的 hexColors 属性即可。
    这个属性必须是一个对象，该对象具有相关的颜色属性，属性名称与目标对象中使用的 16 进制颜色属性的名称相同。比如，如果 my_obj 对象具有一个“myHexColor”属性，想让它在两秒种内缓动为红色 (0xFF0000)，需要这样做：
  • TweenMax.to(my_obj, 2, {hexColors:{myHexColor:0xFF0000}}); (内层花括号括起来的部分，表示的就是一个包含有 myHexColor属性的对象----译者注)
  • 可以传递任意数量的 hexColor 属性。
  • onStart : Function - 在缓动开始时想要执行某个函数，就将函数的引用（通常是函数名）放到这里。当缓动是带延迟的，这一点会非常有用。
  • onStartParams : Array - 为缓动开始时要执行的函数传递参数。(可选的)
  • onUpdate : Function - 缓动过程中，每次更新属性值时，会执行这里指定的函数(缓动开始后，每一帧被触发一次)。
  • onUpdateParams : Array - 给 onUpdate 参数指定的函数传递参数 (可选的)
  • onComplete : Function - 缓动结束时执行的函数。
  • onCompleteParams : Array - 给 onComplete 参数所指定的函数传递参数(可选的)
  • renderOnStart : Boolean - 当使用带有延迟缓动的 TweenFilterLite.from() ，并且希望阻止缓动的渲染（rendering）效果，直到缓动真正开始，将这个值设为 true.默认情况下该值为 false，这会让 TweenMax.from() 渲染效果立即被执行，甚至是在延迟尚未结束之前。
  • overwrite : Boolean - 如果不希望当前的缓动效果自动覆盖到其它的影响同一属性的缓动，请确保这个值设为 false。
  • blurFilter : Object - 应用模糊滤镜，需要传递一个具有下列（一个或多个）属性的对象做为参数：blurX（横向的模糊度）, blurY（纵向的模糊度）, quality（品质,默认值为2）
  • glowFilter : Object - 应用发光滤镜，需要传递一个具有下列（一个或多个）属性的对象做为参数：alpha（通明度），blurX , blurY , color（颜色），strength（强度）, quality，inner（内侧发光），knockout（挖空）
  • 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 - 1，为 0 表示缓还未开始，0.5 缓动进行了一半，1 缓动结束)
  • paused : Boolean （逻辑值）

关键方法:

  • TweenMax.to(target:Object, duration:Number, vars:Object):TweenMax
  • TweenMax.from(target:Object, duration:Number, vars:Object):TweenMax
  • TweenMax.allTo(targets:Array, duration:Number, vars:Object):Array
  • TweenMax.allFrom(targets:Array, duration:Number, vars:Object):Array
  • TweenMax.sequence(target:Object, tweens:Array):Array
  • 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
  • pause():void
  • resume():void

示例:

对 MovieClip 进行连续的缓动，先用2秒钟时间让透明度降到 50%，然后用1秒钟时间滑落到 y 坐标为300的位置，使用如下的代码：

1import gs.TweenMax;
2TweenMax.sequence(clip_mc, [{time:2, alpha:0.5}, {time:1, y:300}]);

使用 Back.easeOut 函数对影片剪辑 clip_mc 进行缓动，缓动持续 5秒钟，alpha 值变到 0.5，x 坐标变到 120，延迟 2秒钟执行，缓动结束后，调用“onFinishTweenusing”，并且为这个函数传递几个参数（数值5 和 对 clip_mc 的引用），代码如下：

1import gs.TweenMax;
2import fl.motion.easing.Back;
3TweenMax.to(clip_mc, 5, {alpha:0.5, x:120, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:[5, clip_mc]});
4function onFinishTween(argument1:Number, argument2:MovieClip):void {
5trace("The tween has finished! argument1 = " + argument1 + ", and argument2 = " + argument2);
6}

如果舞台上的影片剪辑已经处于期望的缓动结束时位置，而你希望它从其它位置用 5 秒钟的时间回到当前位置，（比如从比当前位置高 100 像素或屏幕外更高的地方，通过改变 y 属性，下落到当前位置）可以使用下面的代码：

1import gs.TweenMax;
2import fl.motion.easing.Elastic;
3TweenMax.from(clip_mc, 5, {y:"-100", ease:Elastic.easeOut});

备注

给参数值加上引号，表示对指定的属性进行相应操作。比如，使用 TweenMax.to(mc, 2, {x:"-20"}); 它将 mc.x 向左移动 20 像素，与此相同效果的代码是：

1TweenMax.to(mc, 2, {x:mc.x - 20});

可以对任何 MovieClip 使用 "volume" 缓动,就比如：

1TweenMax.to(myClip_mc, 1.5, {volume:0});

可以将 MovieClip 缓动成某种色调或颜色，使用 "tint" 属性,比如:

1TweenMax.to(myClip_mc, 1.5, {tint:0xFF0000});

想要对数组内容进行缓动，将数值放到一个叫 endArray 的数组中即可，例如:

1var myArray:Array = [1,2,3,4];
2TweenMax.to(myArray, 1.5, {endArray:[10,20,30,40]});

可以在任何时候终止缓动，使用 TweenMax.killTweensOf(myClip_mc); 函数。如果想强制终止缓动，可以传递一个 true 做为第二个参数，比如

1TweenMax.killTweensOf(myClip_mc, true);

去除延迟回调函数，用 TweenMax.killDelayedCallsTo(myFunction_func); 这项功能可以用来控制回调函数的优先级。

使用 TweenMax.from() 方法，可以使目标对象运动回它所在的位置。比如，你可以将对象在舞台上摆放整齐（缓动结束时的位置），然后利用缓动，让它们跑到那个位置上去，你可以将缓动初始位置的 x 或 y 或 alpha (或者其它你需要的属性)当做参数传递给这个方法函数。