Greensock平台
Greensock介紹:使用代碼實現動畫對于初學flash的人來說有點望而生畏,但是使用Greensock平臺,可以使這編程一個簡單而有趣的事情。Greensock包含TweenNano、TweenLite、TweenMax三個類,其中TweenLite作為該平臺的基石,TweenNano是TweenLite的超級輕量級,其去掉了很多功能,但對于那些對swf體積要求苛刻的廣告設計人員,TweenNano確是一個很好的選擇;TweenMax為TweenLite的增強版,擁有更強的功能(如默認激活大部分插件),因而體積比較大……
官方英文教程及類庫下載:http://www.greensock.com/get-started-tweening/
TweenNano
特點:輕量級,壓縮只有1.6K,可以實現TweenLite能夠實現的功能,除以下幾點:
1、不能激活插件和使用插件
2、不能實現復雜的序列sequencing(可以使用”delay”專有屬性實現簡單的序列)和TweenNano 實例不能夠嵌入 TimelineLite 或 TimelineMax實例以實現團體groups管理。
3、重寫模式更少,你可以覆蓋或不覆蓋同一對象上的其它動畫效果,但是不能使用OverwriteManager來擴展動畫的其他性能,也不能夠AUTO, CONCURRENT, PREEXISTING, and ALL_ONSTART模式
4、相對TweenLite, TweenNano沒有pause(), play(), resume(), restart(), reverse(), invalidate(), onStart, defaultEase, easeParams, currentTime, startTime, totalTime, paused, reversed, and totalDuration等方法和屬性。
注意:
1. TweenNano(target:Object, duration:Number, vars:Object);第1個參數為你應用動畫的對象,第2個參數為動畫延續的時間,第3個參數包含你要應用動畫的所有屬性對象且該對象內屬性順序可以錯亂;
2.如以字符串形式傳入值,將使用相對值;
3.終止所有的動畫,使用TweenNano.killTweensOf(mc);
4. TweenNano.from()使對象從參數設定的狀況運動到當前狀況。
專有屬性:
delay : Number?
useFrames : false?
ease : Function?
onUpdate : Function?
onUpdateParams : Array?
onComplete : Function?
onCompleteParams : Array?
immediateRender : true?
overwrite : true?
公共屬性:
duration : Number
target : Object
useFrames : Boolean
vars : Object
公共方法:
TweenNano(target:Object, duration:Number, vars:Object)
complete(skipRender:Boolean = false):void
delayedCall(delay:Number, onComplete:Function, onCompleteParams:Array = null, useFrames:Boolean = false):TweenNano? [static]?
from(target:Object, duration:Number, vars:Object):TweenNano? [static]?
kill():void
killTweensOf(target:Object, complete:Boolean = false):void? [static]?
renderTime(time:Number):void
to(target:Object, duration:Number, vars:Object):TweenNano? [static]?
例子:
import com.greensock.*;?
import com.greensock.easing.*;???
TweenNano.to(mc,2, {x:400, overwrite:false,delay:2});//默認情況下,建立一個新的動畫將覆蓋該對象其它動畫,將overwrite設置為false將阻止這種覆蓋行為。
TweenNano.to(mc, 5, {alpha:0.5, x:120, overwrite:false, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:[5, mc]});//透明度變為0.5,位置為x軸120,效果為Back.easeOut,不覆蓋前面的動畫,且在動畫結束后調用onFinishTween函數
function onFinishTween(param1:Number, param2:MovieClip):void {
trace("The tween has finished! param1 = " + param1 + ", and param2 = " + param2);
}
使用范例:
TweenNano、TweenLite、TweenMax使用相同的語法格式,而且as3版本和as2版本形式也一致,只是在as2中將x,y,alpha(0-1),rotation修改為_x,_y,_alpha(0-100),_rotation。
1、導入類
import com.greensock.*;//也可以單個導入,flash會自動嵌入用到的類
import com.greensock.easing.*;
2、使用TweenLite完成制作的簡單的緩動
TweenLite.to(mc, 1.5, {x:100});//經過1.5秒mc從當前移動到x軸100位置
3、可以對物體任意多個屬性同時運用緩動效果,如對mc的多個屬性運用動畫
TweenLite.to(mc, 1.5, {x:100, y:200, alpha:0.5});//經過1.5秒mc從當前移動到x軸100,y軸200位置,透明度變為0.5
4、As2與as3的語法很相識,大部分只需要使用as2中屬性的書寫方式
TweenLite.to(mc, 1.5, {_x:100, _y:200, _alpha:50});//as2語法,當然as2中需導入as2的greensock類庫
5、可以使用from()方法使mc從參數設定的狀況轉變到當前的狀況:
TweenLite.from(mc, 1.5, {y:0, alpha:0});//1.5秒內將mc從y軸為0,透明度為0轉變到當前的狀態
????? 如果你習慣使用面向對象編程模式,可以使用存儲引用的方式建立對象,然后方便地控制,靈活運用pause(), resume(), reverse(), restart()方法。
var myTween:TweenLite = new TweenLite(mc, 1, {x:100, y:200, alpha:0.5});//和使用TweenLite.to()等效
專有屬性:即為TweenNano、TweenLite或TweenLite認可的保留關鍵字,有著特定的用途,如onComplete, ease, overwrite, paused, useFrames, immediateRender, onStart, onUpdate, onCompleteParams,
ease: 緩動方程式,可以使用com.greensock.easing包、flash自身的或Robert Penner的緩動類
overwrite :設定緩動是否覆蓋
useFrames :設定是基于幀還是基于seconds,默認為false
onComplete :設定緩動結束后調用的函數
immediateRender:使用form()方法時是否在delay之前就設置到初始位置
TweenLite.to(mc, 1.5, {x:100, ease:Elastic.easeOut, delay:0.5, onComplete:myFunction});?
function myFunction():void {?
??? trace("tween finished");?
}
使用插件:可以將插件看作為TweenLite能夠動態添加具有額外功能的特別屬性,TweenLite默認情況下沒有激活插件(TweenMax默認為激活),當激活插件后,對TweenLite、TweenMax都產生作用。
使用插件首先需要導入插件,另外需要激活,將需要激活的插件傳遞給activate方法的參數數據就行了。
import com.greensock.plugins.*;
import com.greensock.*;
import com.greensock.easing.*;
TweenPlugin.activate([GlowFilterPlugin,AutoAlphaPlugin]);
TweenLite.to(mc, 0.5, {x:277, y:311,autoAlpha:0.9, glowFilter:{color:0x91e600, alpha:1, blurX:30, blurY:30}, ease:Cubic.easeInOut});
覆蓋其它緩動:默認情況下,TweenLite將覆蓋之前所有的緩動,要使TweenLite使用AUTO模式,只要加上下面的一行代碼:
OverwriteManager.init(2)
??? 注:上面的代碼具有全局影響,如果只需要對單獨的緩動使用AUTO模式,可使用下面的代碼
TweenLite.to(mc, 1, {x:100, overwrite:2});?
//TweenLite.to(mc, 1, {x:100, overwrite:true});
控制緩動:當你建立緩動后,可以使用pause() resume(), reverse(), play(), restart(), invalidate(), or kill()開對它進行操作。
var myTween:TweenLite = new TweenLite(mc, 1, {x:100, y:100});?
myTween.pause(); //暫停
myTween.resume(); //恢復
myTween.reverse(); //反轉
myTween.play(); //開始
myTween.restart(); //重新開始
myTween.invalidate(); //清除初始值
myTween.kill(); //取消
TweenLite.killTweensOf(mc);//取消所有
代碼解析:
import com.greensock.*;
import com.greensock.easing.*;
TweenMax.to(mc, 3, {alpha:0.5});//mc經過3秒透明度變為0.5
TweenMax.to(myButton, 2, {scaleX:1.5, scaleY:1.5, ease:Elastic.easeOut});
//mybutton經過兩秒擴張為原來的1.5倍,使用Elastic.easeOut動畫效果
TweenMax.from(mc3, 1, {y:"-100", alpha:0}); //mc3從相對該位置-100經過1秒運動到該位置,且透明度變為0
TweenMax.fromTo(mc4, 1, {x:100}, {x:300, tint:0xFF0000}); //mc4從x為100移動到x為300的地方,且顏色變換為0xFF0000
TweenMax.to(mc, 5, {delay:3, x:300, ease:Back.easeOut, onComplete:onFinishTween, onCompleteParams:[5, mc]});?
//延遲3秒后mc在5秒內移動到x為300的位置,動畫效果為Back.easeOut,并在完成后調用onFinishTween函數
function onFinishTween(param1:Number, param2:MovieClip):void {
?trace("The tween has finished! param1 = " + param1 + ", and param2 = " + param2);
}
TweenMax.delayedCall(2, myFunction, ["myParam"]); //延遲2秒后調用myFunction函數
//tween every MovieClip in the "letters" Array up 100 pixels (changing their "y" property to a relative value of "-100") over 2 seconds while fading out, and stagger the start time of each tween by 0.1 seconds. There could literally be hundreds of MovieClips in the "letters" Array and this one line of code would tween them all!?
TweenMax.allTo(letters, 2, {y:"-100", alpha:0}, 0.1);
//use the object-oriented syntax to create a TweenMax instance and store it so we can reverse, restart, or pause it later. Make it repeat twice with a 1-second delay between each repeat cycle.?
var myTween:TweenMax = new TweenMax(mc2, 3, {y:200, repeat:2, repeatDelay:1, onComplete:myFunction});
//some time later (maybe in by a ROLL_OUT event handler for a button), reverse the tween, causing it to go backwards to its beginning from wherever it is now.?
myTween.reverse();
//pause the tween?
myTween.pause();
//restart the tween?
myTween.restart();
//make the tween jump to its halfway point?
myTween.currentProgress = 0.5;
?
?
?
轉載于:https://www.cnblogs.com/1000pen/archive/2012/10/27/2742288.html
總結
以上是生活随笔為你收集整理的Greensock平台的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 安卓Activity劫持与反劫持
- 下一篇: 金蝶K3 Wise单据导入导出工具使用说