Flash MX2004入門與進階實例——元件和實例(22)_Flash教程

制作步驟

我們先看看7個按鈕的外形，其實，7個人物不是按鈕，他們與畫面上的其它裝飾圖形一樣，僅是個背景圖，我們用的是7個“透明按鈕”！

“透明按鈕”可以用幾種方法做，最先想到的當然是用【屬性】面板在按鈕的【顏色】設置中把【Alpha】值填為“0”，但這樣一來，按鈕內部的動畫也看不到了，我們只能在按鈕內部想辦法。

現在我們用第4個按鈕為例來介紹透明按鈕的制作方法。

步驟1　創建按鈕元件

新建名為“but_4”的按鈕元件，在這個元件的編輯場景中，將【圖層1】重新命名為“圖形”，在舞臺十字中心位置繪一個白色矩形，并轉換為名為“按鈕板”圖形元件，把它的【Alpha】值置為“0”即可。這里順便說一下，按鈕的“響應區”也用了這個元件，是為了簡便，假如你把“響應區”畫成與背景人物一樣的圖形，那么鼠標移向按鈕時的感覺更精確。

回到【場景1】場景，新建“按鈕”圖層，將“but_4”拖放到舞臺上的第4個人上，如圖4-5-7所示。

圖4-5-7 “but_4”按鈕的制作

步驟2　創建按鈕中的MC元件

按鈕中MC的動畫過程是通過一個名字叫“線條4”的MC元件實現的。如圖4-5-8是這個MC的圖層結構。整個的動畫效果就是當鼠標移動到第4個按鈕時，從【Layer1】到【Layer4】4段線條的“運動變形”過程，【Layer5】是小球“閃爍3下”效果。

為了線條指向的準確性，我們在場景中來創建MC。雙擊“but_4”實例，再回到“but_4”按鈕編輯環境中，插入一個新圖層并重新命名為“MC”。

在【指針經過】幀插入要害幀，將“豎線”圖形元件拖放到適當位置，并轉換為“線條4”影片剪輯元件。雙擊該實例，進入到“線條4”編輯環境中進行MC的編輯。如圖4-5-8是“線條4”完成后的圖層結構，具體的制作情況請參閱源文件。

圖4-5-8　“線條4”MC的圖層結構

說明：“線條4”MC中的線條伸展動畫是通過多圖層的動作補間動畫來實現的。動畫技巧并不復雜，只是圖層繁瑣了一些。另外，這個MC時間軸最后一幀要定義一個停止動作，以保證這個MC不會重復播放。

注重，在編輯MC時，編輯界面上找到它不輕易，因為它的第一幀只是一根幾乎看不到的豎線！請你按照下面的方法進行操作：

現在讓我們單擊【MC】圖層的第二幀，以選中MC對象。這時，編輯界面出現2個“中心點”（或者叫“注冊點”），1個是整個按鈕對象的“中心點”（上一級對象），還有一個就是MC對象的“中心點”！慢慢用鼠標靠近它，當鼠標到達“中心點標志”時，鼠標指針的“剪頭”會變成“移動”符號，如圖4-5-9所示。

這時再“雙擊”它，就打開了MC的編輯界面。

圖4-5-9 尋找“看不見”的對象

步驟3　定義按鈕腳本

單擊【場景 1】回到主場景，保持該按鈕被選中，打開【動作】面板，鍵入一條按鈕指令：

on (release) {

gotoAndPlay("Scene 2", 1);

}

指令意義是：當單擊并放開時，“進入第二場景的第1幀繼續播放”。至此，這個按鈕對象全部完成！

步驟4　完成其它透明按鈕的制作

其余6個按鈕外形、內部結構完全一樣，僅是按鈕指令及內部MC的線條走向不同，是不是接下去一個一個地做？

當然不會傻到這般地步！那么，把“but_4”拷貝6份，分別放置在其余人物圖形上，然后進入內部調整MC線條走向，不就得啦！

又錯啦！這樣的結果是你調整一個，其它按鈕隨之同步改變，如同狗熊偷苞米的故事，勞累一場一無所獲！

還記得前面說過的，正確的做法應該在元件【庫】中進行“元件復制”，并把它們的元件名分別命名為“but_1”、“but_2”、“but_3”……等，然后把它們的實例分別布置在其他各個人物圖形上，再分別調整各自MC中的線條走向。

豈慢，按鈕里面的MC也得在元件【庫】中復制6份哦，否則……，這個道理現在你應該明白嘍！