Flash AS代碼制作絢麗的光影變幻GIF動畫效果(代碼解析)
我要評論代碼解析：
首先從整段上代碼上，我們實際上只用了一個for循環(huán)。這個for循環(huán)的作用是復(fù)制20個鏈接名為partical的影片剪輯。然后我們在循環(huán)的內(nèi)部對復(fù)制后的粒子引用名mc進(jìn)行初始化，控制。
起始的兩行是用來調(diào)整所有粒子的相對屏幕中的位置的。
代碼：
var cx = 180;
var cy = 180;
接下來我們從for循環(huán)的內(nèi)部開始說起，我們將它分為塊，一塊是初始化復(fù)制后的粒子，另一段是為粒子實例mc 加入動態(tài)屬性，為后面的控制移動做準(zhǔn)備。第三塊則是使用onEnterFrame循環(huán)來控制移動。
初始化復(fù)制后的粒子
代碼：
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調(diào)整mc實例的偏移位置的.
_x = cx+Math.random()*60;
_y = cy+Math.random()*60;
}
這一段代碼，現(xiàn)在來講我們已經(jīng)很熟知了，我們通過頂端的for循環(huán)20次。將庫中的鏈接名為partical的粒子復(fù)制到場景中。復(fù)制的方法我們使用是的是attachMovie的方式，復(fù)制后的影片剪輯更名為”p” +I，也就是說你復(fù)制的結(jié)果應(yīng)是p0，p1，p2，p3…..p19，而所有的這些影片剪輯我們?yōu)樗饌€實例名為mc.它代表了所有復(fù)制得到的影片剪輯。在with內(nèi)部，我們開始指定這些粒子的初始位置。注意此時我們用上了cx，cy.并且加上了隨機(jī)數(shù)60，也就是說料子初始化的位置在180-240的位置之間。
為粒子實例mc 加入動態(tài)屬性
代碼：
mc.blendMode = "add";
//設(shè)定mc實例的角度隨機(jī)值
mc.tx = random(360);
mc.ty = random(360);
//設(shè)定用于mc角度的增量隨機(jī)值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設(shè)定mc實例的速度隨機(jī)值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉(zhuǎn)到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
在這段代碼的開始的位置mc.blendMode ="add" 便是我們加入融合模式的重點所在了，如果沒有這一些就不會出來相疊加后的融合效果。但實現(xiàn)它的前題是我們必須要處理如基本了粒子活動，所以習(xí)慣上我們都是最后才加上濾鏡或是融合模式。在這段代碼中，所有的都是為第三段的循環(huán)準(zhǔn)備的。其中有兩句是用來做為角度的增量隨機(jī)值的。這個角度增量值實際是為了在onEnterFrame循環(huán)中增加的角度的變化。使效果變得更明顯。這一段中的最后一句也是重點，因為我們在partical的影片剪輯中放置了五個不同顏色的小球，我們通過隨機(jī)跳轉(zhuǎn)命令來達(dá)到不同顏色小球的切換。
用onEnterFrame循環(huán)來控制移動
代碼
mc.onEnterFrame = function() {
this.tx += this.xtempo;
this.ty += this.ytempo;
this._x = this.x0+Math.sin(this.tx)*this.xd;
this._y = this.y0+Math.cos(this.ty)*this.yd;
};
在這段代碼中，通過將前面定義的動態(tài)屬性，應(yīng)用在onEnterFrame循環(huán)中，起到?jīng)Q定性作用是.
代碼：
this._y = this.y0+Math.cos(this.ty)*this.yd;
其中this.tx，this.ty，this.xd，this.yd.均為前面定義的動態(tài)屬性。我們使用了sin()和cos ()方法是為了使每個粒子自身有一個環(huán)形的運動路線。
Ok.在整段代中，我們看到使用融合模式blendmode只有一行，但在這里它顯得尤為重要，加上與去掉效果是截然不同的。
現(xiàn)在你就可以測試你的影片了。
接下我們要在上面的基出上進(jìn)行一下變化?？纯葱Ч麜惺裁床煌?
我們現(xiàn)在要增加粒子的大小和范圍。代碼做如下的修改。
代碼：
var cx = 0;
var cy = 0;
//設(shè)定循環(huán)20次，準(zhǔn)備從庫中復(fù)制鏈接id為partical的影片.
for (var i = 0; i<100; i++) {
//復(fù)制影片剪輯，引用名稱為mc.
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調(diào)整mc實例的偏移位置的.
_x = cx+Math.random()*590;
_y = cy+Math.random()*350;
_xscale = _yscale = 100 * Math.random()*5+1;
}
//針對mc應(yīng)用融合模式類型"add"
mc.blendMode = "add";
//設(shè)定mc實例的角度隨機(jī)值
mc.tx = random(360);
mc.ty = random(360);
//設(shè)定用于mc角度的增量隨機(jī)值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設(shè)定mc實例的速度隨機(jī)值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉(zhuǎn)到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
//通過onEnterFrame循環(huán)，來讓粒子移動.
mc.onEnterFrame = function() {
this.tx += this.xtempo;
this.ty += this.ytempo;
this._x = this.x0+Math.sin(this.tx)*this.xd;
this._y = this.y0+Math.cos(this.ty)*this.yd;
};
}
接下來我們在這段代碼的基礎(chǔ)上在次進(jìn)行修改。我們此次要變換一下融合模式，就會得到不同的效果。如下代碼。
代碼：
var cx = 0;
var cy = 0;
//設(shè)定循環(huán)20次，準(zhǔn)備從庫中復(fù)制鏈接id為partical的影片.
for (var i = 0; i<100; i++) {
//復(fù)制影片剪輯，引用名稱為mc.
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調(diào)整mc實例的偏移位置的.
_x = cx+Math.random()*590;
_y = cy+Math.random()*350;
_xscale = _yscale = 140 * Math.random()*5+1;
}
//針對mc應(yīng)用融合模式類型"add"
mc.blendMode = "hardlight";
mc.cacheAsBitmap = true;
//設(shè)定mc實例的角度隨機(jī)值
mc.tx = random(360);
mc.ty = random(360);
//設(shè)定用于mc角度的增量隨機(jī)值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設(shè)定mc實例的速度隨機(jī)值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉(zhuǎn)到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
//通過onEnterFrame循環(huán)，來讓粒子移動.
mc.onEnterFrame = function() {
this.tx += this.xtempo;
this.ty += this.ytempo;
this._x = this.x0+Math.sin(this.tx)*this.xd;
this._y = this.y0+Math.cos(this.ty)*this.yd;
};
}
斜體加粗的代碼為我們所修改過的位置，我們增大了縮放，同時將融合模式換成了hardlight.當(dāng)然你可以試一下其它的融合方式，同時我們增加了mc.cacheAsBitmap = true.通過這一句是加速我們的影片剪輯的運算速度。測試的效果如下。
教程結(jié)束，以上就是Flash AS代碼制作絢麗的光影變幻GIF動畫效果，希望對大家有所幫助！
相關(guān)文章
- 本教程是向大家介紹Flash遮罩特效實例之百葉窗效果，教程比較基礎(chǔ)，適合新手學(xué)習(xí)。希望對大家有所幫助2014-09-03
- 本教程是向大家介紹利用Flash制作描紅和描邊的文字動態(tài)效果，制作方法很簡單，推薦給腳本之家的朋友，喜歡的朋友可以跟著一起來學(xué)習(xí)2014-08-13
- 本教程是向大家介紹利用Flash制作漂亮的熒光文字效果，教程難度不是很大，主要使用了漸變填充等工具，新手朋友可以過來學(xué)習(xí)一下2014-08-13
- 本教程向大家介紹了Flash制作漂亮的光影字效果，教程主要運用了遮罩技術(shù)，使平凡的文字看上去更加絢麗。推薦給大家，希望大家能認(rèn)真學(xué)習(xí)2014-08-14
- 本教程是向腳本之家的朋友介紹Flash制作紅色點狀線框文字方法，制作過程很簡單，教程屬于入門教程，對于新手來說是個非常不錯的教程。推薦給大家，希望大家喜歡2014-09-10