Flash按鈕制作與應(yīng)用(一)

Flash按鈕制作與應(yīng)用復(fù)習(xí)&提高用戶名：0000Flash按鈕基礎(chǔ)知識按鈕的介紹1.按鈕簡介按鈕是人機進行信息交互的基礎(chǔ)，它對鼠標(biāo)單擊事件進行響應(yīng)。按鈕可對按鈕靜止、將鼠標(biāo)指針移到按鈕上、按下鼠標(biāo)左鍵3種事件作出響應(yīng)。這3種事件對應(yīng)著按鈕的4種狀態(tài)：彈起(按鈕靜止)、指針經(jīng)過(將鼠標(biāo)指針移動到按鈕上)、按下(按下按鈕)、點擊(定義按鈕響應(yīng)區(qū)域)。這4種狀態(tài)定義了按鈕的4個關(guān)鍵幀。下面詳細(xì)介紹按鈕的這4種關(guān)鍵幀。(1)【彈起】幀：在【彈起】幀中定義按鈕的正常顯示效果，也就是按鈕未被鼠標(biāo)單擊時所顯示的效果。(2)【指針經(jīng)過】幀：定義當(dāng)鼠標(biāo)指針移到按鈕上但不單擊它時按鈕的效果。一般該幀相對于【彈起】幀應(yīng)有所改變。比如：可以定義當(dāng)鼠標(biāo)指針移到按鈕上時按鈕變色或放大、縮小等，對于文字按鈕，可以定義當(dāng)鼠標(biāo)指針移到按鈕上時文字變色或改變文字的字體等。(3)【按下】幀：定義按鈕時按下所出現(xiàn)的效果。對于圖形按鈕來說，按鈕被按下時一般會定義得比未被按下時要小一些，這樣，當(dāng)按下按鈕時，按鈕會自動縮小，出現(xiàn)動態(tài)效果。(4)【點擊】幀：定義按鈕的響應(yīng)區(qū)域。在響應(yīng)區(qū)域按下按鈕時，系統(tǒng)才能響應(yīng)按鈕按下的事件。該區(qū)域在工作區(qū)中是不可見的。如要定義該幀，必須保證此區(qū)域包括按鈕的彈起、指針經(jīng)過和按下3種狀態(tài)的區(qū)域；如不定義該幀，則系統(tǒng)會默認(rèn)【彈起】幀狀態(tài)為按鈕的區(qū)域響應(yīng)。按鈕基礎(chǔ)知識注意：按鈕雖然有4種狀態(tài)，但可根據(jù)需要定義這4種幀狀態(tài)，也可只定義一部分，但一些基本的幀必須定義，一般而言，【彈起】幀和【指針經(jīng)過】幀必須定義。2.按鈕的創(chuàng)建(1)創(chuàng)建圖形按鈕的步驟如下。①選擇[插入]→[新建元件]命令，彈出【創(chuàng)建新元件】對話框，按如圖5.1所示設(shè)置。圖5.1②單擊[確定]按鈕進入按鈕編輯區(qū)，時間軸中將出現(xiàn)按鈕的4個狀態(tài)幀，如圖5.2所示。圖5.2按鈕基礎(chǔ)知識③定義按鈕的4個幀。在按鈕中可以使用影片剪輯元件、圖形元件或素材庫中的組件對象。在這里我們利用繪圖工具繪制按鈕的4個幀。定義【彈起】幀：利用前面所學(xué)知識在工作區(qū)域中繪制如圖5.3所示的圖形。定義【指針經(jīng)過】幀：用鼠標(biāo)在【指針經(jīng)過】幀處插入一個關(guān)鍵幀，此時【彈起】幀的圖形被復(fù)制到【指針經(jīng)過】幀的工作區(qū)。確保圖形被選中，在混色器面板中進行色彩調(diào)整，得到如圖5.4所示的圖形。定義【按下】幀：用鼠標(biāo)在【按下】幀處插入一個關(guān)鍵幀，此時【指針經(jīng)過】幀幀的圖形被復(fù)制到“按下”的工作區(qū)。確保圖形被選中，在混色器面板中進行色彩調(diào)整，得到如圖5.5所示的圖形。定義【點擊】幀：用鼠標(biāo)在【點擊】幀處插入一個關(guān)鍵幀，并進行大小的調(diào)整，得到如圖5.6所示的圖形。該幀主要是定義按鈕的有效單擊范圍，在有效范圍里按下按鈕時，系統(tǒng)才認(rèn)為該事件已經(jīng)發(fā)生。如果不定義該幀，則系統(tǒng)默認(rèn)“彈起”幀為響應(yīng)區(qū)域。圖5.3圖5.4圖5.5圖5.6按鈕基礎(chǔ)知識④單擊圖層左上角的[場景1]按鈕，返回場景，按鈕制作完畢。(2)創(chuàng)建文字按鈕的步驟如下。①選擇[插入]→[新建元件]命令，彈出【創(chuàng)建新元件】對話框，設(shè)置如圖5.7所示。圖5.7②單擊[確定]按鈕進入按鈕編輯區(qū)，時間軸中將出現(xiàn)按鈕的4個狀態(tài)幀，如圖5.8所示。圖5.8按鈕基礎(chǔ)知識③定義按鈕的4個幀。在按鈕中可以使用影片剪輯元件、圖形元件或素材庫中的組件對象。在這里我們利用繪圖工具繪制按鈕的4個幀。定義【彈起】幀：利用文字工具和前面所學(xué)知識在工作區(qū)域中輸入如圖5.9所示的圖形。定義【指針經(jīng)過】幀：用鼠標(biāo)在“指針經(jīng)過”幀處插入一個關(guān)鍵幀，此時【彈起】幀的文字被復(fù)制到【指針經(jīng)過】幀的工作區(qū)。確保文字被選中，在文字屬性面板中進行色彩調(diào)整，得到如圖5.10所示的文字。定義【按下】幀：用鼠標(biāo)在【按下】幀處插入一個關(guān)鍵幀，此時【指針經(jīng)過幀】幀的文字被復(fù)制到“按下”的工作區(qū)。確保文字被選中，在文字屬性面板中進行色彩調(diào)整，得到如圖5.11所示的文字。定義【點擊】幀：用鼠標(biāo)在【點擊】幀處插入一個關(guān)鍵幀，并進行大小的調(diào)整，得到如圖5.12所示的文字。該幀主要是定義按鈕的有效單擊范圍，在有效范圍里按下按鈕時，系統(tǒng)才認(rèn)為該事件已經(jīng)發(fā)生。如果不定義該幀，則系統(tǒng)默認(rèn)【彈起】幀為響應(yīng)區(qū)域。圖5.9圖5.10圖5.11圖5.12按鈕基礎(chǔ)知識④單擊圖層左上角的[場景1]按鈕，返回場景，按鈕制作完畢。(3)將按鈕加入到場景中的方法：打開【庫】面板，在場景中選中要插入的層中的關(guān)鍵幀，將“庫”中的按鈕拖到場景中的舞臺中即可。(4)預(yù)覽按鈕的兩種方法：第一種，選擇[控制]→[測試影片]命令；第二種，在場景中瀏覽按鈕效果，選擇[控制]→[啟動簡單按鈕]命令。基本按鈕的制作為圖形按鈕添加文字通過給前面制作的圖形按鈕添加“瞬間藝術(shù)”文字，來講解怎樣為圖形按鈕添加文字，方法如下。(1)在場景中雙擊“圖形按鈕”，進入按鈕編輯狀態(tài)，如圖5.13所示。(2)單擊圖層左下角的【插入圖層】按鈕，添加一個新的圖層，如圖5.14所示。圖5.13圖5.14按鈕基礎(chǔ)知識(3)單擊“圖層2”的【彈起】幀，此時選中【彈起】幀，利用文字工具和前面所學(xué)的知識在圖形上面輸入如圖5.15所示的文字。(4)在“圖層2”的【指針經(jīng)過】幀上單擊鼠標(biāo)右鍵，彈出快捷菜單，在快捷菜單中選擇[插入關(guān)鍵幀]命令，插入一個關(guān)鍵幀。此時，該幀將復(fù)制【彈起】幀的文字，將文字修改成如圖5.16所示的效果。圖5.15圖5.16按鈕基礎(chǔ)知識(5)在“圖層2”的【按下】幀上單擊鼠標(biāo)右鍵，彈出快捷菜單，在快捷菜單中選擇[插入關(guān)鍵幀]命令，插入一個關(guān)鍵幀，此時，它將復(fù)制【指針經(jīng)過】幀的文字，將該文字修改成如圖5.17所示的效果。圖5.17(6)單擊圖層左上角的[場景1]按鈕，返回場景，按鈕修改完畢。按鈕基礎(chǔ)知識(3)在“l(fā)oadMovie()”的“()”中輸入?yún)?shù)，如圖5.19所示。圖5.19“donghua”：是要加載的影片名稱，注意要加載的影片名稱一定要是英文或數(shù)字，不能用中文命名，影片名字要用雙引號?！?”：表示加載的動畫所處的層的位置。代碼、函數(shù)、參數(shù)將在后面做詳細(xì)介紹。(4)關(guān)閉【動作】面板，制作完畢。3.為按鈕添加電子郵件在工作和學(xué)習(xí)中，電子郵件的使用非常頻繁，在按鈕中加入電子郵件對我們?nèi)∮镁W(wǎng)上信息更為方便。其方法與按鈕加載方法相同，只是要在URL框中輸入E-mail地址，在添加地址前應(yīng)先加入“mailto”。在【動作】面板中輸入的語句如圖5.20所示。圖5.20簡單控制按鈕的制作案例一：簡單按鈕制作一個簡單按鈕。本案例主要用到的工具或命令有：選擇工具、橢圓工具、元件、柔化填充邊緣、文字工具、填充浮動面板的設(shè)置等。簡單控制按鈕的制作(1)運行Flash8.0，新建一個名為“簡單按鈕”文件。(2)單擊[插入]→[新建元件]命令，彈出【創(chuàng)建新元件】對話框，設(shè)置如圖5.21所示。單擊按鈕，【圖層】面板如圖5.22所示。圖5.21圖5.22說明：

[彈起]是指鼠標(biāo)指針沒有移到按鈕上時顯示的狀態(tài)。

[指針經(jīng)過]是指鼠標(biāo)指針移到按鈕上時顯示的狀態(tài)。

[按下]是指在按鈕上按下鼠標(biāo)左鍵時顯示的狀態(tài)。

[點擊]是指鼠標(biāo)指針觸發(fā)按鈕的范圍。簡單控制按鈕的制作(3)單擊并選中圖層的[彈起]幀。(4)單擊工具箱中的[橢圓]工具。將筆觸顏色設(shè)置為，橢圓漸變填充浮動面板的設(shè)置如圖5.23所示。在工作區(qū)繪制一個圓，如圖5.24所示。圖5.23圖5.24(5)選擇剛繪制的橢圓，選擇[修改]→[形狀]→[柔化填充邊緣]命令，彈出【柔化填充邊緣】對話框，設(shè)置如圖5.25所示。單擊按鈕，得到如圖5.26所示的橢圓。圖5.25圖5.26簡單控制按鈕的制作(6)單擊[文字]工具。在工作區(qū)中輸入文字，大小、位置如圖5.27所示。(7)在[指針經(jīng)過]幀上單擊鼠標(biāo)右鍵，彈出快捷菜單，在快捷菜單中選擇[插入關(guān)鍵幀]命令，此時，在[指針經(jīng)過]幀處插入一個關(guān)鍵幀。(8)單擊[選擇]工具，選中如圖5.28所示的部分，設(shè)置填充浮動面板如圖5.29所示。此時，圖形效果如圖5.30所示。圖5.27圖5.28圖5.29圖5.30(9)單擊【文字】工具，將文字改為如圖5.31所示。將文字改為紅色，如圖5.32所示。(10)在[按下]幀上單擊鼠標(biāo)右鍵，彈出快捷菜單，在快捷菜單中選擇[插入關(guān)鍵幀]命令，此時，在[按下]幀處插入一個關(guān)鍵幀。(11)單擊[選擇]工具，選中如圖5.33所示的部分，設(shè)置填充浮動面板如圖5.34所示。此時，圖形效果如圖5.35所示。簡單控制按鈕的制作圖5.31圖5.32圖5.33圖5.34圖5.35(12)單擊[文字]工具，將文字改為如圖5.36所示。將文字改為深紅色，如圖

5.37所示。(13)在[點擊]幀上單擊鼠標(biāo)右鍵，彈出快捷菜單，在快捷菜單中選擇[插入關(guān)鍵幀]命令，此時，在[點擊]幀處插入一個關(guān)鍵幀。(14)單擊時間軸左上角的[場景1]按鈕，返回場景。(15)將“庫”中的“簡單按鈕”拖到舞臺中并測試效果，如圖5.38所示。將鼠標(biāo)指針移到按鈕上時的效果如圖5.39所示。(16)按下鼠標(biāo)指針時的效果如圖5.40所示。圖5.36圖5.37圖5.38圖5.39圖5.40簡單控制按鈕的制作本案例制作了一簡單的按鈕，主要講解了按鈕的制