Flash AS 實(shí)例進(jìn)階圖片閃白切換效果實(shí)現(xiàn)代碼

2020-07-17 13:14:00

字體：大中小

供稿：網(wǎng)友

　　“閃白”換場(chǎng)是電視拍攝用語(yǔ)，是畫(huà)面切換過(guò)程中場(chǎng)景出現(xiàn)空白，有人將這一手法應(yīng)用到網(wǎng)頁(yè)圖片的切換上來(lái)，也是一種不錯(cuò)的組圖顯示效果，這里我們用動(dòng)作腳本來(lái)制作一個(gè)這樣的實(shí)例。

　　源文件下載

　　>點(diǎn)擊查看動(dòng)畫(huà)效果<實(shí)例2-8閃白

　　基本思路

　?、?構(gòu)建一個(gè)數(shù)組放置庫(kù)中的多個(gè)類(lèi)型為 MC 的圖片。

　　②將數(shù)組中的元素依次加載到主場(chǎng)景。

　?、劾脦h(huán)來(lái)依次改變各 MC 的狀態(tài)。

　　新知識(shí)點(diǎn)

復(fù)制代碼

代碼如下:

my_array = new Array(); // 使用構(gòu)造函數(shù)來(lái)創(chuàng)建一個(gè)數(shù)組。
_root.attachMovie （） // 加載 MC 到主場(chǎng)景，本實(shí)例是按索引從數(shù)組中取得 MC 。

補(bǔ)充模糊濾鏡

復(fù)制代碼

代碼如下:

import flash.filters.BlurFilter;//載入濾鏡類(lèi)-模糊
var myBlurfilter:BlurFilter = new BlurFilter(blurX:Number, blurY:Number, quality:Number);// 創(chuàng)建一個(gè)模糊濾鏡對(duì)象
var filterArray:Array = new Array();//創(chuàng)建一個(gè)臨時(shí)數(shù)組
filterArray.push(myBlurfilter);//將新元素添加到數(shù)組的結(jié)尾
myMovieClip.filters = filterArray;//MC增加濾鏡

　　實(shí)例說(shuō)明

　?、?8 個(gè)同樣大小的位圖都轉(zhuǎn)換為 MC ，并在鏈接屬性里作好相關(guān)設(shè)置。

　　②第 1 幀加載 MC 和變量初始化 , 第 2 幀到第 7 幀設(shè)置循環(huán)， MC 被依次改變屬性為可見(jiàn)，并用透明度的變化來(lái)實(shí)現(xiàn)白和非白之間的畫(huà)面轉(zhuǎn)換。

　　編寫(xiě)動(dòng)作腳本

①在第 1 幀上輸入：

復(fù)制代碼

代碼如下:

tu = new Array("a", "b", "c", "d", "e", "f", "g", "h");// 創(chuàng)建一個(gè)數(shù)組，其中的元素是庫(kù)中的 MC
for (i=1; i<=8; i++) {
　　 _root.attachMovie(tu[i-1], "h"+i, i);// 將數(shù)組中 MC 加載到主場(chǎng)景的對(duì)象上
　　with (_root["h"+i]) {// 設(shè)置對(duì)象屬性
　　　　　 _x = 250;
　　　　　 _y = 90;
　　　　　_visible = false;
　 }
}
i = 1;
n = 0;

② 在第 2 幀上輸入：

復(fù)制代碼

代碼如下:

_root["h"+i]._visible = true;
_root["h"+i]._alpha = n*5;// 幀循環(huán)中透明度由 0 到 100 遞加
n++;

③ 在第 3 幀上輸入：

復(fù)制代碼

代碼如下:

if (n<21) {
　　gotoAndPlay(2);
}

④ 在第 5 幀上輸入：

復(fù)制代碼

代碼如下:

_root["h"+i]._alpha = n*5; // 幀循環(huán)中透明度由 100 到 0 遞減
n--;

⑤ 在第 6 幀上輸入：

復(fù)制代碼

代碼如下:

if (n>0) {
　　gotoAndPlay(5);
} else {
　　gotoAndPlay(2);
　　i++;
　　if (i>8) {
　　　　i = 1;
　　}
}

　　要點(diǎn)分析

　?、贁?shù)組中的元素就是庫(kù)中含有位圖的 MC 元件，共 8 個(gè)，數(shù)組元素的索引也是就是序列號(hào)是從 0 開(kāi)始，這里就是 0-7 ，將各 MC 再分別加載到一個(gè)新對(duì)象 MC 上，再由腳本控制這些新對(duì)象的狀態(tài)。

　?、趯?shí)例中是一個(gè)大循環(huán)里面嵌套兩個(gè)小循環(huán)，大循環(huán)是 8 個(gè) MC 循環(huán)顯示，而在顯示一個(gè) MC 的循環(huán)里，有前段的透明度由 0 到 100 的以 5 遞增的 20 次小循環(huán)，和后段的反向循環(huán)，顯示的效果就是圖片由白逐漸變清晰再由清晰變白，然后下一張圖片以同樣過(guò)程顯示。

　　小結(jié)

　　本講學(xué)習(xí)的內(nèi)容是了解和應(yīng)用了一維數(shù)組，這是數(shù)組使用的初步方法，在今后的學(xué)習(xí)中會(huì)掌握更加復(fù)雜的數(shù)組應(yīng)用，數(shù)組的應(yīng)用是廣泛的，而且有簡(jiǎn)潔清晰調(diào)用方便的特點(diǎn) 。幀循環(huán)也是應(yīng)用普遍的方法，這個(gè)實(shí)例有助于我們了解和掌握循環(huán)過(guò)程。

　　課后練習(xí)

　　修改源文件，使兩個(gè)圖片間的切換是前面的淡出，后面的淡入，中間不出現(xiàn)空白。

　　提示：在幀循環(huán)過(guò)程中不是一個(gè) MC 而是兩 MC 同時(shí)改變狀態(tài)，在最后一張圖和第一張圖片之間不出現(xiàn)空白更要專(zhuān)門(mén)編寫(xiě)幀循環(huán)語(yǔ)句。范例效果：

　　>點(diǎn)擊查看動(dòng)畫(huà)效果<練習(xí)2-8　　

　　補(bǔ)充模糊效果實(shí)例

　　在第 2 幀上輸入：

復(fù)制代碼

代碼如下:

_root["h"+i]._visible = 1;
import flash.filters.*;//載入濾鏡類(lèi)
mohu = new BlurFilter(n, n, 1);// 創(chuàng)建一個(gè)模糊濾鏡對(duì)象
shuzu = new Array();//創(chuàng)建一個(gè)臨時(shí)數(shù)組
shuzu.push(mohu);//將新元素添加到數(shù)組的結(jié)尾
_root["h"+i].filters = shuzu;//將濾鏡加到MC上
//_root["h"+i].filters = [mohu];//簡(jiǎn)略寫(xiě)法，可去掉4-6行
_root["h"+(i+1)]._visible = 1;
_root["h"+(i+1)]._alpha = n*5;
n++;

　　>點(diǎn)擊查看動(dòng)畫(huà)效果<

　　源文件

　　查看全套"Flash AS 實(shí)例進(jìn)階教程"