zoukankan      html  css  js  c++  java
  • TweenLite 缓动类

    TweenLite参数说明:
            1) $target : Object - 作为目标的对象, MovieClip或者其它对象
            2) $duration : Number - 动画的时间长度(单位:秒)
            3) $vars : Object – 对象,通过属性值,来存贮各种属性参数用于缓动。
             (如果你使用TweenLite.from() 方法,这里的参数表示缓动的初始值)
               Object 该对象所具有的属性:
               alpha: alpha  目标对象应该完成 (或开始,当使用 TweenLite.from()时)的透明度级别.如果 
                        target.alpha 是1,当缓动被执行的时候,你指定参数为 0.5,它将把透明度从 1 缓动
                        到 0.5.
               x: 改变 MovieClip的 x 位置,把这个值设置成你希望的 MovieClip 的结束位置(如果你使用的是
                   TweenLite.from()这个值表示开始位置). ( y scaleX scaleY rotation等属性不重复说明)
               特别的属性 (**可选的**):
               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 。
               visible : Boolean - 在缓动结束时,想指定 DisplayObject 的 visible 属性,请使用这个参数
               volume : Number - 对soundTransform(MovieClip/SoundChannel/NetStream 等)对
                            象中的volume属性(音量大小)进行缓动 
               tint : Number - 改变 DisplayObject 的颜色,设置一个16进制颜色值之后,当缓动结束时,
                       目标对象将被变成这个颜色,(如果使用的是TweenLite.from(),这个值将表示目标对
                       象开始缓动时的颜色)。举个例子,颜色值可以设定为0xFF0000。
               removeTint : Boolean - 要移除 DisplayObject 颜色,将这个参数设成 true 。
               frame : Number - 将 MovieClip 缓动到指帧频。
               onStart : Function - 在缓动开始时想要执行某个函数,就将函数的引用(通常是函数名)放
                             到这里。如果缓动是带延迟的,那么在缓动开始前该函数不会被执行。
               onStartParams : Array - 为缓动开始时要执行的函数传递参数。(可选的)
               onUpdate : Function - 缓动过程中,每次更新时调用这里指定的函数(缓动开始后,每一帧被
                                触发一次)
               onUpdateParams : Array - 给 onUpdate 参数指定的函数传递参数 (可选的)
               onComplete : Function - 缓动结束时执行的函数。 
               onCompleteParams : Array - 给 onComplete 参数指定的函数传递参数 (可选的)
               persist : Boolean - 值为 true 时,TweenLite 实例将不会自动被系统的垃圾收集器给收走。
                            但是当新的缓动出现时,它还是会被重写(overwritten)默认值为 false.
               renderOnStart : Boolean - 如果你使用带有延迟缓动的 TweenFilterLite.from() ,并且阻
                                      止缓动的渲染(rendering )效果,直到缓动真正开始,将这个值设为 true.
                                    默认情况下该值为 false ,这会让渲染效果立即被执行,甚至是在延迟的时间
                                      还没到之前。
              overwrite : int - 当前的缓动被创建以后,通过这个参数可以限制作用于同一个对象的其它缓动
                             可选的参数值有:
                          - 0 (没有): 没有缓动被重写。这种模式下,运行速度是最快的,但是需要注意避免创
                                           建一些控制相同属性的缓动,否则这些缓动效果间将出现冲突。
                          - 1 (全部): (这是默认值,除非 OverwriteManager.init() 被调用过)对于同一对象的
                                           所有缓动在创建时将会被完全的覆盖掉。
                                 TweenLite.to(mc, 1, {x:100, y:200});
                                 TweenLite.to(mc, 1, {x:300, delay:2}); //后创建的缓动将会覆盖掉先前创
                                      建的缓动(可以起到这样的作用:缓动进行到一半时被中断,执行新的缓动)
                         -2 (自动): (当 OverwriteManager.init() 被执行后,会根据具体的属性值进行选择) 只
                                            覆盖对同一属性的缓动。
                                    TweenLite.to(mc, 1, {x:100, y:200});
                                    TweenLite.to(mc, 1, {x:300}); //only  "x" 属性的缓动将被覆盖
                         - 3 (同时发生): 缓动开始时,覆盖全部的缓动。
                                      TweenLite.to(mc, 1, {x:100, y:200});
                                      TweenLite.to(mc, 1, {x:300, delay:2});
                                      //不会覆盖先前的缓动,因为每二个缓动开始时,第一个缓动已经结束了。

    举例:
            将实例名为 "clip_mc" 的 MovieClip 透明度降到 50% (0.5) ,并将它 x 轴位置移动到 120 ,
    将音量将到 0,缓动总共用时 1.5 秒,代码如下:

    import gs.TweenLite;
    TweenLite.to(clip_mc, 
    1.5, {alpha:0.5, x:120, volume:0});

            如果希望使用更高级的缓动函数在 5 内,将 alpha 变到 0.5,将 x 移动 到 120 ,使用
    "easeOutBack" 弹性函数,缓动整体延迟 2 秒发生,并且在缓动结束时,执行 "onFinishTween"
    函数,并且为这个函数传递几个参数,(一个数值 5 以及对 clip_mc 的引用),代码如下:

    import gs.TweenLite;
    import fl.motion.easing.Back;
    TweenLite.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);
    }

     如果你的舞台上的 MovieClip 已经停在了它的结束位置,你只想让它花上5秒种回到这个位置,
    (只需要改变 y 属性,比当前位置高 100 像素的位置,让它从那里下落), 代码如下(这次使用
    的是 TweenLite.from 译者注):

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

     

    - 给参数值加上引号,表示对指定的属性进行相应操作。比如,使用

    TweenLite.to(mc, 2, {x:"-20"}); 

    它将 mc.x 向左移动 20 像素,与此相同效果的代码是:

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

    - 你可以用别的缓动函数替换 TweenLite 默认的缓动函数: Regular.easeOut.
    - 必须使用 Flash Player 9 或之后版本的播放器 (ActionScript 3.0)
    - 可以对任何 MovieClip 使用 "volume" 缓动,就比如:TweenLite.to(myClip_mc, 1.5, {volume:0});
    - 可以将 MovieClip 设定成某种颜色,使用 "tint" 参数,比如:

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

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

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

    - 可以在任何时候终止缓动,使用 TweenLite.killTweensOf(myClip_mc); 函数。如果想强制终止
    缓动,可以传递一个 true 做为第二个参数,比如 TweenLite.killTweensOf(myClip_mc, true);
    - 取掉延迟回调函数,用 TweenLite.killDelayedCallsTo(myFunction_func);这项功能可以用来控制
    回调函数的优先级。
    - 使用 TweenLite.from() 方法,可以使用对象从别的位置回到当前的位置。例如,你可以将对象在舞
    台上摆放整齐(缓动结束时的位置),然后利用缓动,让它们跑到那个位置上去,你可以将缓动的初始
    位置值 x 或 y 或 alpha (或者其它你需要的属性)当做参数传递给这个方法函数。

    import gs.TweenLite;
    import gs.easing.
    *
    ;

    stage.addEventListener(MouseEvent.CLICK, onCK);
    function
     onCK(evt) {
            TweenLite.to(mc, 
    0.5, {x:mouseX, y:mouseY, rotation:360
    });
    }

    在舞台上点击,会让mc 元件旋转并跑动到鼠标位置。
    来个应用举例:

    import gs.TweenLite;
    import gs.easing.
    *
    ;
    //因为 TweenLite 中提供有延迟缓动的参数 delay ,因此不需要使用定时器 timer 类,并且,缓动的开始、中间、结束位置

    //
    均可以指定相关的处理函数,所以 timer 更加的不需要。
    var pic_arr:Array = new Array();
    pic_arr.push( 
    new
     Pic1());
    pic_arr.push( 
    new
     Pic2());
    pic_arr.push( 
    new
     Pic3());
    pic_arr.push( 
    new
     Pic4());
    pic_arr.push( 
    new
     Pic5());
    pic_arr.push( 
    new
     Pic6());
    //pic类型为MovieClip,注册点在中心
    var originScaleX:Number = 0.47
    ;
    var originWidth:Number = pic_arr[0].width *
     originScaleX;
    var dist = originWidth + 15
    ;

    for (var i:int = 0; i<pic_arr.length; i++
    ) {
            
    //指定所有图块的大小及位置

            pic_arr.scaleX = pic_arr.scaleY = originScaleX;
            pic_arr.x 
    = i * dist + 0.5 * originWidth + 15
    ;
            pic_arr.y 
    = 200

            addChild( pic_arr );
    }
    function
     pushAside( ){
            
    //根据中心图块的大小变化,让周边图块发生移动

            var step = pic_arr[2].width/2 + 0.5 * originWidth + 15;
            pic_arr[0].x = pic_arr[2].x - step - dist;
            pic_arr[
    1].x = pic_arr[2].x -
     step;
            pic_arr[
    3].x = pic_arr[2].x +
     step;
            pic_arr[
    4].x = pic_arr[2].x + step +
     dist;
            pic_arr[
    5].x = pic_arr[2].x + step + 2 *
     dist;
    }
    function
     fadePic(){
            
    //降低透明度

            TweenLite.to(pic_arr[0], 1, {alpha:0.5, ease:Back.easeOut});
            TweenLite.to(pic_arr[
    1], 1, {alpha:0.5
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    3], 1, {alpha:0.5
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    4], 1, {alpha:0.5
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    5], 1, {alpha:0.5
    , ease:Back.easeOut});
    }
    function
     lightPic(){
            
    //增大透明度

            TweenLite.to(pic_arr[0], 1, {alpha:1, ease:Back.easeOut});
            TweenLite.to(pic_arr[
    1], 1, {alpha:1
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    3], 1, {alpha:1
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    4], 1, {alpha:1
    , ease:Back.easeOut});
            TweenLite.to(pic_arr[
    5], 1, {alpha:1
    , ease:Back.easeOut});
    }
    function
     enLargeMotion(){
            
    //中心图块放大的效果

            TweenLite.to(pic_arr[2], 0.8, {scaleX:0.8, scaleY:0.8, ease:Back.easeOut,delay:2,onStart:fadePic,onUpdate:pushAside,onComplete:toSmallMotion});
    }
    function
     toSmallMotion(){
            
    //中心图块缩小的效果

            TweenLite.to(pic_arr[2], 0.8, {scaleX: originScaleX, scaleY: originScaleX, ease:Back.easeOut,delay:1,onStart: lightPic,onUpdate: pushAside,onComplete:toLeftMotion});
    }
    function
     toLeftMotion(){
            
    //中心图块向左移动的效果

            var mc:MovieClip = pic_arr[2];
            TweenLite.to(mc, 
    0.8, {x:mc.x - dist , ease:Back.easeOut,delay:1
    ,onUpdate:pushAside,onComplete:rePlay});
    }
    function
     rePlay(){
            
    //将数组中的首个图块搬到最后一个位置,同时将该块从舞台左侧移动到舞台右侧

            var mc = pic_arr.shift();
            pic_arr.push( mc );
            mc.x 
    = pic_arr[4].x + originWidth + 15
    ;        
            
    //重新启动缓动效果

            enLargeMotion();
    }
    //首次启缓动效果

    enLargeMotion();
  • 相关阅读:
    收集一些网络检测和分析工具
    编程经验分享(转自银总的建议)
    代码着色和windows live writer真好
    pku1063 Flip and Shift严格证明
    So Many Skirt
    一些网址
    c++编写的算24程序
    一道简单的回溯搜索题
    windows程序设计第二章Unicode简介
    字符,字节和编码
  • 原文地址:https://www.cnblogs.com/leon3286/p/1768768.html
Copyright © 2011-2022 走看看