這篇教程是向大家介紹利用Flash AS代碼制作絢麗的光影變幻GIF動畫效果，制作出來的效果很漂亮。教程介紹地很詳細，最后作者還對AS代碼進行了解析。對于正在學習Flash AS代碼朋友非常有幫助，推薦給大家，希望對大家有所幫助。
效果演示:
制作思路: 這個影片剪輯中包含了五幀，每一幀上有不同顏色的小球，我們通過Actionscript代碼來控制跳定位在不同顏色的小球上，從而實現不同顏色小球之間相互疊加，并在場景中復制，同時通過Actionscript控制小球的自動移動，并應用融合效果。
制作方法:
1.新建一個Flash文檔，文件的場景大小設置為590*350.背景為黑色.幀頻設置為31，將其另存為blendmode3.fla.
2.打開新建的blendmode3.fla.在主場景中繪制一個38*38大小的園形二維形體，按下shift+F9打開混色器，選擇放射狀添充，當選擇藍色，如下圖所示.
注意右邊的混色器，在下面的滑塊中，我們左邊用的是藍色，右邊是也藍色，但它的透明度是0，添充后效果如下圖所示。
注意這個園形的大小當前為我們放大后觀看的效果，它的原本大小為38*38。
3.選中這個園形按下F8鍵，將其轉換為圖形符號，命將它的名稱命名為Blue.同時注意它的注冊點。將注冊點置于中心位置。如下圖所示。
4.確定后我們就創建完成了Blue符號，依照相同的方法，我們需要創建另外4種顏色的小球，在本例中我們創建了如下幾種顏色的小球。
5．還有一個創建不同顏色小球的簡單的方法，選中我們剛創建的藍色小球，右擊選擇直接復制。然后在進入到復制后的圖形元件內部，進行修改顏色。
6．創建完多個小球之后，我們在主場景保持空的。如果場景上有圖形元件要刪去。 然后按下Ctrl+F8.創建一個新的影片剪輯，我們將它命名為Clip.然后將我們剛剛他建的五個不同顏色的小球元件，從庫中拖至clip影片剪輯的幀上，如下圖所示。
7.ok.完成了這一步之后，返回到主場景中，選中庫中我們剛剛創建的clip影片剪輯，右擊選擇鏈接。會打開鏈接標識窗口。如下圖所示。
在打開的窗中，先選中”為Actionscript導出”，然后在鏈接標識處輸入出境partical名稱。確定。我們在此處創建的鏈接名是為我們在主幀上添寫代碼時，用來使用attachMovie進行貼加復制操作的。
8．完成上面的操作之后。選中主場景上的第一幀，按下F9，打開Actionscript面板。我們準備輸入代碼。
var cx = 180;
var cy = 180;
//設定循環20次，準備從庫中復制鏈接id為partical的影片.
for (var i = 0; i<20; i++) {
//復制影片剪輯，引用名稱為mc.
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調整mc實例的偏移位置的.
_x = cx+Math.random()*60;
_y = cy+Math.random()*60;
}
//針對mc應用融合模式類型"add"
mc.blendMode = "add";
//設定mc實例的角度隨機值
mc.tx = random(360);
mc.ty = random(360);
//設定用于mc角度的增量隨機值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設定mc實例的速度隨機值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
//通過onEnterFrame循環，來讓粒子移動.
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;
};
}
9，測試你的影片，你就會看到如下面的效果。
代碼解析：
首先從整段上代碼上，我們實際上只用了一個for循環。這個for循環的作用是復制20個鏈接名為partical的影片剪輯。然后我們在循環的內部對復制后的粒子引用名mc進行初始化，控制。
起始的兩行是用來調整所有粒子的相對屏幕中的位置的。
代碼：
var cx = 180;
var cy = 180;
接下來我們從for循環的內部開始說起，我們將它分為塊，一塊是初始化復制后的粒子，另一段是為粒子實例mc 加入動態屬性，為后面的控制移動做準備。第三塊則是使用onEnterFrame循環來控制移動。
初始化復制后的粒子
代碼：
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調整mc實例的偏移位置的.
_x = cx+Math.random()*60;
_y = cy+Math.random()*60;
}
這一段代碼，現在來講我們已經很熟知了，我們通過頂端的for循環20次。將庫中的鏈接名為partical的粒子復制到場景中。復制的方法我們使用是的是attachMovie的方式，復制后的影片剪輯更名為”p” +I，也就是說你復制的結果應是p0，p1，p2，p3…..p19，而所有的這些影片剪輯我們為它起個實例名為mc.它代表了所有復制得到的影片剪輯。在with內部，我們開始指定這些粒子的初始位置。注意此時我們用上了cx，cy.并且加上了隨機數60，也就是說料子初始化的位置在180-240的位置之間。
為粒子實例mc 加入動態屬性
代碼：
mc.blendMode = "add";
//設定mc實例的角度隨機值
mc.tx = random(360);
mc.ty = random(360);
//設定用于mc角度的增量隨機值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設定mc實例的速度隨機值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
在這段代碼的開始的位置mc.blendMode ="add" 便是我們加入融合模式的重點所在了，如果沒有這一些就不會出來相疊加后的融合效果。但實現它的前題是我們必須要處理如基本了粒子活動，所以習慣上我們都是最后才加上濾鏡或是融合模式。在這段代碼中，所有的都是為第三段的循環準備的。其中有兩句是用來做為角度的增量隨機值的。這個角度增量值實際是為了在onEnterFrame循環中增加的角度的變化。使效果變得更明顯。這一段中的最后一句也是重點，因為我們在partical的影片剪輯中放置了五個不同顏色的小球，我們通過隨機跳轉命令來達到不同顏色小球的切換。
用onEnterFrame循環來控制移動
代碼
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;
};
在這段代碼中，通過將前面定義的動態屬性，應用在onEnterFrame循環中，起到決定性作用是.
代碼：
this._y = this.y0+Math.cos(this.ty)*this.yd;
其中this.tx，this.ty，this.xd，this.yd.均為前面定義的動態屬性。我們使用了sin()和cos ()方法是為了使每個粒子自身有一個環形的運動路線。
Ok.在整段代中，我們看到使用融合模式blendmode只有一行，但在這里它顯得尤為重要，加上與去掉效果是截然不同的。
現在你就可以測試你的影片了。
接下我們要在上面的基出上進行一下變化。看看效果會有什么不同。
我們現在要增加粒子的大小和范圍。代碼做如下的修改。
代碼：
var cx = 0;
var cy = 0;
//設定循環20次，準備從庫中復制鏈接id為partical的影片.
for (var i = 0; i<100; i++) {
//復制影片剪輯，引用名稱為mc.
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調整mc實例的偏移位置的.
_x = cx+Math.random()*590;
_y = cy+Math.random()*350;
_xscale = _yscale = 100 * Math.random()*5+1;
}
//針對mc應用融合模式類型"add"
mc.blendMode = "add";
//設定mc實例的角度隨機值
mc.tx = random(360);
mc.ty = random(360);
//設定用于mc角度的增量隨機值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設定mc實例的速度隨機值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
//通過onEnterFrame循環，來讓粒子移動.
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;
};
}
斜體加粗的代碼是我們所修改的位置，我們增加了粒子的數量，同時加入了_xscale._yscale.縮放的隨機值，這樣便會放大粒子增加粒子的重合度。效果如下。
接下來我們在這段代碼的基礎上在次進行修改。我們此次要變換一下融合模式，就會得到不同的效果。如下代碼。
代碼：
var cx = 0;
var cy = 0;
//設定循環20次，準備從庫中復制鏈接id為partical的影片.
for (var i = 0; i<100; i++) {
//復制影片剪輯，引用名稱為mc.
var mc = this.attachMovie("partical"， "p"+i， i);
with (mc) {
//初始化影片剪輯的位置，注意此時cx，cy是用來調整mc實例的偏移位置的.
_x = cx+Math.random()*590;
_y = cy+Math.random()*350;
_xscale = _yscale = 140 * Math.random()*5+1;
}
//針對mc應用融合模式類型"add"
mc.blendMode = "hardlight";
mc.cacheAsBitmap = true;
//設定mc實例的角度隨機值
mc.tx = random(360);
mc.ty = random(360);
//設定用于mc角度的增量隨機值
mc.xtempo = Math.random()/10;
mc.ytempo = Math.random()/10;
//設定mc實例的速度隨機值
mc.xd = Math.random()*10+1;
mc.yd = Math.random()*10+1;
mc.x0 = mc._x;
mc.y0 = mc._y;
//跳轉到指定的幀，以變換不同顏色的小球上.
mc.gotoAndStop(random(5)+1);
//通過onEnterFrame循環，來讓粒子移動.
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.當然你可以試一下其它的融合方式，同時我們增加了mc.cacheAsBitmap = true.通過這一句是加速我們的影片剪輯的運算速度。測試的效果如下。
教程結束，以上就是Flash AS代碼制作絢麗的光影變幻GIF動畫效果，希望對大家有所幫助！
歡迎轉載：http://www.kanwencang.com/bangong/20161102/33043.html
文章列表
留言列表
