本文詳細(xì)介紹了用Adobe Flash Professional CS5.5腳本設(shè)計(jì)圖片切換效果的技術(shù)和步驟,并附上腳本詳細(xì)代碼,對(duì)網(wǎng)站動(dòng)畫設(shè)計(jì)和多媒體課件制作都具有一定的指導(dǎo)作用。
引言
Flash是一種交互式矢量多媒體技術(shù),目前互聯(lián)網(wǎng)上已經(jīng)有成千上萬個(gè)純Flash站點(diǎn),而且其他普通站點(diǎn),包括很多wap站點(diǎn),也都用到了flash技術(shù),可以說Flash已漸漸成為交互式矢量的標(biāo)準(zhǔn),未來網(wǎng)頁的一大主流。在用Flash展示產(chǎn)品、風(fēng)景、新聞等圖片時(shí),其切換效果可用遮罩和AS兩種途徑來實(shí)現(xiàn),其中遮罩方式簡(jiǎn)單易學(xué),但效果比較單調(diào),修改不方便;AS方式效果豐富,適合對(duì)圖片批處理,更改圖片及效果也極為方便,是制作切換效果的首選。
2.圖片處理
2.1 圖片存放
首先準(zhǔn)備若干張jpg或gif圖片,本文設(shè)計(jì)的是10張600*400的jpg圖片(可以用“光影魔術(shù)手”軟件進(jìn)行批處理),文件名分別為:
1.jpg,2.jpg,…,8.jpg,存放在與。fla文件相同目錄下(如圖1),然后通過AS腳本,創(chuàng)建空的影片剪輯和加載外部圖片。
2.2 圖片加載
用數(shù)組方式批量添加,用MovieClip類的createEmptyMovieClip()和loadMovie()方法創(chuàng)建空影片剪輯實(shí)例和將圖片加載到實(shí)例中,因?yàn)閳D片多,用循環(huán)方式依次加載,同時(shí)也方便使后加入的深度依次增大而位于上層,具體如:
這樣就在舞臺(tái)上層疊了8個(gè)影片剪輯。
2.3 圖片布局
外部圖片導(dǎo)入到舞臺(tái)以后,位置和大小不一定與舞臺(tái)相匹配,須作調(diào)整。本程序中,舞臺(tái)大小設(shè)置為800*600,圖片大小在導(dǎo)入之前已統(tǒng)一設(shè)置為600*400,完全能被裝下,如果圖片大于舞臺(tái),可通過_xscale和_yscale屬性來縮小。代碼如下:
3.圖片切換
因?yàn)?張圖片大小完全相同,后載入的覆蓋了先載入的,這時(shí)只能看到最上面的一張,所以還必須在兩張圖片之間設(shè)置時(shí)間和過渡效果,才能看到前后圖像載入變化。
flash AS提供了10種效果:Blinds(遮罩效果)、Fade(淡化效果)、Fly(飛行效果)、IRis(光圈效果)、Photo(聚變曝光效果)、PixelDissolve(像素溶解效果)、Rotate(旋轉(zhuǎn)效果)、Squeeze(擠壓效果)、Wipe(劃入/劃出效果)、Zoom(縮放效果),每種效果中又有很多種形式,統(tǒng)計(jì)起來共有27種之多。這些效果的實(shí)現(xiàn)主要是通過TransitionManager類來完成的。要實(shí)現(xiàn)過渡效果,為編寫代碼更為方便,首先需要導(dǎo)入所有mx.transitions類和所有mx.transitions.easing類:
import mx.transitions.*;
import mx.transitions.easing.*;
在導(dǎo)入上面兩個(gè)類以后,就可以使用TransitionManager類的start()方法將過渡效果應(yīng)用于影片剪輯上。
格式:
TransitionManager.start(影片剪輯名稱,{type:過渡類型,direction:方向,duration:過渡所所需的時(shí)間,easing:緩動(dòng)效果,各種過渡效果所需的參數(shù)});start()方法參數(shù)的說明:
影片剪輯名稱:就是要應(yīng)用過渡效果的MC的實(shí)例名稱,即前面用createEmptyMovieClip(“mc”+String(i+1),i+1)創(chuàng)建的mc1、mc2……mc8.
Type:過渡類型,前面已提到共有10種過渡效果,如:Blinds、Fade、Fly、Iris、Photo等。
Direction:方向,即過渡是進(jìn)入還是退出。可以用兩個(gè)值:Transition.IN和Transition.
OUTDuration:過渡所所需的時(shí)間,一般一個(gè)過渡幾秒就夠了,常用3-5秒。
easing:緩動(dòng)效果:在過渡效果中可以為過渡效果添加緩動(dòng)效果。
startPoint:一個(gè)指示起始位置的整數(shù),范圍是1到9.1:左上;2:上中;3:右上;4:左中;5:中心;6:右中;7:左下;8: 下中;9:右下。
某些效果還有自己特有的參數(shù),如:遮罩條紋數(shù):numStrips和條紋方向:dimension,遮罩形狀Shape:.Iris.SQUARE(方形)和CIRCLE(圓形)等4.效果實(shí)現(xiàn)
為了將圖片各種隨機(jī)切換效果連續(xù)地展示出來,可以使用setInterval()方法,setInterval()方法可以按照指定的周期來調(diào)用函數(shù)(在本程序中是調(diào)用圖片自動(dòng)切換的函數(shù):showImages()),直到窗口關(guān)閉,代碼如下:
5.程序設(shè)計(jì)與調(diào)試
在理解上述思路的基礎(chǔ)上就可在Flash窗口開始編寫程序代碼和調(diào)試了。
啟動(dòng)Adobe Flash Professional CS5.5,在圖層1的第一幀處(如圖2所示)按F9鍵,打開動(dòng)作窗口,在動(dòng)作窗口中輸入附錄中所示代碼。另特別注意,在發(fā)布之前,務(wù)必通過“文件-發(fā)布設(shè)置”將腳本修改為Action-Script2.0,否則在發(fā)布時(shí)會(huì)報(bào)錯(cuò)。
按上述步驟完成后,即可按Ctrl+Enter測(cè)試影片。
7.結(jié)語
本文介紹了用Adobe Flash Professional CS5.5腳本設(shè)計(jì)圖片切換效果的技術(shù),用Flash制作的炫目的圖片自動(dòng)切換效果,在Flash中圖片切換一般有兩種途徑:遮罩和AS腳本,相比較而言,用AS腳本不論在圖片批量處理上還是后期維護(hù)更新上都有顯著優(yōu)勢(shì),對(duì)網(wǎng)站動(dòng)畫設(shè)計(jì)和多媒體課件制作都具有一定的指導(dǎo)作用。
-
FlaSh
+關(guān)注
關(guān)注
10文章
1623瀏覽量
147787 -
軟件
+關(guān)注
關(guān)注
69文章
4799瀏覽量
87178 -
矢量
+關(guān)注
關(guān)注
0文章
95瀏覽量
23738
發(fā)布評(píng)論請(qǐng)先 登錄
相關(guān)推薦
評(píng)論