04第四講Flash MX教程遮罩的技巧(一).doc

第四講Flash MX教程遮罩控制技術(shù)(一)名稱：Flash遮罩控制技術(shù)課時(shí)：2課時(shí)（教學(xué)）2課時(shí)（實(shí)驗(yàn)）教學(xué)目標(biāo)：掌握基本的遮罩使用命令，學(xué)習(xí)不同條件下的遮罩控制技術(shù)。主要內(nèi)容：學(xué)習(xí)各種典型的遮罩效果，如方法。一、概念提要：Mask，遮罩，也有譯作蒙板。Flash中的遮罩和Photoshop中的Layer mask基本原理是相同的，只是在支持的功能上略微有些區(qū)分。所謂“遮罩”，形象的說來，你可以設(shè)想在你面前有一幅圖畫，但它的上面被一塊紙板遮住，當(dāng)你在紙板上剪出一個(gè)洞，下面圖畫會在相應(yīng)位置顯示出內(nèi)容來。這塊紙板就是遮罩。在Flash中遮罩功能由上下兩個(gè)基本的圖層組合實(shí)現(xiàn)，上面是“遮罩層”，相當(dāng)于我們剛才所說的紙板，下面的是被遮罩層（可以應(yīng)用多個(gè)圖層），相當(dāng)于上面所說的那張畫。在遮罩層上可以畫出任意形狀，在這個(gè)形狀的區(qū)域內(nèi)，就會顯示出被遮罩層中的圖像來，而此形狀以外的區(qū)域，則顯示更下一層中的圖像或背景的圖像來。注意，和Photoshop中的遮罩層不同，F(xiàn)lash的遮罩層不支持透明度。也就是說，在Flash遮罩層中的圖像，其作用僅限于它的輪廓，用于界定產(chǎn)生遮罩區(qū)域的形狀，而它的色彩、內(nèi)部形象均不起作用。這一點(diǎn)相當(dāng)遺憾，當(dāng)然，作為一個(gè)動畫軟件，它的優(yōu)勢在于，不論是遮罩層還是被遮罩層，都支持各種類型的運(yùn)動。二、實(shí)例學(xué)習(xí)如果要硬性為Flash中的遮罩效果分類，從運(yùn)動的對象上可以大致分為三類：被遮罩層圖形運(yùn)動而遮罩層圖像靜止；遮罩層圖形運(yùn)動而被遮罩層圖像靜止；遮罩層和被遮罩層圖形同時(shí)運(yùn)動。下面我們將分別學(xué)習(xí)這些類型的遮罩控制技術(shù)。1、被遮罩層圖形運(yùn)動類型例一：旋轉(zhuǎn)的地球圖4-1預(yù)覽成品：這是一個(gè)通過遮罩控制技術(shù)生成的動畫，地球在不斷旋轉(zhuǎn)，顯示出大陸、海洋的各個(gè)部分。1、使用默認(rèn)設(shè)置創(chuàng)建一個(gè)新的文檔。創(chuàng)建圖形元件2、使用插入新建元件命令，新建一個(gè)Graphic對象的元件并命名為“globe”。然后執(zhí)行“文件導(dǎo)入導(dǎo)入到舞臺命令”，在相應(yīng)的路徑中找到提供的素材圖片globe.wmf。如圖4-1。3、再次創(chuàng)建一個(gè)新的Graphic對象元件（快捷方式：Ctrl+F8），命名為“map”。在時(shí)間軸上把圖層1的名字改為globe map，然后按Ctrl+L鍵打開元件庫，把元件“globe”拖到舞臺中，在屬性欄中修改顏色設(shè)置為“色調(diào)”，選擇色彩#FF9900，其他保持默認(rèn)設(shè)置。完成后再拖一個(gè)，設(shè)置同前，水平對齊，并把它們的位置調(diào)整，如圖4-2所示。圖4-24、添加一個(gè)新的圖層并命名為“background”，按住鼠標(biāo)左鍵拖動這個(gè)圖層到最下一層。然后使用矩形工具繪制一個(gè)大的矩形作為背景，寬：高為950X270；填充顏色#3399cc。如上圖所示。創(chuàng)建影片剪輯元件5、再次使用插入新建元件命令，新建一個(gè)影片剪輯對象并命名為“mapmc”。從元件庫中把元件“map”拖到舞臺中（圖層1）。在變形面板中縮放至50%。位置在中間略靠左。6、添加一個(gè)新的圖層2。用橢圓形工具在第1幀中繪制一個(gè)正圓，色彩任意，大小為120X120。放在地球展開的圖形上。位置如圖4-3。圖4-37、回到圖層1，在第40幀按F6鍵復(fù)制關(guān)鍵幀，重新選中map元件并把它的坐標(biāo)位置向右偏移246。注意，關(guān)鍵在于偏移后的上層圓的位置應(yīng)正好蓋在另一個(gè)地球展開的圖形上相同的位置，如圖4-4。圖4-48、在屬性面板中設(shè)置運(yùn)動類型“動作”，其他保持默認(rèn)設(shè)置。9、來到圖層2，在第40幀按F5鍵創(chuàng)建補(bǔ)間幀，保持兩個(gè)圖層在時(shí)間軸上的幀數(shù)一致。10、鼠標(biāo)右鍵點(diǎn)擊圖層2，在彈出的菜單中選擇“遮罩層”。時(shí)間軸上的顯示如圖4-5。圖4-511、點(diǎn)擊時(shí)間軸上的場景1按鈕，進(jìn)入場景中，從元件庫中把影片剪輯元件“mapmc”拖到舞臺中。Ok，選擇控制測試影片命令看看效果吧，是不是有一個(gè)旋轉(zhuǎn)的地球?？偨Y(jié)：（1）此例中，地球輪廓是靜止的，它的作用是只讓處于此輪廓內(nèi)的動畫圖像顯示出來。地球表面的陸地形狀是運(yùn)動的，有兩個(gè)相同的圖形組成，以便產(chǎn)生連續(xù)運(yùn)動的效果。（2）此例中的地球表面圖形是一個(gè)外部文件，wmf格式是一種矢量格式，但在Flash中不適于創(chuàng)建復(fù)雜的形狀，所以從外部導(dǎo)入。導(dǎo)入的圖像也可以是位圖，根據(jù)你的需要來選擇。（3）此例中是把遮罩的效果放在影片剪輯中，和放在主場景中制作完全相同，只是影片剪輯的好處是可以自動重復(fù)播放。2、遮罩層圖形運(yùn)動類型例二：探照燈效果預(yù)覽成品：這是一個(gè)通過遮罩控制技術(shù)生成的網(wǎng)絡(luò)廣告動畫，探照燈在廣告商品的每個(gè)關(guān)鍵位置停頓，把經(jīng)過的地方照亮，最后停止在廣告商品的LOGO上。1、創(chuàng)建一個(gè)新的文檔，選擇修改文檔命令，把背景色設(shè)置為黑色。創(chuàng)建圖形元件2、使用插入新建元件命令，新建一個(gè)Graphic對象的元件并命名為“ad”。然后執(zhí)行“文件導(dǎo)入導(dǎo)入到舞臺命令”，在相應(yīng)的路徑中找到提供的素材圖片ad0009.gif。如圖4-6。 圖4-6圖4-73、原始的圖片尺寸較大，在屬性欄中選擇鎖定縱橫比，把寬度尺寸改為550，高度將自動改變，坐標(biāo)位置為X:-275；Y:-165.5（元件的中心點(diǎn)位置）。如圖4-7。4、再次創(chuàng)建一個(gè)新的Graphic對象元件（快捷方式：Ctrl+F8），命名為“l(fā)ight”。然后使用橢圓形工具繪制一個(gè)90*90的圓，色彩任意。5、點(diǎn)擊時(shí)間軸上的場景1按鈕，進(jìn)入場景中，從元件庫中把元件“ad”拖到舞臺中放在默認(rèn)的圖層1。雙擊圖層1的標(biāo)題名，改為“background”。6、點(diǎn)擊時(shí)間軸上的“添加新圖層”（如圖4-8）按鈕添加一個(gè)新的圖層并命名為“mask1”。把元件“l(fā)ight”拖到舞臺中的任意位置，稍后我們將作調(diào)整。圖4-87、分別在第5、15、25、35、45、50、60、70、80幀按F6鍵復(fù)制關(guān)鍵幀，然后重新依次調(diào)整它們的位置如圖4-9。其中，把第70幀中的元件放大到180%，第80幀中的元件放大到覆蓋整個(gè)畫面。圖4-98、位置修改完成后分別在第10、20、30、40、幀按F6鍵復(fù)制關(guān)鍵幀。這一步的設(shè)置是為了在廣告商品的關(guān)鍵位置做短站的停頓。設(shè)置運(yùn)動屬性9、分別選中第1、10、20、30、35、40、45、55、60、70幀，在屬性欄中設(shè)置運(yùn)動屬性補(bǔ)間類型為“動作”，其他保持默認(rèn)不變。時(shí)間軸上的設(shè)置如圖4-10。圖4-1010、點(diǎn)擊圖層background，分別在第70、80幀按F6鍵復(fù)制關(guān)鍵幀。然后選中第80幀，以右上角為基準(zhǔn)，把該元件縮放至150%。11、重新選中第70幀，在屬性欄中設(shè)置運(yùn)動屬性補(bǔ)間類型為“動作”。12、鼠標(biāo)右鍵點(diǎn)擊圖層“mask1”，在彈出的菜單中選擇“遮罩層”。13、添加一個(gè)新的圖層并命名為“action”，選中第80幀按F7鍵創(chuàng)建空白關(guān)鍵幀，打開“動作”面板，按下按鈕選擇“全局函數(shù)時(shí)間軸控制stop”。如圖4-11。圖4-11解釋：這個(gè)action語句的意思是控制動畫播放到這一幀時(shí)停止，以避免動畫循環(huán)播放?？偨Y(jié)：（1）此例中，遮罩層中的圖形是運(yùn)動的，而且這個(gè)圖形是Graphic元件。事實(shí)上，遮罩層中的圖形也可以是shape形狀，甚至是一個(gè)影片剪輯。遮罩層中的圖形作用就是讓處于此輪廓內(nèi)的圖像顯示出來。（2）此例中，不只遮罩層中的圖形運(yùn)動，而且，在第70幀以后的被遮罩層中，圖像也進(jìn)行運(yùn)動了（縮放），這也算是我們上文對遮罩分類中的第三種類型了。（3）此例中，我們接觸到教程中的第一個(gè)action命令。3、遮罩層中的逐幀運(yùn)動例三：書法文字預(yù)覽成品：這是一個(gè)顯示書寫過程效果的動畫，我們經(jīng)常會看到類似的效果，同樣是通過遮罩控制技術(shù)生成。1、使用默認(rèn)設(shè)置創(chuàng)建一個(gè)新的文檔。創(chuàng)建圖形元件2、使用插入新建元件命令，新建一個(gè)Graphic對象的元件并命名為“永”。然后選擇文字工具，在屬性欄中設(shè)置為“靜態(tài)文本”；字體“楷體”；黑色，其他為默認(rèn)設(shè)置。3、進(jìn)入場景中，在圖層1的第2幀按F7鍵創(chuàng)建空白關(guān)鍵幀，從元件庫中把元件“永”拖到舞臺中，使用任意變形工具調(diào)整文字到合適的大小。圖4-124、添加一個(gè)新的圖層2，選擇刷子工具，在選項(xiàng)欄中選擇圓形筆刷，筆刷大小略大于文字的筆畫寬度即可。如圖4-12。5、在第1幀中畫一筆，然后按F6鍵復(fù)制關(guān)鍵幀，在第2幀中再畫一筆，然后再按F6鍵復(fù)制關(guān)鍵幀，在該幀中再畫一筆以此類推，直到把文字的最后一點(diǎn)都完全覆蓋住。圖4-13中的四幅小圖分別是第2、10、2