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

“閃白”換場是電視拍攝用語,是畫面切換過程中場景出現(xiàn)空白,有人將這一手法應(yīng)用到網(wǎng)頁圖片的切換上來,也是一種不錯(cuò)的組圖顯示效果,這里我們用動(dòng)作腳本來制作一個(gè)這樣的實(shí)例。
>點(diǎn)擊查看動(dòng)畫效果<實(shí)例2-8閃白
基本思路
?、?構(gòu)建一個(gè)數(shù)組放置庫中的多個(gè)類型為 MC 的圖片。
?、趯?shù)組中的元素依次加載到主場景。
?、劾脦h(huán)來依次改變各 MC 的狀態(tài)。
新知識(shí)點(diǎn)
my_array = new Array(); // 使用構(gòu)造函數(shù)來創(chuàng)建一個(gè)數(shù)組。
_root.attachMovie () // 加載 MC 到主場景,本實(shí)例是按索引從數(shù)組中取得 MC 。
補(bǔ)充模糊濾鏡
import flash.filters.BlurFilter;//載入濾鏡類-模糊
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í)例說明
?、?8 個(gè)同樣大小的位圖都轉(zhuǎn)換為 MC ,并在鏈接屬性里作好相關(guān)設(shè)置。
?、诘?1 幀加載 MC 和變量初始化 , 第 2 幀到第 7 幀設(shè)置循環(huán), MC 被依次改變屬性為可見,并用透明度的變化來實(shí)現(xiàn)白和非白之間的畫面轉(zhuǎn)換。
編寫動(dòng)作腳本
①在第 1 幀上輸入:
tu = new Array("a", "b", "c", "d", "e", "f", "g", "h");// 創(chuàng)建一個(gè)數(shù)組,其中的元素是庫中的 MC
for (i=1; i<=8; i++) {
_root.attachMovie(tu[i-1], "h"+i, i);// 將數(shù)組中 MC 加載到主場景的對(duì)象上
with (_root["h"+i]) {// 設(shè)置對(duì)象屬性
_x = 250;
_y = 90;
_visible = false;
}
}
i = 1;
n = 0;
② 在第 2 幀上輸入:
_root["h"+i]._visible = true;
_root["h"+i]._alpha = n*5;// 幀循環(huán)中透明度由 0 到 100 遞加
n++;
③ 在第 3 幀上輸入:
if (n<21) {
gotoAndPlay(2);
}
④ 在第 5 幀上輸入:
_root["h"+i]._alpha = n*5; // 幀循環(huán)中透明度由 100 到 0 遞減
n--;
⑤ 在第 6 幀上輸入:
if (n>0) {
gotoAndPlay(5);
} else {
gotoAndPlay(2);
i++;
if (i>8) {
i = 1;
}
}
要點(diǎn)分析
?、贁?shù)組中的元素就是庫中含有位圖的 MC 元件,共 8 個(gè),數(shù)組元素的索引也是就是序列號(hào)是從 0 開始,這里就是 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),顯示的效果就是圖片由白逐漸變清晰再由清晰變白,然后下一張圖片以同樣過程顯示。
小結(jié)
本講學(xué)習(xí)的內(nèi)容是了解和應(yīng)用了一維數(shù)組,這是數(shù)組使用的初步方法,在今后的學(xué)習(xí)中會(huì)掌握更加復(fù)雜的數(shù)組應(yīng)用,數(shù)組的應(yīng)用是廣泛的,而且有簡潔清晰調(diào)用方便的特點(diǎn) 。幀循環(huán)也是應(yīng)用普遍的方法,這個(gè)實(shí)例有助于我們了解和掌握循環(huán)過程。
課后練習(xí)
修改源文件,使兩個(gè)圖片間的切換是前面的淡出,后面的淡入,中間不出現(xiàn)空白。
提示:在幀循環(huán)過程中不是一個(gè) MC 而是兩 MC 同時(shí)改變狀態(tài),在最后一張圖和第一張圖片之間不出現(xiàn)空白更要專門編寫幀循環(huán)語句。范例效果:
>點(diǎn)擊查看動(dòng)畫效果<練習(xí)2-8
補(bǔ)充模糊效果實(shí)例
在第 2 幀上輸入:
_root["h"+i]._visible = 1;
import flash.filters.*;//載入濾鏡類
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];//簡略寫法,可去掉4-6行
_root["h"+(i+1)]._visible = 1;
_root["h"+(i+1)]._alpha = n*5;
n++;
查看全套"Flash AS 實(shí)例進(jìn)階教程"
相關(guān)文章
flash cs6鼠標(biāo)跟隨效果實(shí)現(xiàn)代碼分享
flash cs6想要實(shí)現(xiàn)鼠標(biāo)跟隨效果?該怎么制作呢?今天我們就來看看使用as2.0實(shí)現(xiàn)鼠標(biāo)跟隨效果的教程,需要的朋友可以參考下2019-05-19- Flash cs6怎么使用代碼輸入中英文文本?Flash cs6中可以使用文字工具直接輸入文本,也可以使用代碼來輸入文本,該怎么使用代碼輸入文本呢?請(qǐng)看下文詳細(xì)的教程,需要的朋友2018-03-11
- flash as3.0抽象類怎么定義? as3.0中有很多抽象類,該怎么定義抽象類和抽象方法呢?下面我們就來看看簡單的例子,需要的朋友可以參考下http://www.dbjr.com.cn/softs/408402.2018-02-28
flash cs6中怎么使用ActionScript3.0?
flash cs6中怎么使用ActionScript3.0?flash cs6中想要使用ActionScript3.0功能,該怎么使用呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-25Flash中怎么實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊決定圖像位置?
本教程給大家分享一個(gè)Flash小教程,教大家在Flash CS6中怎么實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊決定圖像位置?方法很簡單,感興趣的朋友歡迎前來一起分享學(xué)習(xí)2018-01-12Flash中如何用代碼將圖片放在自己想要的舞臺(tái)位置?
本教程教腳本之家的ActionScript教程學(xué)習(xí)者在Flash中如何用代碼將圖片放在自己想要的舞臺(tái)位置,教程講解的詳細(xì),感興趣的朋友歡迎前來分享學(xué)習(xí)2017-11-20在Flash CS6中使用with函數(shù)繪制背景圖教程
本教程教腳本之家的ActionScript教程學(xué)習(xí)者如何在Flash CS6中使用with函數(shù)繪制背景圖?教程一步步講解的挺詳細(xì),方法也不難,非常適合Flash新手入門學(xué)習(xí)2017-11-18Flash怎么設(shè)置元件坐標(biāo)?flash使用代碼設(shè)置元件的坐標(biāo)的教程
Flash怎么設(shè)置元件坐標(biāo)?flash中導(dǎo)如的元件需要添加坐標(biāo),該怎么定位元件坐標(biāo)呢?下面我們就來看看flash使用代碼設(shè)置元件的坐標(biāo)的教程,需要的朋友可以參考下2017-10-11Flash怎么制作來回?fù)u擺的花朵的動(dòng)畫?
Flash怎么制作來回?fù)u擺的花朵的動(dòng)畫?Flash中想要給花朵制作一段搖擺的動(dòng)畫效果,該怎么制作呢?下面我們就來看看詳細(xì)的教程,很簡單,需要的朋友可以參考下2017-05-23- Flash怎么制作流動(dòng)七彩色的文字?想要讓文字動(dòng)起來,該怎么使用flash給文字制作一個(gè)流動(dòng)七彩色的動(dòng)畫呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2017-04-23