這個(gè)變化多姿的動(dòng)畫是由單線條動(dòng)畫做成的。它利用了Flash的形變、移動(dòng)動(dòng)畫原理及FOR循環(huán)、復(fù)制電影剪輯 duplicateMovieClip() 、旋轉(zhuǎn)電影(rotation())等行為做成的。(本例子較適合具有一定FLASH 動(dòng)畫制作、行為動(dòng)畫基礎(chǔ)的人學(xué)習(xí),如是新手,則要多花一點(diǎn)時(shí)間,但沒(méi)有關(guān)系,有誰(shuí)一出生就是閃客呢?
心動(dòng)不如行動(dòng),一起來(lái)動(dòng)動(dòng)手吧!本例子分為如下三大步:
一、線的變形: 利用FLASH的形變動(dòng)畫原理。
二、線的變色:利用FLASH的移動(dòng)動(dòng)畫原理。
三、設(shè)置行為: 利用FOR循環(huán)、復(fù)制電影剪輯 duplicateMovieClip() 、旋轉(zhuǎn)電影(rotation())等原理。
*步:線的變形
啟動(dòng)FLASH MX,新建文件,按CTRL+M,將電影屬性設(shè)為:(如左下圖)
然后,CTRL+F8,新建電影剪輯,取名為line1,點(diǎn)OK進(jìn)入電影的編輯狀態(tài),右擊工作區(qū),調(diào)出網(wǎng)格,并以電影的中心為中點(diǎn),畫一跟粗細(xì)為3(選中直線工具,在屬性面板上修改),選中直線,按CTRL+T打開(kāi)對(duì)象轉(zhuǎn)換面板,輸入45,并回車確認(rèn)轉(zhuǎn)換,如上右圖。
接著,在工作區(qū)上(除直線外的任何位置)單擊取消對(duì)直線的工具,將鼠標(biāo)放到直線旁,變成弧形時(shí),按住左鍵往左下角拖如左下圖,在20、40幀按F6插入關(guān)鍵幀,并選中20幀上的對(duì)象,將向下彎的弧線向上拖,如右下圖:
*,分別選中第1、20幀,在下方屬性面板的動(dòng)畫類型中選shape,做形狀動(dòng)畫,至此,*大步已做完了。
第二步:線的變色
CTRL+F8新建電影,取名為line2,點(diǎn)OK進(jìn)入,按CTRL+L打開(kāi)庫(kù)面板(在FLASH 5.0中可左下角書的圖標(biāo),在FLASH MX打著燈籠也找不到,就記這個(gè)快捷鍵吧?。ine1拖出并對(duì)齊中心,在20、40幀處F6,分別將三幀上的對(duì)象的顏色改為紅、綠、藍(lán),每一種濃度改為*,并把20幀上的對(duì)象用變形工具拉大一點(diǎn)。注意:改色時(shí)一定要單擊工作區(qū)上的弧線,才會(huì)出現(xiàn)屬性面板的color選項(xiàng)。
分別右擊第1、20幀,選Creat Motion Tween創(chuàng)建移動(dòng)動(dòng)畫,回到場(chǎng)景
第三步,最為關(guān)鍵的一步就是設(shè)行為了:
從庫(kù)面板中拖出line2并選中它,在屬性面板中輸入line
在Flash 5.0里是雙擊需要設(shè)行為的幀,而在flash MX中則直接選要設(shè)行為的幀,并打開(kāi)屬性面板上的Actions面板或右擊要設(shè)行為的幀選Actions,也可打開(kāi),這樣做就多了一步,一般不用這種方法(至少我不喜歡用)。點(diǎn)“+”號(hào)增加行為(在Flash MX中,其行為已分類存放,如用慣了flash 5.0的則要耐心一點(diǎn)去找它)
A、在行為面板上點(diǎn)“+”號(hào),依次選擇Actions-->conditions/loops-->for增加For 循環(huán)句如右上圖
B、在行為面板上點(diǎn)“+”號(hào),依次選擇Actions-->Variables--->Set Variables在彈出對(duì)話框中的Variables框中輸入linenew,定義一個(gè)新變量,供后面復(fù)制電影之用,在下面變量的值中輸入"line" add i將line疊加起來(lái),形成line1,line2,line3……,因?yàn)閘inenew="line" add i是賦值表達(dá)式,所以把該框后的表達(dá)式的框選上
C、在行為面板上點(diǎn)“+”號(hào),依次選擇Actions-->Movie Clip Control---> duplicateMovieClip如左下圖
D、在行為面板上點(diǎn)“+”號(hào),依次選擇Actions-->Movie Clip Control---> SetProperty如左上圖,下面是所設(shè)行為代碼:
for (i=1; i<100; i++) {
linenew = "line" add i;
duplicateMovieClip("line", linenew, i);
setProperty(linenew, _rotation, 6*i);
}
另:Setproperty是設(shè)置電影屬性的意思,它可以設(shè)置電影的大小、透明、橫、樅坐標(biāo)值、旋轉(zhuǎn)等屬性,在flash 行為中起著很大的作用。本例中的一些值,讀者可自行更改調(diào)試
*便大功告成了,按Ctrl+Enter看看效果,如把背景改成黑色,視覺(jué)將更好,但是要把它放到有背景圖的網(wǎng)頁(yè),可就效果不好了,如同貼在那里一樣,那又怎樣將其背景設(shè)為透明呢?是這樣設(shè)的:
保存并導(dǎo)出flash文件(為swf格式),啟動(dòng)Dreamweaver,插入flash并選中,在屬性面板中點(diǎn)參數(shù),前面輸入wmode(窗口模式),后面的值輸入transparent透明,點(diǎn)ok,按F12看看效果吧!.fla文件下載