張萬(wàn)良
文章編號(hào):1672-5913(2009)06-0084-02
摘 要:Flash的腳本是許多想深入學(xué)習(xí)動(dòng)畫計(jì)者的“攔路虎”,但是我們只要采取適當(dāng)?shù)慕虒W(xué)方法,合理的教學(xué)過(guò)程安排就會(huì)攻克這個(gè)難關(guān)。我們通過(guò)設(shè)計(jì)一個(gè)設(shè)置影片屬性的例子,讓學(xué)生理解腳本的添加,腳本的點(diǎn)語(yǔ)法,影片的常用基本屬性,兩種坐標(biāo)系,并且由淺入深使學(xué)生不再對(duì)腳本畏難。本文通過(guò)案例詳細(xì)論述了如何為按鈕添加腳本的方法。
關(guān)鍵詞:人機(jī)交互;腳本;影片剪輯;按鈕;坐標(biāo)系
中圖分類號(hào):G642
文獻(xiàn)標(biāo)識(shí)碼:B
1引言
計(jì)算機(jī)執(zhí)行的指令集稱為程序,程序的另一個(gè)名字稱叫做腳本。Flash的腳本是許多想深入學(xué)習(xí)Flash游戲設(shè)計(jì)者的“攔路虎”,但是如果我們先易后難、逐步深入就可攻克這個(gè)“堡壘”。只要我們合理科學(xué)的安排教學(xué)過(guò)程中經(jīng)過(guò)實(shí)踐,通過(guò)經(jīng)典實(shí)例由淺入深的講解讓學(xué)生把腳本的輸入方法,語(yǔ)法規(guī)范,簡(jiǎn)單腳本的含義以及最重要的坐標(biāo)系搞清楚。
腳本也叫ActionScript,是Flash內(nèi)置的編程語(yǔ)言,用它為動(dòng)畫編程,可以實(shí)現(xiàn)各種動(dòng)畫特效、對(duì)影片的良好控制、強(qiáng)大的人機(jī)交互以及與網(wǎng)絡(luò)服務(wù)器的交互。ActionScript是一門吸收了C++、Java以及JavaScript等編程語(yǔ)言部分特點(diǎn)的新的語(yǔ)言。它的存在確保了Flash影片較之普通的按照線性模式播放的動(dòng)畫具備強(qiáng)大得多的人機(jī)交互能力。
2案例分析
在ActionScript中可以添加動(dòng)作的對(duì)象有三種:關(guān)鍵幀、影片剪輯元件、按鈕元件。選中這些關(guān)鍵幀、按鈕和影片剪輯,打開(kāi)其動(dòng)作面板,你就可以看到它們都添加了哪些腳本。
下面就是我們精心設(shè)計(jì)的初級(jí)腳本案例,通過(guò)本實(shí)例我們知道如何為按鈕添加腳本,了解影片的屬性,了解點(diǎn)語(yǔ)法,了解坐標(biāo)系:
(1) 首先創(chuàng)建元件
步驟一、創(chuàng)建按鈕元件
創(chuàng)建圓角按鈕元件,為了增加立體感,按鈕共有兩個(gè)圖層。只不過(guò)一個(gè)圖層的顏色亮一個(gè)圖層的顏色暗作為陰影。
步驟二、創(chuàng)建影片元件
按ctrl+R導(dǎo)入gif格式的動(dòng)畫圖形到庫(kù)中,按F8創(chuàng)建影片元件,把剛才導(dǎo)入的圖形拖入到影片元件編輯區(qū),最后將影片元件拖入舞臺(tái)實(shí)例名為tt。坐標(biāo)為(500,350)。注意影片元件的中心注冊(cè)點(diǎn)為于左上角。
(2) 然后創(chuàng)建動(dòng)畫
步驟一、動(dòng)畫元素的布置
在舞臺(tái)寫上“影片屬性演示”幾個(gè)字,然后按兩次ctrl+B打散文字,再使用鉛筆工具將文字分成兩部分,分別填上不同的顏色作為裝飾,最后刪掉線條。新建一圖層命名為“按鈕”,并拖入13個(gè)按鈕元件,使用文本工具分別寫上如效果圖所示的文字。
步驟二、編寫腳本
選中“x position=400”的按鈕,添加腳本on (press) {tt._ x=400;}//設(shè)置影片的x坐標(biāo)為400。
選中“y position=150”按鈕,添加on (press) {tt._y= 150;}//設(shè)置影片的y坐標(biāo)為150。
選中“x scale=50”按鈕,添加on (press) {tt._ xscale= 50;}//設(shè)置影片的橫向縮為原來(lái)的50%
選中“y scale=50”按鈕,添加on (press) {tt._ yscale= 50;}// 設(shè)置影片的縱向縮為原來(lái)的50%
選中“alpha=50” 按鈕,添加on (press) {tt._alpha=50;}// 設(shè)置影片的透明度為50%
選中“rotation-30”按鈕,添加on (press) {tt._ rotation-= 30;}// 設(shè)置影片每次逆時(shí)針旋轉(zhuǎn)30度
選中“rotation+30”按鈕,添加on (press) {tt._ rotation+= 30;}// 設(shè)置影片每次順時(shí)針旋轉(zhuǎn)30度
選中“visible=1”按鈕,添加on (press) {tt._visible=1;} // 設(shè)置影片可見(jiàn)。
選中“visible=0” 按鈕,添加on (press) {tt._visible=0;} // 設(shè)置影片不可見(jiàn)。
選中“draggable lock(100,100,400,400)”按鈕,添加on (press){tt.startDrag(true,100,100,400,400)}//可拖動(dòng)的影片鎖定到鼠標(biāo)位置中央,范圍在左上右下的坐標(biāo)值分別為100、100、400、400。
選中“stop drag”按鈕,添加on (press) {tt.stopDrag();}//停止拖動(dòng)影片。
選中“復(fù)位”按鈕,添加on (press) {
tt.stopDrag();//停止拖動(dòng)影片。
tt._x=500;//恢復(fù)初始橫坐標(biāo)
tt._y=350;//恢復(fù)初始縱坐標(biāo)
tt._rotation=0;//恢復(fù)旋轉(zhuǎn)角度
tt._xscale=100;//恢復(fù)初始的x向放大系數(shù)
tt._yscale=100;//恢復(fù)初始的y向放大系數(shù)
tt._alpha=100;//恢復(fù)初始透明度
tt._visible=1;//恢復(fù)影片為可見(jiàn)
}最終效果如圖1所示:
我們通過(guò)實(shí)例可很好的區(qū)別以下幾個(gè)概念:
(1) 幀動(dòng)作和對(duì)象動(dòng)作
幀動(dòng)作是指在關(guān)鍵幀上才能添加的動(dòng)作腳本。有腳本的關(guān)鍵幀上有字母“a”標(biāo)識(shí),如圖2所示。方法是選中要添加腳本的關(guān)鍵幀,打開(kāi)動(dòng)作面板在腳本編輯區(qū)添加。
對(duì)象動(dòng)作即可以給按鈕和影片添加動(dòng)作,必須首先選中對(duì)象,它不會(huì)在時(shí)間軸上出現(xiàn)“a”標(biāo)記。On()函數(shù)是處理按鈕對(duì)象產(chǎn)生的事件的。而onClipEvent()是處理影片剪輯對(duì)象引起的事件的。
(2) 兩種坐標(biāo)系統(tǒng)
在進(jìn)行的Flash游戲開(kāi)發(fā)的時(shí)候,很多時(shí)候都用了Flash的坐標(biāo)系統(tǒng),例如拼圖游戲也都用到了Flash的坐標(biāo)系統(tǒng),這對(duì)于了解Flash很重要。Flash中的主場(chǎng)景坐標(biāo)系統(tǒng)與影片剪輯元件的坐標(biāo)系統(tǒng)的中心原點(diǎn)不相同。
a. 主場(chǎng)景坐標(biāo)系統(tǒng)中心原點(diǎn)是舞臺(tái)工作區(qū)的左上角,y軸向下是增大 x向右是增大如圖3所示。
b. 影片剪輯元件的坐標(biāo)系統(tǒng)原點(diǎn)如圖所示,它是以影片剪輯元件的中心十字為原點(diǎn)的。y軸向下是增大 x向右是增大如圖4所示。
(3) 點(diǎn)語(yǔ)法
點(diǎn)語(yǔ)法是很多面向?qū)ο蟮木幊陶Z(yǔ)言中用來(lái)組織對(duì)象和函數(shù)的方法。
假設(shè)你想求一個(gè)數(shù)的絕對(duì)值,F(xiàn)lash中有一個(gè)內(nèi)置的絕對(duì)值函數(shù),它包含在ActionScript的“對(duì)象”/“核心”/“Math”/“方法”中。要使用絕對(duì)值函數(shù),首先要使用對(duì)象名,即Math,然后是方法名abs,它們之間用符號(hào)“.”隔開(kāi),具體表示方法如下所示:
var a = Math.abs(-7);
點(diǎn)語(yǔ)法的另一個(gè)用途是指定影片剪輯的屬性。如上面將影片剪輯tt的_alpha(透明度)屬性設(shè)置為50%:
tt._alpha = 50; 如上例腳本中我們就使用點(diǎn)語(yǔ)法。
另外還可以使用語(yǔ)句setProperty(tt,_x,500)設(shè)置影片屬性,其語(yǔ)法格式:
setProperty(target,property,value/expression) 其中
target 到要設(shè)置其屬性的影片剪輯實(shí)例名稱的路徑。
property 要設(shè)置的屬性。
value 屬性的新文本值。
expression 計(jì)算結(jié)果為屬性新值的公式。
3結(jié)語(yǔ)
通過(guò)以上設(shè)置影片屬性的案例分析,我們介紹了如何為按鈕添加腳本,并且用一種由淺入深的方法讓學(xué)生理解了腳本的添加,腳本的點(diǎn)語(yǔ)法,影片的常用基本屬性,兩種坐標(biāo)系的概念和方法。這樣的案例分析教學(xué)以易到難,讓學(xué)生更容易接受,對(duì)知識(shí)的理解可以更好。
參考文獻(xiàn):
[1] 繆亮,凌忠康. 巧奪天工——Flash MX 2004入門與進(jìn)階實(shí)例[M]. 北京:洪恩教育科技有限公司.
[2] Flash新手入門教程[EB/OL]. http://www.jcwcn.com/article/2008/1008/flash_31180.html.