第3章_時(shí)間軸幀與圖層

1、Flash項(xiàng)目實(shí)踐教程（第三版）Part3第3章 時(shí)間軸、幀與圖層目標(biāo)概述學(xué)習(xí)要求本章將全面介紹Flash CS6 Professional中的時(shí)間軸、圖層以及關(guān)鍵幀基本概念和應(yīng)用方法，使學(xué)習(xí)者能夠掌握Flash中時(shí)間軸、圖層和幀基本概念和應(yīng)用方法，為后面的動(dòng)畫(huà)制作奠定堅(jiān)實(shí)的基礎(chǔ)。學(xué)習(xí)目標(biāo) 學(xué)習(xí)目標(biāo)知識(shí)點(diǎn)了解理解掌握應(yīng)用時(shí)間軸的基本概念（幀、幀頻率、圖層的基本概念） 案例1、案例2時(shí)間軸的作用 案例2幀的類(lèi)型（關(guān)鍵幀、空白關(guān)鍵幀、屬性關(guān)鍵幀、補(bǔ)間幀、靜態(tài)幀） 案例1、案例2幀的操作方法（插入幀、選擇幀、移動(dòng)復(fù)制粘貼幀、刪除幀、轉(zhuǎn)換幀、幀居中、繪圖紙工具的使用） 案例1、案例2圖層的屬性（圖層名

2、稱(chēng)的設(shè)置、圖層的類(lèi)型、輪廓顏色、圖層高度） 案例1、案例2圖層的操作（創(chuàng)建圖層、移動(dòng)、復(fù)制、展開(kāi)、折疊圖層、刪除圖層、重命名圖層、鎖定或者解鎖圖層）案例1、案例2圖層動(dòng)畫(huà)的制作（引導(dǎo)層動(dòng)畫(huà)、遮罩 動(dòng)畫(huà)的制作方法）案例1、案例2知識(shí)導(dǎo)航案例1：制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)3.13.1案例概述案例效果本案例主要應(yīng)用引導(dǎo)層的設(shè)置使瓢蟲(chóng)能按照指定的運(yùn)動(dòng)路徑進(jìn)行爬行，實(shí)現(xiàn)“瓢蟲(chóng)爬行”的動(dòng)畫(huà)效果。完成本案例能理解時(shí)間軸的基本概念，掌握幀的基本操作和引導(dǎo)層動(dòng)畫(huà)的制作方法。案例1制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)“瓢蟲(chóng)與綠葉”的效果案例分析制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)主要應(yīng)用創(chuàng)建新層、導(dǎo)入位圖、轉(zhuǎn)換為元件、時(shí)間軸中的幀、添加引導(dǎo)層、創(chuàng)建傳

3、統(tǒng)補(bǔ)間動(dòng)畫(huà)等知識(shí)來(lái)完成。通過(guò)本案例的制作，能夠深刻理解時(shí)間軸中“圖層與幀”的應(yīng)用方法。 相關(guān)知識(shí)1. 時(shí)間軸從本質(zhì)上講，F(xiàn)lash動(dòng)畫(huà)是以圖層為單位來(lái)進(jìn)行組織、以時(shí)間軸中的幀為主線來(lái)實(shí)現(xiàn)的。在“時(shí)間軸”面板上，影片中的“圖層”在時(shí)間軸左側(cè)的列中，每個(gè)層中包含的幀則顯示在該層名稱(chēng)右側(cè)的一行中。時(shí)間軸中的層與幀的功能如圖所示。案例1 繪制“五星紅旗”案例1制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)相關(guān)知識(shí)1. 時(shí)間軸（1）幀頻率幀頻率是動(dòng)畫(huà)播放的速度，以每秒播放的幀數(shù) (fps) 為度量單位。24 fps的幀速率是新Flash文檔的默認(rèn)設(shè)置，通常在Web上提供最佳效果。（2）幀的類(lèi)型Flash在時(shí)間軸中使用幀來(lái)組織和控

4、制文檔的內(nèi)容，在時(shí)間軸中放置幀的順序?qū)Q定幀內(nèi)對(duì)象在最終內(nèi)容中的顯示順序。關(guān)鍵幀：是指時(shí)間軸中其元件實(shí)例首次出現(xiàn)在舞臺(tái)上的幀?？瞻钻P(guān)鍵幀：空白關(guān)鍵幀是特殊的關(guān)鍵幀，以空心圓表示。它的作用是將前面的關(guān)鍵幀內(nèi)容清除掉，而使畫(huà)面的內(nèi)容變?yōu)榭瞻?，即使?dòng)畫(huà)中的對(duì)象消失掉。屬性關(guān)鍵幀：屬性關(guān)鍵幀是在補(bǔ)間范圍中為補(bǔ)間目標(biāo)對(duì)象顯示定義一個(gè)或多個(gè)屬性值的幀。定義的每個(gè)屬性都有它自己的屬性關(guān)鍵幀。補(bǔ)間幀：是作為補(bǔ)間動(dòng)畫(huà)的一部分的任何幀。Flash能補(bǔ)間，即自動(dòng)填充屬性關(guān)鍵幀之間的屬性值，以便生成流暢的動(dòng)畫(huà)。靜態(tài)幀：靜態(tài)幀也稱(chēng)為普通幀，顯示同一層上最后一個(gè)關(guān)鍵幀的內(nèi)容。在時(shí)間軸上關(guān)鍵幀必須始終在普通幀的前面。案例1

5、制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)相關(guān)知識(shí)1. 時(shí)間軸（3）圖層的屬性Flash CS6 Professional中的圖層具有多種不同的屬性。 名稱(chēng)：在此文本框中設(shè)置圖層的名稱(chēng)。顯示：設(shè)置圖層內(nèi)容是否顯示在場(chǎng)景中。鎖定：設(shè)置是否可以編輯層中的內(nèi)容，即圖層是否處于鎖定狀態(tài)。類(lèi)型：設(shè)置圖層的類(lèi)型。一般：設(shè)置該圖層為標(biāo)準(zhǔn)圖層，這是Flash默認(rèn)的圖層類(lèi)型。遮罩層：允許用戶(hù)把當(dāng)前層的類(lèi)型設(shè)置為遮罩層，這種類(lèi)型的層將遮掩與其相鏈接的任何層上的對(duì)象。 被遮罩：設(shè)置當(dāng)前層為被遮罩層，這意味著它必須鏈接到一個(gè)遮罩層上。只有該層在遮罩層或另一個(gè)鏈接的被遮罩層正下方時(shí)，該選項(xiàng)才可用。 文件夾：設(shè)置當(dāng)前圖層為圖層文件夾形式，將消

6、除該層包含的全部?jī)?nèi)容。引導(dǎo)層：設(shè)置該層為引導(dǎo)層，這種類(lèi)型的層可以引導(dǎo)與其相鏈接的被引導(dǎo)層中的過(guò)渡動(dòng)畫(huà)。被引導(dǎo)：設(shè)置該圖層為被引導(dǎo)層，即它被鏈接到運(yùn)動(dòng)引導(dǎo)層。只有當(dāng)該層在遮罩層或另一個(gè)被鏈接的被引導(dǎo)層正下方時(shí)，該選項(xiàng)才出現(xiàn)。輪廓顏色：用于設(shè)置該圖層上對(duì)象的輪廓顏色。圖層高度：可設(shè)置圖層的高度。案例1制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)相關(guān)知識(shí)2.幀的操作（1）在時(shí)間軸中插入幀在動(dòng)畫(huà)制作的時(shí)候，通常會(huì)制作跨越許多幀的靜態(tài)圖像或延長(zhǎng)動(dòng)畫(huà)，這就需要在這個(gè)層中插入更多的幀，使其在所有時(shí)間都被顯示。（2） 在時(shí)間軸中選擇幀在基于幀的選擇（默認(rèn)情況）中，可以在時(shí)間軸中選擇單個(gè)幀。在基于整體范圍的選擇中，在單擊一個(gè)關(guān)鍵幀到下

7、一個(gè)關(guān)鍵幀之間的任何幀時(shí)，整個(gè)幀序列都將被選中。（3） 復(fù)制、粘貼幀或幀序列選擇幀或序列并選擇“編輯”“時(shí)間軸”“復(fù)制幀”。選擇要替換的幀或序列，然后選擇“編輯”“時(shí)間軸”“粘貼幀”?；虬醋lt鍵再單擊，并將關(guān)鍵幀拖到要粘貼的位置。（4）刪除幀或幀序列選擇幀或序列并選擇“編輯”“時(shí)間軸”“刪除幀”或者右擊幀或序列，從上下文菜單中選擇“刪除幀”。案例1制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)相關(guān)知識(shí)2.幀的操作（5） 移動(dòng)關(guān)鍵幀或幀序列及其內(nèi)容將關(guān)鍵幀或序列拖到目標(biāo)位置。（6） 更改靜態(tài)幀序列的長(zhǎng)度在按住Ctrl鍵的同時(shí)向左或向右拖動(dòng)范圍的開(kāi)始或結(jié)束幀，可以更改靜態(tài)幀序列的長(zhǎng)度。（7） 將關(guān)鍵幀轉(zhuǎn)換為幀選擇關(guān)鍵幀

8、并選擇“編輯”“時(shí)間軸”“清除關(guān)鍵幀”或者右擊關(guān)鍵幀并從上下文菜單中選擇“清除關(guān)鍵幀”。（8） 幀居中在編輯狀態(tài)時(shí)，我們可以在時(shí)間軸上看到有一紅色的播放指針，它可以指示當(dāng)前所在幀。（9）“繪圖紙”功能：繪圖紙外觀。單擊該按鈕，將顯示播放指針?biāo)趲瑑?nèi)容的同時(shí)顯示其前后數(shù)幀的內(nèi)容。播放指針周?chē)鷷?huì)出現(xiàn)方括號(hào)形狀的標(biāo)記，其中所包含的幀都會(huì)顯示出來(lái)，這將有利于觀察不同幀之間的圖形變化過(guò)程。：繪圖紙外觀輪廓。單擊該按鈕，除當(dāng)前播放指針下的關(guān)鍵幀以原色顯示外，其他幀將顯示出對(duì)象的輪廓線。：編輯多個(gè)幀。單擊該按鈕，將顯示“洋蔥皮”標(biāo)記之間每一幀的內(nèi)容，使每一幀都可以編輯，而不管是不是當(dāng)前幀。案例1制作“瓢蟲(chóng)爬

9、行”動(dòng)畫(huà)相關(guān)知識(shí)案例1 繪制“五星紅旗”3. 鉛筆工具 使用鉛筆工具可以繪制線條和形狀，繪畫(huà)的方式與使用真實(shí)鉛筆大致相同。 案例1制作“瓢蟲(chóng)爬行”動(dòng)畫(huà)案例2：制作“遮罩文字”動(dòng)畫(huà)3.23.2案例概述案例效果本案例主要通過(guò)“文字工具”和遮罩動(dòng)畫(huà)完成“遮罩文字”的動(dòng)畫(huà)效果。案例2制作“遮罩文字”動(dòng)畫(huà)“遮罩文字”的效果案例分析創(chuàng)建簡(jiǎn)單“遮罩文字動(dòng)畫(huà)”的動(dòng)畫(huà)過(guò)程。通過(guò)本案例的制作，可以深刻理解時(shí)間軸中“圖層”的應(yīng)用方法，制作完成“遮罩文字”動(dòng)畫(huà)效果。相關(guān)知識(shí)1. 創(chuàng)建圖層或文件夾創(chuàng)建一個(gè)圖層或文件夾之后，該圖層或文件夾將出現(xiàn)在所選圖層的上方。新添加的圖層將成為活動(dòng)圖層。執(zhí)行下列操作之一：（1）單擊圖層

10、底部的“插入圖層”按鈕 或“新建文件夾”按鈕 。（2）右擊一個(gè)圖層名稱(chēng)，然后選擇快捷菜單中的“插入圖層”或“插入文件夾”。2. 選擇圖層或文件夾執(zhí)行下列操作之一：（1）單擊圖層或文件夾的名稱(chēng)。（2）單擊要選擇的圖層的任意一個(gè)幀或在舞臺(tái)中選擇要選擇的圖層上的一個(gè)對(duì)象。 （3）要選擇連續(xù)的幾個(gè)圖層或文件夾，可按住Shift鍵單擊它們的名稱(chēng)。（4）若要選擇幾個(gè)不連續(xù)的圖層或文件夾，可按住Ctrl鍵單擊時(shí)間軸中它們的名稱(chēng)。案例1 繪制“五星紅旗”案例2制作“遮罩文字”動(dòng)畫(huà)相關(guān)知識(shí)3. 移動(dòng)、展開(kāi)、折疊圖層或文件夾（1）要將圖層或文件夾移動(dòng)到文件夾中，可將該圖層或文件夾的名稱(chēng)拖到目標(biāo)文件夾的名稱(chēng)中。（2

11、）要更改圖層或文件夾的順序，可將一個(gè)或多個(gè)圖層或文件夾拖到所需位置。（3）要展開(kāi)或折疊文件夾或所有文件夾，可單擊該文件夾名稱(chēng)左側(cè)的三角形；或右擊，選擇快捷菜單中的“展開(kāi)所有文件夾”或“折疊所有文件夾”。4. 重命名圖層或文件夾養(yǎng)成良好的習(xí)慣，始終命名每個(gè)圖層，并為圖層指定一個(gè)有意義的名稱(chēng)，以指示該圖層上內(nèi)容的類(lèi)型。5. 復(fù)制圖層或文件夾（1）要復(fù)制圖層或文件夾的內(nèi)容，可選擇圖層或文件夾。然后選擇“編輯”“時(shí)間軸”“復(fù)制幀”。（2）單擊新圖層，然后選擇“編輯”“時(shí)間軸”“粘貼幀”，便可將圖層或文件夾的內(nèi)容復(fù)制了。案例2制作“遮罩文字”動(dòng)畫(huà)相關(guān)知識(shí)6. 刪除圖層或文件夾要選擇圖層或文件夾，可以單擊

12、該圖層或圖層文件夾的名稱(chēng)，或者單擊圖層中的任意一個(gè)幀。執(zhí)行下列操作之一：（1）單擊時(shí)間軸中的“刪除圖層”按鈕 或?qū)D層或文件夾拖到“刪除圖層”按鈕 。（2）右擊該圖層或文件夾的名稱(chēng)，然后選擇快捷菜單中的“刪除圖層”或“刪除文件夾”。7. 鎖定或解鎖一個(gè)或多個(gè)圖層或文件夾（1）要鎖定圖層或文件夾，可以單擊該圖層或文件夾名稱(chēng)右側(cè)的“鎖定”列。要解鎖該圖層或文件夾，可再次單擊“鎖定”列。（2）要鎖定所有圖層和文件夾，可以單擊掛鎖圖標(biāo)。要解鎖所有圖層和文件夾，可再次單擊它。（3）要鎖定或解鎖多個(gè)圖層或文件夾，可以在“鎖定”列中拖動(dòng)。（4）若要鎖定所有其他圖層或文件夾，可以按住Alt鍵單擊圖層或文件夾名

13、稱(chēng)右側(cè)的“鎖定”列。要解鎖所有圖層或文件夾，可再次按住Alt鍵單擊“鎖定”列。案例2制作“遮罩文字”動(dòng)畫(huà)相關(guān)知識(shí)8. 圖層的輪廓在對(duì)象編輯中，通過(guò)顯示對(duì)象為輪廓的方法，方便地察看對(duì)象。在線框模式下，該層的所有對(duì)象都以一種顏色顯示。圖層輪廓的顏色可在“圖層屬性”中自行設(shè)置，也可以由Flash以隨機(jī)的方式給圖層分配一種輪廓顏色。每個(gè)對(duì)象的輪廓顏色和其所在圖層右側(cè)的“將所有圖層顯示為輪廓”圖標(biāo) 的顏色相同。調(diào)出輪廓顯示的方法如下：（1）單擊圖層名稱(chēng)右邊的顯示模式欄即可將圖層轉(zhuǎn)換為輪廓模式；再次單擊顯示模式欄則取消輪廓模式。（2）單擊“顯示所有圖層的輪廓”圖標(biāo) ，可以將所有圖層以輪廓模式顯示；再次單擊

14、輪廓模式圖標(biāo)則取消輪廓模式。案例2制作“遮罩文字”動(dòng)畫(huà)本章小結(jié)案例1 繪制“五星紅旗”本章全面介紹了圖層、時(shí)間軸、幀等有關(guān)術(shù)語(yǔ)。介紹了圖層的屬性、圖層與幀的操作方法，還介紹了圖層的管理、圖層的編輯，并通過(guò)“引導(dǎo)層動(dòng)畫(huà)”及“遮罩層動(dòng)畫(huà)”案例的制作，進(jìn)一步熟悉了動(dòng)畫(huà)制作中圖層與時(shí)間軸的功能及用法，為后面動(dòng)畫(huà)的制作奠定了堅(jiān)實(shí)的基礎(chǔ)。本 章 小 結(jié)思考與練習(xí)案例1 繪制“五星紅旗”1. 什么是圖層？圖層的作用是什么？圖層有幾種？怎樣編輯圖層？2. 結(jié)合前面所學(xué)內(nèi)容練習(xí)圖層、普通引導(dǎo)層與運(yùn)動(dòng)引導(dǎo)層的轉(zhuǎn)換。3. 結(jié)合所講內(nèi)容，練習(xí)制作一個(gè)應(yīng)用文字作為遮罩層的例子。思 考 與 練 習(xí)拓展訓(xùn)練案例1 繪制“五星紅旗”訓(xùn)練1：制作“跳動(dòng)的小球”動(dòng)畫(huà)任務(wù)要求：創(chuàng)建“球”元件，制作球上下跳動(dòng)的效果。要求如下：1.設(shè)置舞臺(tái)的大小為500400像素。2.繪制一個(gè)“球”并轉(zhuǎn)換為圖形元件。3.制作小球上下彈跳的補(bǔ)間動(dòng)畫(huà)。4.創(chuàng)建“小球陰影”的圖形元件，通過(guò)調(diào)整Alp