flashcs6教程8

1、在Flash中，每個(gè)元件都有唯一的時(shí)間軸和舞臺(tái)以及若干個(gè)圖層。它可以獨(dú)立于主動(dòng)畫進(jìn)行播放。下面以設(shè)計(jì)按鈕元件為例，介紹元件的創(chuàng)建方法，一起來(lái)試試吧。直接創(chuàng)建元件即先利用“創(chuàng)建新元件”命令創(chuàng)建一個(gè)空元件，然后在元件編輯模式下制作元件。直接創(chuàng)建元件的具體操作步驟如下。步驟1 在Flash窗口中新建“按鈕.fla”文件，然后在菜單欄中選擇“插入”|“新建元件”命令，如圖8-1所示。步驟2 彈出“創(chuàng)建新元件”對(duì)話框，在“名稱”文本框中輸入元件名稱，然后設(shè)置類型為“按鈕”，再單擊“確定”按鈕，如圖8-2所示。步驟3 返回Flash窗口，即可發(fā)現(xiàn)此時(shí)已進(jìn)入按鈕元件的編輯窗口，在“時(shí)間軸”面板中單擊“彈起”

2、幀，然后在工具箱中單擊“橢圓工具”圖標(biāo)，接著在“屬性”面板中設(shè)置筆觸顏色為“無(wú)”，并單擊“填充顏色”圖標(biāo)，在彈出的菜單中單擊“線性填充”圖 標(biāo)，如圖8-3所示。步驟4 在元件編輯窗口中按住鼠標(biāo)左鍵并拖動(dòng)鼠標(biāo)，繪制漸變色橢圓圖形，如圖8-4所示。圖8-1 選擇“新建元件”命令圖8-2 “創(chuàng)建新元件”對(duì)話框圖8-3 設(shè)置橢圓工具屬性圖8-4 繪制漸變色橢圓圖形步驟5 在工具箱中單擊“文本工具”圖標(biāo)，然后在元件編輯窗口中插入文本框，并輸入字符“Play”，如圖8-5所示。步驟6 單擊插入的文本框，然后在“屬性”面板中的“系列”下拉列表中選擇一種字體樣式，如圖8-6所示。圖8-6 設(shè)置文本的字體樣式圖

3、8-5 插入文本步驟7 繼續(xù)設(shè)置文本的字體顏色為“紅色”，大小為28，如圖8-7所示。步驟8 使用選擇工具將文本框移動(dòng)到橢圓圖形上，接著使用任意變形工具調(diào)整橢圓圖形的大小，再選中橢圓圖形和文本框，按Ctrl+G組合鍵組合圖形，如圖8-8所示。圖8-7 設(shè)置文本顏色和大小圖8-8 組合文本框和橢圓圖形步驟9 在“時(shí)間軸”面板中右擊“指針經(jīng)過(guò)”幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，這樣即可將“彈起”幀中的圖形復(fù)制到“指針經(jīng)過(guò)”幀中了，如圖8-9所示。步驟10 單擊圖形，在菜單欄中選擇“修改”|“取消組合”命令，如圖8-10所示。圖8-10 選擇“取消組合”命令圖8-9 選擇“插入關(guān)鍵幀”命

4、令步驟11 單擊文本框，然后在“屬性”面板中設(shè)置文本顏色為“綠色”(#00FF00)，如圖8-11所示。步驟12 單擊橢圓圖形，然后按Alt+Shift+F9組合鍵打開“顏色”面板，設(shè)置徑向漸變填充兩端的顏色分別為“#FFFFFF”、“#B0FFB0”，如圖8-12所示。步驟13 再次組合文本框和橢圓圖形，然后右擊“按下”幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，在該幀處插入關(guān)鍵幀，效果如圖8-13所示。步驟14 參考前面的步驟，先取消圖形組合，然后為橢圓圖形設(shè)置另一種填充顏色，并將文本顏色設(shè)置為“黃色”(#FFFF00)，再次將兩圖形組合起來(lái)，如圖8-14所示。圖8-11 設(shè)置文本顏色為

5、“綠色”圖8-12 設(shè)置徑向漸變填充參數(shù)圖8-13 在“按下”幀位置處插入關(guān)鍵幀圖8-14 為文本和橢圓圖形設(shè)置另一種顏色步驟15 右擊“點(diǎn)擊”幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，效果如圖8-15所示。步驟16 單擊“返回場(chǎng)景”圖標(biāo)，返回到場(chǎng)景編輯狀態(tài)，如圖8-16所示。步驟17 切換到“庫(kù)”面板，會(huì)看到剛才制作的按鈕元件已經(jīng)自動(dòng)添加到庫(kù)中了，把按鈕元件拖動(dòng)到舞臺(tái)，即可創(chuàng)建按鈕元件的實(shí)例，如圖8-17所示。步驟18 選擇菜單欄中的“控制”|“啟用簡(jiǎn)單按鈕”命令，就可以在場(chǎng)景中測(cè)試按鈕元件，如圖8-18所示。步驟19 將指針定位到按鈕上，此時(shí)的效果如圖8-19所示。步驟20 單擊按鈕，

6、此時(shí)的效果如圖8-20所示。釋放鼠標(biāo)左鍵后，按鈕將恢復(fù)到“經(jīng)過(guò)”幀中的顏色。圖8-16 單擊“返回場(chǎng)景”圖標(biāo)圖8-15 在“點(diǎn)擊”幀位置處插入關(guān)鍵幀圖8-17 插入新創(chuàng)建的按鈕元件圖8-18 選擇“啟用簡(jiǎn)單按鈕”命令圖8-19 查看將指針定位到按鈕上時(shí)的效果圖8-20 查看單擊按鈕時(shí)的效果元件庫(kù)在動(dòng)畫制作中經(jīng)常會(huì)用到，在使用元件庫(kù)之前，先來(lái)熟悉一下“庫(kù)”面板。在Flash程序中，按F11鍵或Ctrl+L組合鍵即可打開或隱藏“庫(kù)”面板了，如圖8-21所示。圖8-21 “庫(kù)”面板l 標(biāo)題欄：用于顯示當(dāng)前Flash文件的標(biāo)題。將鼠標(biāo)指針移到標(biāo)題欄上，會(huì)出現(xiàn)該文件的存儲(chǔ)地址，如圖8-22所示。若單擊標(biāo)

7、題欄右側(cè)的下拉按鈕，可以在彈出的下拉列表中看到所有被打開的Flash文件的名稱，若要切換到某個(gè)文件，單擊相應(yīng)的文件名稱即可。l 元件預(yù)覽窗口：用于預(yù)覽元件項(xiàng)目列表中選定的元件。如果選定的是一個(gè)多幀動(dòng)畫文件，還可以通過(guò)預(yù)覽窗口右上角的“播放”圖標(biāo)和“停止”圖標(biāo)觀看動(dòng)畫的播放效果。l 元件項(xiàng)目列表：該列表中列出了庫(kù)中所有元素的各種屬性，包括名稱、鏈接、使用次數(shù)、修改日期和類型。由于“屬性”面板空間的限制，一般只顯示了元件的名稱和鏈接信息，只要單擊面板下方的滑塊并向右拖動(dòng)，即可查看元件的其他屬性。l 菜單項(xiàng)：?jiǎn)螕粼搱D標(biāo)，可以打開“庫(kù)”面板菜單，該菜單中包含了“庫(kù)”面板中的所有操作，如圖8-23所示。

8、圖8-22 顯示Flash文件的存儲(chǔ)位置圖8-23 展開菜單項(xiàng)在庫(kù)中可以新建元件、文件夾、字型和視頻對(duì)文件夾的各種操作命令l “新建元件”圖標(biāo)：?jiǎn)螕粼搱D標(biāo)，也會(huì)彈出“創(chuàng)建新元件”對(duì)話框，可以為新元件命名并選擇類型。l “新建文件夾”圖標(biāo)：?jiǎn)螕粼搱D標(biāo)可以新建一個(gè)文件夾，如圖8-24所示，接著可以對(duì)文件夾進(jìn)行重命名，再將類似或相互關(guān)聯(lián)的一些文件存放在該文件夾中。l “屬性”圖標(biāo)：?jiǎn)螕粼搱D標(biāo)，將彈出“元件屬性”對(duì)話框，在此查看和修改庫(kù)中文件的屬性，如圖8-25所示。l “刪除”圖標(biāo)：?jiǎn)螕粼搱D標(biāo)，可以刪除庫(kù)中元件項(xiàng)目列表中被選中的元件。圖8-24 查看新建的文件夾圖8-25 “元件屬性”對(duì)話框下面以使

9、用公用庫(kù)中的元件創(chuàng)建播放按鈕為例進(jìn)行介紹，具體操作步驟如下。步驟1 在“時(shí)間軸”面板中新建圖層2，然后在菜單欄中選擇“窗口”|“公用庫(kù)”|“Buttons”命令，如圖8-26所示。步驟2 打開“外部庫(kù)”面板，在元件項(xiàng)目列表中選擇要使用元件所在的文件夾，這里單擊“classic buttons”文件夾左側(cè)的三角圖標(biāo) ，如圖8-27所示。步驟3 在展開的“classic buttons”文件夾列表中單擊“playback”文件夾左側(cè)的三角圖標(biāo)，如圖8-30所示。圖8-26 選擇Buttons命令圖8-27 “外部庫(kù)”面板圖8-30 單擊“playback”文件夾步驟4 在展開的“playback”

10、文件夾列表中單擊要使用的按鈕元件，這里單擊“gel Right”元件，并按住鼠標(biāo)左鍵向舞臺(tái)中拖動(dòng)，插入該元件，如圖8-31所示。圖8-31 插入元件按鈕步驟5 在舞臺(tái)中單擊“編輯元件”圖標(biāo)，從彈出的菜單中選擇“classic buttons”|“Playback”|“gel Right”命令，如圖8-32所示。步驟6 進(jìn)入元件編輯窗口，即可編輯插入的按鈕元件了，如圖8-33所示。圖8-32 選擇要編輯的元件圖8-33 編輯元件編輯元件時(shí)，F(xiàn)lash會(huì)自動(dòng)將動(dòng)畫中該元件的所有實(shí)例都進(jìn)行更新。用戶一般可以通過(guò)以下三種方法對(duì)元件進(jìn)行編輯。在當(dāng)前位置編輯元件的操作步驟如下。步驟1 在舞臺(tái)中右擊要編輯的

11、元件，在彈出的快捷菜單中選擇“在當(dāng)前位置編輯”命令，如圖8-34所示，或者在菜單欄中選擇“編輯”|“在當(dāng)前位置編輯”命令。步驟2 此時(shí)，在舞臺(tái)上即可編輯該元件，且其他對(duì)象也會(huì)以灰色方式顯示在舞臺(tái)上，但不可編輯，如圖8-35所示。圖8-35 進(jìn)入元件編輯窗格圖8-34 選擇“在當(dāng)前位置編輯”命令在新窗口中編輯元件的操作步驟如下。步驟1 在舞臺(tái)中右擊要編輯的元件，在彈出的快捷菜單中選擇“在新窗口中編輯”命令，如圖8-36所示。步驟2 此時(shí)將打開一個(gè)新的文檔編輯窗口，如圖8-37所示。在該窗口中可以繼續(xù)編輯該元件。圖8-37 在新窗口中打開元件圖8-36 選擇“在新窗口中編輯”命令在元件編輯模式下編

12、輯元件的操作步驟如下。步驟1 在舞臺(tái)中單擊要編輯的元件，然后在菜單欄中選擇“編輯”|“編輯元件”命令，如圖8-38所示?；蚴窃谖枧_(tái)中右擊元件，在彈出的快捷菜單中選擇“編輯”命令。步驟2 這樣，即可將窗口從舞臺(tái)視圖改為只顯示該元件的單獨(dú)視圖。正在編輯的元件名稱會(huì)顯示在舞臺(tái)左上角的信息欄內(nèi)，如圖8-39所示。圖8-38 選擇“編輯元件”命令圖8-39 編輯元件在一些比較復(fù)雜的Flash文件中可能需要新建或插入多個(gè)元件，為了方便找到需要的元件，可以使用文件夾來(lái)管理這些元件，具體操作步驟如下。在“庫(kù)”面板中新建文件夾的操作步驟如下。步驟1 在“迷你網(wǎng)站.fla”文件窗口中打開“庫(kù)”面板，然后單擊“新建

13、文件夾”圖標(biāo)，如圖8-40所示。步驟2 創(chuàng)建的新文件夾名稱以高亮顯示，如圖8-41所示。接著在文本框中輸入新 建文件夾的名稱。圖8-40 單擊“新建文件夾”圖標(biāo)圖8-41 輸入新建文件夾的名稱步驟3 名稱輸入完成后，按Enter鍵或者在“庫(kù)”面板的其他位置處單擊，即可確認(rèn)文件夾名稱的輸入，如圖8-42所示。圖8-42 查看修改名稱后的文件夾將元件移動(dòng)到文件夾中的方法如下。步驟1 如果要將元件放入到文件夾中，只要選中該元件，然后按住鼠標(biāo)左鍵向文件夾拖動(dòng)將元件拖動(dòng)至文件夾上，如圖8-43所示。步驟2 釋放鼠標(biāo)左鍵即可將元件移動(dòng)到文件夾中，如圖8-44所示。圖8-44 在文件夾中查看移動(dòng)后的元件圖8

14、-43 拖動(dòng)元件步驟3 使用類似方法，繼續(xù)移動(dòng)元件至文件夾中，整理后的“庫(kù)”面板如圖8-45所示，看起來(lái)非常整潔。步驟4 在“庫(kù)”面板中單擊某文件夾左側(cè)的圖標(biāo)即可展開該文件夾，查看其中的元件，如圖8-46所示。圖8-45 整理后的“庫(kù)”面板在默認(rèn)情況下，“庫(kù)”面板中的元件是按照名稱進(jìn)行排序的，如圖8-47所示。用戶也可以按“鏈接”、“類型”、“使用次數(shù)”、“修改日期”等方式對(duì)所有的元件及文件夾進(jìn)行排序，方法如下。步驟1 在“庫(kù)”面板中，單擊“名稱”選項(xiàng)右側(cè)的圖標(biāo)，按名稱對(duì)元件進(jìn)行升序排序，如圖8-48所示。步驟2 在“庫(kù)”面板中向右拖動(dòng)水平滾動(dòng)條，接著單擊“修改日期”選項(xiàng)，按修改日期對(duì)元件排序

15、，如圖8-49所示。步驟3 若要按類型對(duì)元件排序，只需要單擊“類型”選項(xiàng)即可，如圖8-50所示。圖8-46 展開文件夾圖8-47 按名稱排序元件的效果圖8-48 按名稱對(duì)元件進(jìn)行升序排序圖8-49 按修改日期對(duì)元件排序圖8-50 按類型對(duì)元件排序元件創(chuàng)建后，用戶仍然可以更改其屬性，具體操作步驟如下。步驟1 在“庫(kù)”面板中右擊要修改的元件，在彈出的快捷菜單中選擇“屬性”命令，如圖8-52所示。步驟2 彈出“元件屬性”對(duì)話框，在“名稱”文本框中可以為元件重新命名，在“類型”下拉列表中可以為元件重新設(shè)置元件類型，如圖8-54所示。設(shè)置完成后，單擊“確定”按鈕即可。圖8-52 選擇“屬性”命令圖8-5

16、4 “元件屬性”對(duì)話框一個(gè)動(dòng)畫制作完成后，有時(shí)會(huì)發(fā)現(xiàn)“庫(kù)”中存在一些無(wú)用的元件，此時(shí)就可以把它們刪除以減小動(dòng)畫文件的大小。方法是在“庫(kù)”面板中選擇需要?jiǎng)h除的元件，然后單擊下方的“刪除”圖標(biāo)即可，如圖8-57所示?；蛘呤怯覔粢?jiǎng)h除的元件，在彈出的快捷菜單中選擇“刪除”命令，如圖8-58所示。圖8-57 單擊“刪除”圖標(biāo)圖8-58 選擇“刪除”命令在學(xué)習(xí)了如何設(shè)計(jì)按鈕元件后，相信大家已經(jīng)掌握了按鈕元件的創(chuàng)建方法，也會(huì)舉一反三，創(chuàng)建圖形元件和影片剪輯元件。下面以使用剛學(xué)習(xí)的知識(shí)，制作沿著鼠標(biāo)滑過(guò)的軌跡而閃爍的星星作品，具體操作步驟如下。步驟1 新建“滿天星.fla”文件，并在“屬性”面板中調(diào)整文檔參

17、數(shù)，如圖8-60所示。步驟2 在菜單欄中選擇“插入”|“新建元件”命令，打開“創(chuàng)建新元件”對(duì)話框。在“類型”下拉列表中選擇“按鈕”選項(xiàng)，在“名稱”文本框中輸入“星星”，再單擊“確定”按鈕，如圖8-61所示。步驟3 在工具箱中單擊“多角星形工具”圖標(biāo)，然后在菜單欄中選擇“窗口”|“顏色”命令，打開“顏色”面板，在此設(shè)置填充顏色從黃色到白色透明的徑向漸變，如圖8-62所示。圖8-60 創(chuàng)建“滿天星.fla”文件圖8-61 “創(chuàng)建新元件”對(duì)話框步驟4 在舞臺(tái)上按住鼠標(biāo)左鍵并拖動(dòng)，繪制一個(gè)五角星形，如圖8-63所示。圖8-62 “顏色”面板圖8-63 繪制五角星形步驟5 在菜單欄中選擇“插入”|“新建

18、元件”命令，打開“創(chuàng)建新元件”對(duì)話框，然后在“名稱”文本框中輸入“星星剪輯”，在“類型”下拉列表中選擇“影片剪輯”選項(xiàng)，創(chuàng)建一個(gè)影片剪輯元件，再單擊“確定”按鈕，如圖8-64所示。步驟6 打開“庫(kù)”面板，把其中的“星星”按鈕元件拖到場(chǎng)景中心位置，如圖8-65所示。圖8-64 創(chuàng)建“星星剪輯”元件步驟7 選擇舞臺(tái)上的星星實(shí)例，在“屬性”面板中展開”色彩效果”子面板，接著單擊“樣式”右側(cè)的下拉按鈕，從彈出的下拉列表中選擇Alpha選項(xiàng)，設(shè)置Alpha值為0，如圖8-66所示。步驟8 在時(shí)間軸上右擊圖層1中的第2幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，如圖8-67所示。步驟9 使用選擇工具在舞

19、臺(tái)上單擊第2幀上的星星圖形，接著在“屬性”面板中將其Alpha值設(shè)置為70，如圖8-68所示。圖8-65 使用星星按鈕元件步驟10 在圖層1中右擊第6幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，接著選中該幀中的星星，在“屬性”面板中將Alpha值設(shè)置為55，如圖8-69所示。圖8-66 設(shè)置Alpha選項(xiàng)值圖8-67 選擇“插入關(guān)鍵幀”命令圖8-68 調(diào)整第2幀上圖形的色彩效果圖8-69 調(diào)整第6幀上圖形的色彩效果圖8-70 “變形”面板步驟11 在菜單欄中選擇“窗口”|“變形”命令，打開“變形”面板，將星星的“縮放高度”和“縮放寬度”都設(shè)置為70.0%，如圖8-70所示。步驟12 在圖層1

20、中的第10幀處插入關(guān)鍵幀，然后選中該幀中的星星，在“屬性”面板中將Alpha值設(shè)置為100，如圖8-71所示。圖8-71 調(diào)整第10幀上圖形的色彩效果步驟13 按Ctrl+T組合鍵打開“變形”面板，將星星的“縮放高度”和“縮放寬度”都設(shè)置為100%。此時(shí)的星星效果如圖8-72所示。步驟14 采用同樣的方法，在圖層1中的第13幀處插入關(guān)鍵幀。然后，選中該幀中的星星，在“屬性”面板中將其Alpha值設(shè)置為90。打開“變形”面板，將星星的“縮放高度”和“縮放寬度”都設(shè)置為80%，如圖8-73所示。圖8-72 調(diào)整第10幀上圖形的大小步驟15 在圖層1中的第18幀處插入關(guān)鍵幀，選中該幀中的星星。在“屬

21、性”面板中將其Alpha值設(shè)置為100%。接著打開“變形”面板，將星星的“縮放高度”和“縮放寬度”都設(shè)置為100%。此時(shí)的星星效果如圖8-74所示。步驟16 在圖層1中的第25幀處插入關(guān)鍵幀。選中該幀中的星星，在“屬性”面板中將其Alpha值設(shè)置為15。接著打開“變形”面板，將星星的“縮放高度”和“縮放寬度”都設(shè)置為30%。此時(shí)的星星效果如圖8-75所示。步驟17 在圖層1中選中225幀并右擊，在彈出的快捷菜單中選擇“創(chuàng)建傳統(tǒng)補(bǔ)間”命令，如圖8-76所示。步驟18 此時(shí)的時(shí)間軸如圖8-77所示。圖8-73 調(diào)整第13幀上的圖形圖8-74 調(diào)整第18幀上的圖形圖8-75 調(diào)整第25幀中的圖形圖8

22、-76 選擇“創(chuàng)建傳統(tǒng)補(bǔ)間”命令圖8-77 查看一次創(chuàng)建多個(gè)補(bǔ)間動(dòng)畫后的時(shí)間軸圖8-78 選擇“動(dòng)作”命令步驟19 在圖層1中右擊第1幀，在彈出的快捷菜單中選擇“動(dòng)作”命令，如圖8-78所示。步驟20 打開“動(dòng)作”面板，輸入代碼“stop();”，如圖8-79所示。圖8-79 輸入“stop();”語(yǔ)句步驟21 選擇舞臺(tái)的“星星”按鈕元件的實(shí)例，按F9鍵打開“動(dòng)作”面板，輸入如圖8-80所示的代碼。on(rollOver)gotoAndPlay(2);步驟22 單擊“返回到場(chǎng)景”圖標(biāo)，返回場(chǎng)景，然后將圖層1重命名為“背景”，如圖8-81所示。圖8-80 “動(dòng)作”面板步驟23 在菜單欄中選擇“文件”|“導(dǎo)入”|“導(dǎo)入到舞臺(tái)”命令，如圖8-82所示。步驟24 彈出“導(dǎo)入”對(duì)話框，選擇“背景.jpg”文件，再單擊“打開”按鈕，將圖片導(dǎo)入到舞臺(tái)中，如圖8-83所示。圖8-81 修改圖層1名稱圖8-82 選擇“導(dǎo)入到舞臺(tái)”命令圖8-83 “導(dǎo)入”對(duì)話框步驟25 按舞臺(tái)大小調(diào)整圖形，接著新建圖層2，并重命名為“星星”，再將“星星剪輯”元件拖到舞臺(tái)中適當(dāng)?shù)奈恢脛?chuàng)建實(shí)例，如圖8-84所示。步驟26 由于“星星剪輯”影片剪輯元件是透