FlashCS6中文版基礎(chǔ)教程：第15章 創(chuàng)建遮罩動(dòng)畫(huà)

1第15章創(chuàng)建遮罩動(dòng)畫(huà)在本章節(jié)中，我們除了為大家介紹遮罩的基本知識(shí)，還結(jié)合我們的實(shí)際經(jīng)驗(yàn)介紹一些遮罩的應(yīng)用技巧，最后通過(guò)制作一個(gè)遮罩動(dòng)畫(huà)的范例，以加深對(duì)遮罩原理的理解，遮罩如圖15-1所示。在Flash中實(shí)現(xiàn)遮罩效果有兩種做法，一種是用創(chuàng)建【補(bǔ)間動(dòng)畫(huà)的】方法；另一種是用actions指令的方法。在平時(shí)制作動(dòng)畫(huà)的過(guò)程中，我們最常用的是第一種方法。在本章節(jié)中我們主要學(xué)習(xí)利用【補(bǔ)間動(dòng)畫(huà)】創(chuàng)建遮罩動(dòng)畫(huà)的方法。215.1遮罩的原理在Flash中，遮罩動(dòng)畫(huà)也確實(shí)是通過(guò)遮罩層來(lái)達(dá)到有選擇地顯示位于其下方的被遮罩層中內(nèi)容的目的。在一個(gè)遮罩動(dòng)畫(huà)中，遮罩層只有一個(gè)，被遮罩層可以有任意多個(gè)，如圖15-2所示。遮罩動(dòng)畫(huà)主要有兩種用途，一個(gè)是用在整個(gè)場(chǎng)景或一個(gè)特定區(qū)域，使場(chǎng)景外的對(duì)象或特定區(qū)域外的對(duì)象不可見(jiàn)；另一個(gè)是用來(lái)遮罩住某一元件的一部分，從而實(shí)現(xiàn)一些特殊的效果。315.2創(chuàng)建和取消遮罩層我們可以在遮罩層、被遮罩層中分別或同時(shí)使用形狀補(bǔ)間動(dòng)畫(huà)、運(yùn)動(dòng)補(bǔ)間動(dòng)畫(huà)、引導(dǎo)層動(dòng)畫(huà)等動(dòng)畫(huà)手段，從而使遮罩動(dòng)畫(huà)效果更加豐富多彩，如圖15-3所示。要在場(chǎng)景中顯示遮罩效果，可以鎖定遮罩層和被遮罩層，如圖15-4所示。415.2.1創(chuàng)建遮罩層在Flash中并沒(méi)有一個(gè)專(zhuān)門(mén)的按鈕來(lái)創(chuàng)建遮罩層，遮罩層都是由普通圖層轉(zhuǎn)化而成的。下面我們來(lái)具體演示遮罩層的創(chuàng)建以及一些使用技巧。(1)首先打開(kāi)一個(gè)場(chǎng)景文件，如圖15-5所示。(2)在【圖層1】的第50幀，按F6鍵添加關(guān)鍵幀，如圖15-6所示。515.2.1創(chuàng)建遮罩層(3)單擊【新建圖層】按鈕，創(chuàng)建一個(gè)新的圖層，如圖15-7所示。(4)使用【工具】面板中的繪圖工具，在【圖層3】中繪制圖形，如圖15-8所示。(5)在【圖層3】的名稱(chēng)上右擊，在彈出的快捷菜單中選擇【遮罩層】命令，如圖15-9所示。615.2.1創(chuàng)建遮罩層(6)這樣就創(chuàng)建了一個(gè)最簡(jiǎn)單的遮罩層，如圖15-10所示。(7)遮罩層很少單獨(dú)使用，只有通過(guò)與【補(bǔ)間動(dòng)畫(huà)】的結(jié)合才能制作出豐富的效果，我們來(lái)添加兩個(gè)簡(jiǎn)單的補(bǔ)間動(dòng)畫(huà)來(lái)實(shí)現(xiàn)一些簡(jiǎn)單的動(dòng)畫(huà)效果。在【圖層3】的第50幀，按F6鍵插入關(guān)鍵幀，如圖15-11所示。(8)單擊【圖層3】的50幀，使用【工具】面板中的【任意變形工具】調(diào)整圖形的大小，如圖15-12所示。715.2.1創(chuàng)建遮罩層(9)在【圖層3】的第1幀到第50幀之間右擊，在彈出的快捷菜單中選擇【創(chuàng)建補(bǔ)間形狀】動(dòng)畫(huà)命令，創(chuàng)建形狀補(bǔ)間動(dòng)畫(huà)，如圖15-13所示。(10)測(cè)試動(dòng)畫(huà)，觀(guān)察遮罩動(dòng)畫(huà)的效果，如圖15-14所示。815.2.2取消遮罩層在學(xué)習(xí)了創(chuàng)建遮罩層之后，我們來(lái)學(xué)習(xí)如何取消遮罩效果。(1)接著上一小節(jié)的演示，在【圖層3】的名稱(chēng)上右擊，彈出其快捷菜單，如圖15-15所示。(2)選擇【遮罩層】命令，將遮罩層轉(zhuǎn)換為普通圖層，如圖15-16所示。915.2.2取消遮罩層這樣就取消了遮罩層，也就是將遮罩層轉(zhuǎn)換為普通圖層。在遮罩層中所繪制的圖形也不再具有遮罩圖層的效果，如圖15-17所示。1015.3上機(jī)實(shí)踐操作本范例源文件：\15\帆船.fla。本范例完成文件：\15\遮罩帆船.fla。多媒體教學(xué)路徑：光盤(pán)→多媒體教學(xué)→第15章。1115.3.1實(shí)例介紹和展示本例通過(guò)運(yùn)用【打開(kāi)】命令、【新建元件】命令、【新建圖層】按鈕、繪圖工具和【遮罩】命令來(lái)制作帆船遮罩效果。效果如圖15-18所示。1215.3.2繪制遮罩圖形(1)首先打開(kāi)第15章的實(shí)例文件，如圖15-19所示。(2)按Ctrl+F8組合鍵，打開(kāi)【創(chuàng)建新元件】對(duì)話(huà)框，選擇【類(lèi)型】為【圖形】，并把該元件重新命名為“遮罩圖形”，如圖15-20所示。1315.3.2繪制遮罩圖形(3)單擊【確定】按鈕，進(jìn)入元件的編輯界面，如圖15-21所示。(4)選擇【工具】面板中的繪圖工具，繪制如圖15-22所示的圖形。1415.3.3制作遮罩動(dòng)畫(huà)(1)繪制完成圖形后，單擊【返回場(chǎng)景】圖標(biāo)，返回到主場(chǎng)景。(2)確認(rèn)【圖層1】為當(dāng)前圖層，單擊時(shí)間軸上的【新建圖層】按鈕，新建【圖層11】，如圖15-23所示。(3)在【圖層11】的名稱(chēng)上雙擊，將該圖層重命名為“遮罩”，如圖15-24所示。1515.3.3制作遮罩動(dòng)畫(huà)(4)在【庫(kù)】中選擇我們創(chuàng)建的元件【遮罩圖形】，如圖15-25所示。(5)將【遮罩圖形】圖形元件拖曳到【遮罩】圖層上，如圖15-26所示。(6)選擇第20幀，按F6鍵，插入關(guān)鍵幀并移動(dòng)圖形元件的位置，如圖15-27所示。1615.3.3制作遮罩動(dòng)畫(huà)(7)選擇第27幀，按F6鍵，插入關(guān)鍵幀并保持圖形元件位置不變，如圖15-28所示。(8)選擇第50幀，按F6鍵，插入關(guān)鍵幀，將圖形元件的位置向上拖曳，如圖15-29所示。(9)在第1幀到第20幀之間右擊，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，創(chuàng)建補(bǔ)間動(dòng)畫(huà)，如圖15-30所示。1715.3.3制作遮罩動(dòng)畫(huà)(10)在第20幀到27幀之間右擊，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，創(chuàng)建新的補(bǔ)間動(dòng)畫(huà)，如圖15-31所示。(11)在第27幀到第50幀之間右擊，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，如圖15-32所示。(12)在【遮罩】圖層名稱(chēng)上右擊，在彈出的快捷菜單中選擇【遮罩層】命令，如圖15-33所示。1815.3.3制作遮罩動(dòng)畫(huà)(13)創(chuàng)建完成遮罩層后的時(shí)間軸，如圖15-34所示。(14)按Ctrl+Enter組合鍵，測(cè)試遮