如何用ActionScript3.0代碼實現(xiàn)完美飄雪場景

摘要：ActionScript3.0可以有效的提高以FlashPlayer為目標(biāo)的內(nèi)容和應(yīng)用程序的開發(fā)效率。通過圖層設(shè)計、界面設(shè)計以及ActionScript代碼設(shè)計三個方面，介紹了應(yīng)用ActionScript3.0事件處理機制實現(xiàn)飄雪場景的制作方法。同時，該方法也適用于其他常用場景的制作。

關(guān)鍵詞：ActionScript3.0；飄雪；事件偵聽；事件處理

中圖分類號：TP311 文獻標(biāo)識碼：A 文章編號：1009-3044（2012）33-7922-03

ActionScript是一種基于Flash、Flex等多種開發(fā)環(huán)境、面向?qū)ο缶幊痰哪_本語言。其主要用于Flash動畫控制、為Flash影片添加各種特效、實現(xiàn)復(fù)雜動畫、交互動畫以及開發(fā)各種富網(wǎng)絡(luò)應(yīng)用的動畫程序等[1]。隨著FlashCS3的發(fā)布，ActionScript3.0（以下簡稱AS3）橫空出世了。AS3的推出使腳本語言的發(fā)展上升到一個新的高度。隨著腳本語言的日趨成熟，AS3已經(jīng)在Web、視頻、音樂等多個領(lǐng)域得到了廣泛應(yīng)用，但對于很多習(xí)慣了ActionScript1.0和2.0的開發(fā)人員在面對AS3的巨大變化的同時又覺得不知所措[2]，下面針對如何應(yīng)用AS3中強大的事件處理機制來實現(xiàn)完美飄雪場景的制作方法進行介紹。

1設(shè)計的基本思想

時間軸也叫時間線，是一條貫穿時間的軸，用于表示對象在不同時間存在的不同狀態(tài)，利用時間軸可以創(chuàng)建各種動畫效果。飄雪場景設(shè)計的基本思想是在Flash時間軸上設(shè)定三圖層，分別放置三個關(guān)鍵幀。第一個圖層的關(guān)鍵幀用來放背景圖片，第二個圖層關(guān)鍵幀用來放文字動畫，第三個圖層的關(guān)鍵幀用來放置AS3代碼，用代碼來實現(xiàn)漫天雪花飄落的場景。下面將分別從圖層設(shè)計、界面設(shè)計以及ActionScript代碼設(shè)計三方面加以說明[3]。

2圖層設(shè)計及影片剪輯元件的制作

2.1圖層設(shè)計

圖層就像是含有文字和圖形等元素的膠片，一張張按順序疊放在一起，組合起來形成頁面的最終效果。圖層有兩大特點，一是除了畫有圖形或文字的地方，其他部分都是透明的，二是圖層又是相對獨立的，修改其中一層，不會影響到其他層[3]。該文把圖層分為Bj、Wz和As等3個基本層，其中前面2個層用于顯示。各個層的功能如表1所示。

表1 各圖層的功能

[圖層名稱＼&放置對象＼&作用＼&Bj＼&背景圖片＼&用于放置飄雪場景的背景圖片＼&Wz＼&文字的影片剪輯元件＼&用于放置體現(xiàn)場景的文字動畫＼&As＼&AS3代碼＼&用代碼生成漫天飄落的雪花＼&]

在FlashCS4開發(fā)環(huán)境中按順序添加各個圖層（如圖1所示）。

2.2影片剪輯元件的制作

1）制作雪花的影片剪輯元件“雪花”。

2）制作飄雪的影片剪輯元件“Px”，里面包含一個引導(dǎo)路徑動畫，讓“雪花”影片剪輯元件生成的實體從上至下沿曲線飄落。在該元件屬性對話框中設(shè)置“Px”元件的鏈接屬性，生成“Px”元件類。

3）制作含有文字動畫的影片剪輯元件“Wz”。

3界面設(shè)計

1）設(shè)置Flash文檔大小為背景圖片大小，也可調(diào)整圖片大小來匹配文檔大小。

2）導(dǎo)入背景圖片，在Bj圖層的關(guān)鍵幀上放置背景圖片。

3）在Wz圖層的關(guān)鍵幀上放置“Wz”影片剪輯元件的實例，并將其放在場景的合適位置。

效果如圖2所示。

圖2 界面效果圖

4代碼編寫

4.1代碼設(shè)計思路

1）利用計時器事件偵聽或進入幀事件偵聽的特點來實現(xiàn)飄雪場景，即每間隔一定的時間就會自動執(zhí)行事件處理函數(shù)來生成一個飄動的雪花，經(jīng)過一段時間就會生成多個飄動的雪花。計時器事件偵聽執(zhí)行事件處理函數(shù)的間隔時間取決于計時器對象延時時間的設(shè)置，而進入幀事件偵聽取決于flash軟件中的幀頻率（可調(diào)）的設(shè)置[4]。

2）在事件處理函數(shù)中，用代碼生成Px元件類的飄動雪花的實例，并加載到舞臺上。通過隨機函數(shù)生成要求范圍的隨機數(shù)來控制該實例的坐標(biāo)及大小。x坐標(biāo)范圍應(yīng)該≤場景的寬度，y坐標(biāo)的范圍應(yīng)該控制在場景的上半部分。

3）為了避免場景中無限制的產(chǎn)生雪花，要設(shè)置場景中雪花的最大值，用if語句進行判斷，當(dāng)雪花個數(shù)增加到最大值時，采用每增加1個雪花，就刪除最底層（即最開始建立）雪花的方法，即用增1個，刪1個的方法來達到場景內(nèi)雪花數(shù)的動態(tài)平衡，從而達到連續(xù)不斷而又不會無限增加的逼真飄雪效果。

4.2代碼的實現(xiàn)

在AS圖層第一幀打開“動作”窗口，輸入動作腳本。

用進入幀事件偵聽實現(xiàn)飄雪場景代碼如下：

需要注意的是，在刪除最下層雪花時，背景圖占用了第0層，文字動畫占用了第1層，所以最早產(chǎn)生的雪花在第2層，代碼體現(xiàn)為this.removeChildAt（2）。

如用計時器偵聽來實現(xiàn)飄雪場景，代碼只需稍作改動。

1）首先應(yīng)定義計時器類型的變量，延時時間為500ms即0.5秒，代碼如下：

varjs：Timer=newTimer（500）；

2）將以上代碼的第3行對舞臺加進入幀事件的偵聽語句改為對計時器變量加計時器事件的偵聽。

即將“stage.addEventListener（Event.ENTER_FRAME，hs）；”改為：

js.addEventListener（TimerEvent.TIMER，hs）；

3）在代碼的結(jié)尾添加啟動計時器的語句：

js.start（）；

5結(jié)束語

以上方法具有通用性，用相同的方法還能夠?qū)崿F(xiàn)飄花、落葉、下雨、滿天繁星等常用動畫場景的制作。通過圖層、幀和AS3代碼的有機結(jié)合來實現(xiàn)復(fù)雜動畫，能夠有效的提高動畫制作的效率和逼真的程度。

參考文獻：

[1]孫穎.FlashAction3殿堂之路[M].北京：電子工業(yè)出版社，2007.

[2]皮特斯.FlashActionScript3.0動畫教程[M].王汝義，譯.北京：人民郵電出版社，2008.

[3]徐浙君，俞淑燕.基于ActionScript3.0的游戲設(shè)計框架探索[J].計算機與現(xiàn)代化，2010（3）：84-86.

[4]ToddPerkins.FlashActionScript3.0實訓(xùn)課堂[M].張猛，譯.北京：人民郵電出版社，2008：62-9.