当前位置: 代码迷 >> Web前端 >> GreenSock卡通平台学习笔记(一)TweenLite
  详细解决方案

GreenSock卡通平台学习笔记(一)TweenLite

热度:166   发布时间:2013-01-06 15:44:47.0
GreenSock动画平台学习笔记(一)TweenLite
GreenSock动画平台学习笔记(一)TweenLite 

静态属性

TweenLite.defaultEase

设置默认的缓动函数



静态方法

TweenLite.to( target:Object, duration:Number, vars:Object):TweenLite

功能:用来创建动画

参数:target:要创建动画的影片剪辑

        duration:动画持续的时间,以秒为单位(如果整个动画模式是基于帧的话则以帧为单位)

        vars:要参与动画的属性,以对象形式来写,比如{x:100,y:100,…},这些属性是动画完成的目标

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


   var myTween:TweenLite = new TweenLite(mc, 1, {x:100});  //以第一个代码效果相同


   var myTween:TweenLite = TweenLite.to(mc, 1, {x:100});   //以第一个代码效果相同



TweenLite.from( target:Object, duration:Number, vars:Object):TweenLite

功能:用来创建动画,与TweenLite.to不同的是,这个函数动画的属性目标是影片剪辑的现有属性,初始属性是vars设定的属性

参数:target:要创建动画的影片剪辑

        duration:动画持续的时间,以秒为单位(如果整个动画模式是基于帧的话则以帧为单位)

        vars:要参与动画的属性,以对象形式来写,比如{x:100,y:100,…},这些属性是动画的初始属性

例:
TweenLite.from(mc, 1, {x:100});



TweenLite.delayedCall( delay:Number,onComplete:Function,onCompleteParams:Array = null, useFrames:Boolean = false):TweenLite

功能:用于在一定时间或一定帧数后自动执行一个函数,相当于一个延迟器吧

参数:delay:要延迟执行函数的时间(或是帧数)

        onComplete:要延迟执行的函数

        onCompleteParams:要延迟执行的函数的参数,以数组形式传入

        useFrames:指明是用时间还是帧数来记时

例:
TweenLite.delayedCall(1, myFunction, ["param1", 2]);



TweenLite.killTweensOf( target:Object, complete:Boolean = false, vars:Object = null):void

功能:用来消除动画

参数:target:要消除动画的影片剪辑

        complete:如果为真则会在消除动画的同时把动画属性设为完成时的值,如果为假则不会

        vars:要消除动画的属性,以对象形式来写,比如{x:true,y:true,…},这些属性将不再参与动画

例:
TweenLite.killTweensOf(mc, false, {alpha:true, x:true});




动画属性对象vars:


{


delay:Number   在开始动画前要等待的时间,单位为秒(或帧数) 


useFrames:Boolean   如果设为true则动画模式是基于帧的,否则是基于时间的(指的是动画函数中要指定时间的地方)


ease:Function  缓动函数,默认为Quad.easeOut


easeParams:Array 缓动函数的参数,以数组形式传入,注意只是有些缓动函数才需要需要参数的


immediateRender:Boolean 当值为false时,


overwrite:int  用来控制同一个对象上有多个动画时的覆盖之类的情况,tweenlite只有1和2这两种情况可选,具体请见OverwriteManager


onInit:Function 当动画开始渲染(或是说开始运行时)前要执行的函数


onInitParams:Array onInit函数的参数,以数组形式传入


onStart:Function 当动画开始渲染时要执行的函数,有可能会被执行多次,因为动画时可以重复开始的


onStartParams:Array onStart函数的参数,以数组形式传入


onUpdate:Function 当每一次动画属性值发生变化时调用的函数


onUpdateParams:Array  onUpdate函数的参数,以数组形式传入


onComplete:Function 当动画执行完毕后要调用的函数


onCompleteParams:Array  onComplete函数的参数,以数组形式传入


onReverseComplete:Function  当一个动画被反转后又回到了原点时调用的函数


onReverseComplete
:Array 
onReverseComplete
函数的参数,以数组形式传入


}






OverwriteManager


NONE(0)  同一个物体上的动画之间不会被覆盖


ALL_IMMEDIATE(1) 会立即覆盖之前的所有动画(包括运行的和没运行的),也是也tweenlite的默认模式,被覆盖的动画会保持覆盖那一刻的现状


AUTO(2) 当动画开始运行时(即不包括延迟或暂停之类的)覆盖,且只会覆盖同一物体上的正在运行的动画中的有重叠的动画属性。是TweenMax、TimelineLite、TimelineMax的默认覆盖模式


CONCURRENT(3) 当动画开始运行时覆盖,会覆盖同一物体上正在运行的所有动画


ALL_ONSTART(4)  当动画开始运行时覆盖,会覆盖同一物体上的所有动画(包括运行的和没运行的)


PREEXISTING(5)  当动画开始运行时覆盖,会覆盖同一物体上在本动画之前创建的所有动画(包括运行的和没运行的)


可以使用OverwriteManager.init(OverwriteManager.AUTO);来给所有动画定义覆盖方式,如果想给不同动画定义不同覆盖方式,则在具体的vars对象中定义


2、3、4、5类型都需要导入OverwriteManager类