《二維flash動(dòng)畫制作》第4章 基本動(dòng)畫的制作

第2部分強(qiáng)化篇——讓對象動(dòng)起來第4章基本動(dòng)畫的制作4.1Flash動(dòng)畫概述4.2逐幀動(dòng)畫的制作4.3補(bǔ)間動(dòng)畫的制作4.4補(bǔ)間形狀動(dòng)畫的制作4.5傳統(tǒng)補(bǔ)間動(dòng)畫的制作4.6上機(jī)實(shí)習(xí)4.1Flash動(dòng)畫概述4.1.1幀

4.1.2圖層

4.1.1幀1、什么是幀二維動(dòng)畫的基本原理是每秒鐘播放24幅（格）圖像，這是由人眼的生理特點(diǎn)決定的，因?yàn)槿搜勰軌蚍直娴淖疃虝r(shí)間差異是0.15秒，所以當(dāng)時(shí)間相隔很小的兩幅變化很小的畫面先后閃過人眼時(shí)，視覺是察覺不出來的。由于每兩格之間的畫面差異很小，這樣一系列的畫面串起來后就形成了動(dòng)態(tài)視覺效果，這也是Flash動(dòng)畫的基本原理。幀是構(gòu)成Flash動(dòng)畫的基本單位，在播放Flash動(dòng)畫時(shí)，會依次顯示每一幀的內(nèi)容，所以也可以將幀看做是Flash動(dòng)畫中按照規(guī)定時(shí)間速率停留時(shí)間最短的畫面。如圖4.1所示，【時(shí)間軸】面板上每一個(gè)小格便代表一幀。圖4.1【時(shí)間軸】面板上每一個(gè)小格便是一幀F(xiàn)lash影片放映速度的單位是幀每秒（fps：即每秒播放多少幀）。在舞臺上的空白區(qū)域單擊，我們便可以在窗口右側(cè)的【屬性】面板查看到當(dāng)前Flash文檔的幀頻，如圖4.2所示。FlashCS4默認(rèn)的幀頻是24，當(dāng)然我們可以根據(jù)需要進(jìn)行修改，幀頻越高，影片播放越快，也越流暢、逼真。Flash能支持的最快的幀頻為120fps。2、幀的類型幀主要有三種類型：普通幀、關(guān)鍵幀和過渡幀。其中關(guān)鍵幀又分為空白關(guān)鍵幀和關(guān)鍵幀，普通幀也分為普通幀和空白幀。幀類型的識別：如圖4.3所示便為時(shí)間軸上表現(xiàn)出的不同類型的幀。圖4.2【屬性】面板中設(shè)置幀頻關(guān)鍵幀：在Flash中，要表現(xiàn)動(dòng)畫的運(yùn)動(dòng)變化，一般都需要兩個(gè)不同的關(guān)鍵畫面，這兩個(gè)關(guān)鍵畫面即為關(guān)鍵幀。過渡幀：在兩個(gè)關(guān)鍵幀之間，計(jì)算機(jī)自動(dòng)完成的過渡畫面的幀稱為過渡幀。關(guān)鍵幀與過渡幀的區(qū)別：過渡幀從屬于關(guān)鍵幀，過渡幀的前后都肯定有關(guān)鍵幀，但是兩個(gè)關(guān)鍵幀的中間卻可以沒有過渡幀。當(dāng)修改關(guān)鍵幀時(shí)，系統(tǒng)自動(dòng)修改過渡幀，但是過渡幀無法修改該幀的內(nèi)容。圖4.3幀類型的識別3、幀的操作我們在Flash中經(jīng)常需要對幀進(jìn)行選擇、移動(dòng)、插入、刪除等操作。選擇幀：將鼠標(biāo)移動(dòng)到時(shí)間軸的幀上，當(dāng)鼠標(biāo)指針為白色箭頭時(shí)，如果單擊便可選中一個(gè)幀；如果在幀區(qū)域上拖動(dòng)鼠標(biāo)便可選擇多個(gè)幀。當(dāng)我們單擊層時(shí)，層上的的所有幀對象便被選擇。提示：按住鍵盤上的Ctrl鍵同時(shí)分別單擊要選的幀，可以選擇多個(gè)不連續(xù)的幀。按住Shift鍵同時(shí)分別單擊要選的兩幀，期間的所有幀均被選擇。移動(dòng)幀：當(dāng)鼠標(biāo)指針選擇了需要的幀，鼠標(biāo)右下角出現(xiàn)一個(gè)矩形框，按下鼠標(biāo)左鍵不放，拖動(dòng)選擇的幀便可移動(dòng)幀。插入幀：首先選擇要插入幀的位置，然后單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇“插入幀”即可，同理可以插入關(guān)鍵幀、空白關(guān)鍵幀。插入幀就是延長前一關(guān)鍵幀的內(nèi)容，而插入關(guān)鍵幀是將前一關(guān)鍵幀的內(nèi)容復(fù)制到新插入的關(guān)鍵幀中。刪除幀：選擇要?jiǎng)h除的幀后，單擊鼠標(biāo)右鍵，選擇“刪除幀”即可。4.1.2圖層1、理解圖層使用過圖像編輯軟件的讀者對圖層的概念應(yīng)該不會陌生。圖層是位于舞臺的透明畫布，在透明的圖層上既可繪制圖像，也可構(gòu)思動(dòng)畫。由于圖層是透明的，所以各個(gè)圖層之間的動(dòng)畫不會互相影響，各圖層相互重疊區(qū)域?qū)?yōu)先顯示上方圖層的內(nèi)容。在創(chuàng)建動(dòng)畫時(shí)，可以使用圖層和圖層文件夾來組織動(dòng)畫序列的組件和分離動(dòng)畫對象，這樣它們就不會相互擦除、相連或分割。如果要讓Flash一次創(chuàng)建多個(gè)組或元件的動(dòng)畫，每個(gè)組或元件就必須放置在獨(dú)立的圖層上。2、圖層的編輯插入圖層：用鼠標(biāo)單擊【時(shí)間軸】面板左下方的“新建圖層”按鈕，便可在當(dāng)前選擇的圖層上方新建一個(gè)圖層。刪除圖層：選中要?jiǎng)h除的圖層，單擊【時(shí)間軸】面板左下方的“刪除”按鈕便可刪除當(dāng)前選中圖層。如圖4.4所示。更改圖層名稱：雙擊圖層的名稱，即可進(jìn)入名稱編輯狀態(tài)并修改圖層的名稱，如圖4.5所示。圖4.5修改圖層名稱更改圖層順序：選擇要更換順序的圖層，按下鼠標(biāo)左鍵不放將其拖動(dòng)到適當(dāng)位置后釋放鼠標(biāo)即可，如圖4.6所示。圖4.4新建與刪除圖層圖4.5修改圖層名稱4.6將云朵圖層移至草地圖層上方隱藏圖層：單擊圖層面板的眼睛圖標(biāo)，可以看到所有圖層的眼睛列都增加了一個(gè)不可見標(biāo)識，表明隱藏了所有圖層；再次單擊眼睛圖標(biāo)，不可見標(biāo)識消失，圖層均可見。如果單擊某個(gè)圖層右側(cè)的眼睛列，可以看到只有當(dāng)前圖層的眼睛列增加了一個(gè)不可見標(biāo)識，表明只有該圖層被隱藏；再次單擊眼睛列，顯示該圖層。鎖定圖層：單擊圖層面板的鎖定圖標(biāo)；可以看到所有圖層的鎖定列都增加了一個(gè)鎖定圖標(biāo)，表明鎖定了所有圖層（被鎖定的圖層內(nèi)所有內(nèi)容都不可編輯）；再次單擊鎖定圖標(biāo)可以解除鎖定（解除鎖定后的圖層內(nèi)容才可編輯）。如果單擊某個(gè)圖層右側(cè)的鎖定列，可以看到只有當(dāng)前圖層的鎖定列增加了一個(gè)鎖定圖標(biāo)，表明只有該圖層被鎖定，再次單擊鎖定列，解除鎖定。4.2逐幀動(dòng)畫的制作4.2.1逐幀動(dòng)畫的創(chuàng)建

4.2.2實(shí)踐與練習(xí)：漂亮的圣誕樹4.2.1逐幀動(dòng)畫的創(chuàng)建逐幀動(dòng)畫通過更改每一個(gè)關(guān)鍵幀中的舞臺內(nèi)容來創(chuàng)建動(dòng)畫，最適合于復(fù)雜的動(dòng)畫。逐幀動(dòng)畫會明顯增加文件的大小。要?jiǎng)?chuàng)建逐幀動(dòng)畫，需要將每個(gè)幀都定義為關(guān)鍵幀，然后給每個(gè)關(guān)鍵幀創(chuàng)建不同的圖像。1、繪制矢量逐幀動(dòng)畫如圖4.7所示的“快樂的老頭”動(dòng)畫就是一個(gè)逐幀動(dòng)畫，它的創(chuàng)作方法很簡單，但是每一個(gè)關(guān)鍵幀都需要繪制或修改圖像，做起來很繁瑣，但是效果很精致。具體制作方法如下。圖4.7快樂的老頭在時(shí)間軸的當(dāng)前圖層內(nèi)每隔兩幀插入一個(gè)關(guān)鍵幀，一共插入8個(gè)關(guān)鍵幀，如圖4.8所示。（如果依次插入關(guān)鍵幀動(dòng)畫速度會非?？?，我們經(jīng)常通過調(diào)整關(guān)鍵幀之間的間隔來更改動(dòng)畫的速度）依次在每個(gè)關(guān)鍵幀中繪制相應(yīng)的動(dòng)作片段圖像，最后完成后測試動(dòng)畫。2、導(dǎo)入序列圖像新建一個(gè)Flash文檔后，選擇“文件/導(dǎo)入/導(dǎo)入到舞臺”菜單命令，選擇光盤上的GIF動(dòng)畫圖像“micky.gif”導(dǎo)入。這時(shí)可見在時(shí)間軸上自動(dòng)創(chuàng)建了12個(gè)關(guān)鍵幀，舞臺上自動(dòng)形成了動(dòng)畫序列。測試動(dòng)畫，可以發(fā)現(xiàn)動(dòng)畫完整流暢，與我們使用看圖軟件打開“micky.gif”圖像時(shí)看到的動(dòng)畫相同。但是細(xì)心的讀者會發(fā)現(xiàn)舞臺上形成的動(dòng)畫序列位于舞臺的左上角，那么如何將整個(gè)動(dòng)畫放置在舞臺中央處呢？解決方法為選擇【時(shí)間軸】面板下方的“編輯多個(gè)幀”按鈕，這時(shí)在幀刻度處調(diào)整編輯輪廓從第1幀延續(xù)到最后一幀，如圖4.9所示，此時(shí)可以看到舞臺上每一幀的內(nèi)容。使用選擇工具框選舞臺所有內(nèi)容后將所有圖像一起移動(dòng)至舞臺中央即可。圖4.8創(chuàng)建8個(gè)關(guān)鍵幀圖4.9元件編輯模式的舞臺提示：以上方法對于導(dǎo)入swf格式的動(dòng)畫文件、jpg、png等格式的靜態(tài)連續(xù)圖片同樣適用。4.2.2實(shí)踐與練習(xí)：漂亮的圣誕樹這里我們通過動(dòng)畫“漂亮的圣誕樹”的制作，讓讀者掌握逐幀動(dòng)畫的制作方法、圖層的操作以及幀的編輯。1、新建一個(gè)Flash文檔，文檔尺寸保持默認(rèn)，背景顏色設(shè)置為黑色，F(xiàn)PS更改為12。首先利用工具欄在舞臺上繪制一個(gè)如圖4.10所示的圣誕樹。2、更改圖層1的名稱為“圣誕樹”，選擇圖層1的第12幀后單擊鼠標(biāo)右鍵，選擇“插入幀”命令，延長該圖層內(nèi)容至12幀，可以鎖定“圣誕樹”圖層防止誤操作。3、在圖層1上方新建一個(gè)圖層2，更改圖層2的名稱為“霓虹燈”，利用刷子工具在圣誕樹上繪制六個(gè)閉合的圓圈，如圖4.11所示。4、打開“顏色”面板，選擇從淺橙色至深橙色的輻射狀漸變，選擇顏料桶工具為圓圈噴涂上漸變色。圖4.10繪制的圣誕樹圖4.11繪制6個(gè)圓圈5、選擇第3幀，按下鍵盤上的F6鍵即可插入一個(gè)關(guān)鍵幀，選擇六個(gè)圓圈的漸變色后在“顏色”面板中將漸變色修改為淺粉色至深粉色的輻射狀漸變。同理在第5、7、9、11幀插入關(guān)鍵幀并改變圓圈內(nèi)的漸變顏色，如圖4.12所示。6、測試并保存動(dòng)畫圖4.12制作逐幀動(dòng)畫4.3補(bǔ)間動(dòng)畫的制作補(bǔ)間動(dòng)畫是Flash中最常用的一種動(dòng)畫效果，它可以被稱為“漸變動(dòng)畫”。要?jiǎng)?chuàng)建補(bǔ)間動(dòng)畫，只需要建立起始和結(jié)束的畫面即可，中間的部分由Flash軟件自動(dòng)計(jì)算生成漸變動(dòng)畫，省去了復(fù)雜的中間制作過程。這樣制作的動(dòng)畫，也最大程度上減小了文件的大小。在以前版本的Flash中包含了形狀補(bǔ)間動(dòng)畫和動(dòng)作補(bǔ)間動(dòng)畫，而FlashCS4中新增了一種新的補(bǔ)間動(dòng)畫，讓動(dòng)畫的制作更加簡單。我們現(xiàn)在將三種主要的補(bǔ)間動(dòng)畫給大家簡單介紹一下：補(bǔ)間動(dòng)畫：新增的動(dòng)畫類型，在制作過程中可以自動(dòng)將選中的對象轉(zhuǎn)換為元件，如圖4.13所示。它的制作相對傳統(tǒng)補(bǔ)間更加快速，而且可以通過修改線條來修改補(bǔ)間運(yùn)動(dòng)軌跡。補(bǔ)間形狀：以前版本也稱為形狀補(bǔ)間動(dòng)畫，主要應(yīng)用于不同形狀之間的過渡變化，例如從星型到圓形的變化，從黑色到白色的變化等等。傳統(tǒng)補(bǔ)間：以前版本也稱為動(dòng)作補(bǔ)間動(dòng)畫，制作的主體為元件的實(shí)例，并且起始和結(jié)束的關(guān)鍵幀必須放置的是同一個(gè)實(shí)例。涉及實(shí)例的縮放、位移、傾斜以及色調(diào)變化圖4.13“將所選的內(nèi)容轉(zhuǎn)換為元件進(jìn)行補(bǔ)間”對話框4.3.1補(bǔ)間動(dòng)畫1、制作方法在Flash時(shí)間軸上選擇或者插入一個(gè)關(guān)鍵幀用于添加一個(gè)對象，然后在該幀上單擊鼠標(biāo)右鍵，選擇“創(chuàng)建補(bǔ)間動(dòng)畫”命令。在需要變化的幀上修改對象后，計(jì)算機(jī)會自動(dòng)在該幀上產(chǎn)生關(guān)鍵幀。補(bǔ)間動(dòng)畫可以實(shí)現(xiàn)元件的形變、位移、色調(diào)、漸變等效果，并由補(bǔ)間自動(dòng)生成動(dòng)畫，運(yùn)動(dòng)軌跡是可以調(diào)整的。補(bǔ)間動(dòng)畫一旦建立后，相應(yīng)的【時(shí)間軸】面板的背景色會變成藍(lán)色，初始幀顯示為黑色圓點(diǎn)，其它關(guān)鍵幀顯示為黑色菱形點(diǎn)。如圖4.14所示。2、注意事項(xiàng)當(dāng)構(gòu)成補(bǔ)間動(dòng)畫的對象是位圖、形狀、組合等時(shí)，創(chuàng)建補(bǔ)間動(dòng)畫的時(shí)候會自動(dòng)將他們轉(zhuǎn)換為元件；當(dāng)構(gòu)成補(bǔ)間動(dòng)畫的對象是元件的一個(gè)實(shí)例時(shí)，將直接創(chuàng)建補(bǔ)間動(dòng)畫；當(dāng)構(gòu)成補(bǔ)間動(dòng)畫的對象是多個(gè)元素時(shí)，在創(chuàng)建補(bǔ)間動(dòng)畫的同時(shí)都會將這些對象組合起來創(chuàng)建成一個(gè)元件，并生成補(bǔ)間。創(chuàng)建補(bǔ)間動(dòng)畫需要在舞臺上有內(nèi)容，所以空白關(guān)鍵幀是沒法創(chuàng)建補(bǔ)間動(dòng)畫的。補(bǔ)間動(dòng)畫不支持兩個(gè)關(guān)鍵幀之間的補(bǔ)間，只能在一個(gè)關(guān)鍵幀中創(chuàng)建修改，并且補(bǔ)間動(dòng)畫還包含了3D動(dòng)畫的功能。圖4.14創(chuàng)建補(bǔ)間動(dòng)畫后的【時(shí)間軸】面板圖4.15不同情況下創(chuàng)建補(bǔ)間動(dòng)畫產(chǎn)生的動(dòng)畫長度當(dāng)【時(shí)間軸】面板上只有一個(gè)關(guān)鍵幀，并且該關(guān)鍵幀內(nèi)容沒有被延長時(shí)，創(chuàng)建的補(bǔ)間動(dòng)畫幀數(shù)與該文檔的幀頻相同；當(dāng)在關(guān)鍵幀后插入了普通幀延長后，創(chuàng)建的補(bǔ)間動(dòng)畫幀數(shù)將依據(jù)實(shí)際幀數(shù)，如圖4.15所示。當(dāng)然這些默認(rèn)產(chǎn)生的幀數(shù)是可以更改的，將鼠標(biāo)定位在動(dòng)畫最后一幀，當(dāng)鼠標(biāo)成狀時(shí)，拖動(dòng)鼠標(biāo)便可以改變幀數(shù)。3、補(bǔ)間動(dòng)畫的【屬性】面板當(dāng)我們建立了一個(gè)補(bǔ)間動(dòng)畫后，單擊幀便會出現(xiàn)如圖4.16所示的【屬性】面板?！狙a(bǔ)間動(dòng)畫】名稱項(xiàng)：用于給補(bǔ)間動(dòng)畫取一個(gè)實(shí)例名稱，主要在編寫動(dòng)作腳本時(shí)用到。【緩動(dòng)】項(xiàng)：取值范圍為-100—100，設(shè)置動(dòng)畫的加速度。當(dāng)為負(fù)值時(shí)動(dòng)畫加速運(yùn)動(dòng)，-100時(shí)最快；當(dāng)為正值時(shí)動(dòng)畫減速運(yùn)動(dòng)，100時(shí)最慢。當(dāng)為0時(shí)勻速運(yùn)動(dòng)?！拘D(zhuǎn)】項(xiàng)：“旋轉(zhuǎn)”后面可以設(shè)置旋轉(zhuǎn)的次數(shù)；“+”后可以設(shè)置其它旋轉(zhuǎn)的角度；【方向】項(xiàng)：設(shè)置旋轉(zhuǎn)是按照順時(shí)針方向還是逆時(shí)針方向?！菊{(diào)整到路徑】項(xiàng)：一旦選中后，會將旋轉(zhuǎn)應(yīng)用到路徑，設(shè)置的旋轉(zhuǎn)和其它旋轉(zhuǎn)將會失效恢復(fù)到初始狀態(tài)，元件符合路徑運(yùn)動(dòng)。提示：當(dāng)旋轉(zhuǎn)設(shè)置為順時(shí)針1次，“+”設(shè)置為20°，最后旋轉(zhuǎn)的度數(shù)為380°?！韭窂健宽?xiàng)：“X”值用于舞臺中路徑的橫向調(diào)整（正值向右移動(dòng)，負(fù)值向左移動(dòng)）；“Y”值用于舞臺中路徑的縱向調(diào)整（正值向下移動(dòng)，負(fù)值向上移動(dòng)）；“高度”用于調(diào)整補(bǔ)間路徑的整體高度（取值范圍1—9999）；“寬度”用于調(diào)整路徑的整體寬度；將高度與寬度鎖定在一起，調(diào)整寬或高中任意數(shù)值將會成比例放大或縮小?！就綀D形元件】項(xiàng)：勾選此項(xiàng)所做的調(diào)整會同步到元件上。圖4.16補(bǔ)間動(dòng)畫【屬性】面板4.3.2實(shí)踐與練習(xí)：文字飛入動(dòng)畫這里我們通過“文字飛入”動(dòng)畫的制作，讓讀者掌握補(bǔ)間動(dòng)畫的制作方法。1、新建一個(gè)Flash文檔，利用文本工具在舞臺輸入為本“TEXT”，設(shè)置字體為“HoboStd”，大小為48，顏色為橙色。選中字體后，在【屬性】面板“濾鏡”區(qū)域單擊左下方的“添加濾鏡”按鈕，在彈出的菜單中選擇“投影”，如圖4.17所示。圖4.17添加投影濾鏡圖4.18字體樣式2、這時(shí)得到的字體如圖4.18所示，為制造飛入效果，將文字移動(dòng)到舞臺外面，作為初始位置。在第1幀單擊鼠標(biāo)右鍵，選擇“創(chuàng)建補(bǔ)間動(dòng)畫”命令，即創(chuàng)建了一個(gè)24幀的補(bǔ)間動(dòng)畫（FPS為24），將鼠標(biāo)移動(dòng)到最后一幀，當(dāng)鼠標(biāo)成狀時(shí)，拖動(dòng)鼠標(biāo)至60幀的位置，此時(shí)動(dòng)畫延長至60幀。3、我們選擇60幀，水平拖動(dòng)文字到舞臺外右側(cè)，如圖4.19所示。圖4.19文字的起始和終點(diǎn)位置4、選擇第30幀，將文字垂直拖動(dòng)到舞臺下方，這時(shí)可見路徑上多了一個(gè)錨點(diǎn)，此錨點(diǎn)為角點(diǎn)。選擇轉(zhuǎn)換錨點(diǎn)工具拖動(dòng)該錨點(diǎn)，調(diào)整路徑的樣式如圖4.20所示。5、保存并測試文件。圖4.20在30幀處修改路徑4.4補(bǔ)間形狀動(dòng)畫的制作4.4.1補(bǔ)間形狀動(dòng)畫4.4.2實(shí)踐與練習(xí)：氣球變禮帽動(dòng)畫

4.4.3使用形狀提示

4.4.1補(bǔ)間形狀動(dòng)畫1、制作方法在Flash中，在一個(gè)關(guān)鍵幀上繪制一個(gè)形狀（不能是組合或者元件），然后在另一個(gè)關(guān)鍵幀上修改或另外繪制一個(gè)形狀，此時(shí)創(chuàng)建補(bǔ)間形狀后Flash會自動(dòng)根據(jù)繪制好的幀中的值或形狀來創(chuàng)建動(dòng)畫。補(bǔ)間形狀動(dòng)畫建立后，【時(shí)間軸】面板相應(yīng)部分的背景色會變成淺綠色，在起始幀和結(jié)束幀之間會出現(xiàn)一條長長的箭頭表明動(dòng)畫創(chuàng)建成功，如圖4.21所示。2、補(bǔ)間形狀動(dòng)畫的【屬性】面板：當(dāng)我們建立了一個(gè)補(bǔ)間形狀動(dòng)畫后，單擊幀便會出現(xiàn)如圖4.22所示的【屬性】面板?！揪弰?dòng)】項(xiàng)：上一節(jié)我們已經(jīng)講到過，不再贅述?！净旌稀宽?xiàng)：有“分布式”和“角形”兩個(gè)選擇。選擇“分布式”選項(xiàng)，所創(chuàng)建動(dòng)畫中的補(bǔ)間形狀比較平滑，并且不規(guī)則；選擇“角形”選項(xiàng)，所創(chuàng)建動(dòng)畫中補(bǔ)間形狀保留明顯的直線和角。圖4.21創(chuàng)建補(bǔ)間形狀動(dòng)畫后的【時(shí)間軸】面板圖4.22補(bǔ)間形狀動(dòng)畫【屬性】面板4.4.2實(shí)踐與練習(xí)：氣球變禮帽動(dòng)畫這里我們通過“氣球變禮帽”動(dòng)畫的制作，讓讀者掌握補(bǔ)間形狀動(dòng)畫的制作方法。1、新建一個(gè)Flash文檔，利用工具欄中的繪圖工具在第一幀繪制一個(gè)氣球，效果如圖4.22所示。2、選擇第40幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選中“插入空白關(guān)鍵幀”，利用繪圖工具在該幀中繪制一頂禮帽，回到第1幀，單擊鼠標(biāo)右鍵，選擇“創(chuàng)建補(bǔ)間形狀”，這時(shí)可以看到【時(shí)間軸】面板相應(yīng)部分的背景色變成了淺綠色，而且起始幀與結(jié)束幀之間會出現(xiàn)一個(gè)箭頭。效果如圖4.23所示。3、測試并保存動(dòng)畫。圖4.23起始幀的繪制的氣球4.4.3使用形狀提示圖4.24結(jié)束幀的繪制的禮帽從上面的例子可以看出來，補(bǔ)間形狀動(dòng)畫制作起來很簡單，但是中間的變化是由計(jì)算機(jī)自己控制，所以有時(shí)變化十分的混亂和奇怪，尤其是起始和結(jié)束幀的形狀差距很大的時(shí)候。如果想在變形的過程中控制變形的形式，就需要用到形狀提示的功能，此功能能夠控制變形的關(guān)鍵點(diǎn)，從而對補(bǔ)間形狀動(dòng)畫的變形進(jìn)行有效地控制。1、添加形狀提示只需要在起始幀和結(jié)束幀的對象中添加相互對應(yīng)的控制點(diǎn)便可控制變形的整個(gè)過程?，F(xiàn)在我們將以一個(gè)翻頁動(dòng)畫為例，講解添加形狀提示的方法：首先創(chuàng)建一個(gè)“背景”圖層，用于繪制書頁的背景。在“背景”圖層上新建一個(gè)“翻頁”圖層，在起始幀繪制好左側(cè)的書頁，在結(jié)束幀插入關(guān)鍵幀，選擇左側(cè)書頁后利用任意變形工具將其水平拖放到右側(cè)，制造右側(cè)書頁的樣式，創(chuàng)建好補(bǔ)間形狀動(dòng)畫，如圖4.25所示。在補(bǔ)間形狀動(dòng)畫的初始幀上選擇圖形對象,選擇“修改/形狀/添加形狀提示”菜單命令，在補(bǔ)間形狀動(dòng)畫的初始幀會出現(xiàn)一個(gè)帶字母的紅色圓圈。在結(jié)束幀也會同樣出現(xiàn)一個(gè)提示圓圈，圓圈內(nèi)的字母與初始幀相同。選擇動(dòng)畫的初始幀，用鼠標(biāo)選中提示圓圈將其拖放到第一個(gè)控制點(diǎn)上（最好放置在形狀邊緣線或者角點(diǎn)處）。然后選擇動(dòng)畫的結(jié)束幀，用鼠標(biāo)選中提示圓圈將其拖放到與初始幀相對應(yīng)的位置。如果安放成功，系統(tǒng)會給你相應(yīng)的提示，初始幀的圓圈由紅色變成黃色，結(jié)束幀上的圓圈變成綠色；如果安放不成功或者不在一條曲線上時(shí)，提示圓圈的顏色不變，如圖4.26所示。重復(fù)為書頁的每個(gè)角點(diǎn)添加調(diào)整形狀提示，以控制動(dòng)畫的變形過程，得到最后的效果如圖4.27所示。預(yù)覽動(dòng)畫，可以看到此動(dòng)畫在控制之下實(shí)現(xiàn)了翻頁的效果，運(yùn)動(dòng)軌跡如圖4.28所示。圖4.25修改右側(cè)書頁的樣式圖4.26調(diào)整位置后的起始幀和結(jié)束幀的形狀提示提示：添加形狀提示時(shí)，按照一個(gè)方向進(jìn)行放置時(shí)工作效果最好，例如按照逆時(shí)針方向放置或者順時(shí)針方向放置。圖4.27設(shè)置好所有形狀提示的起始幀和結(jié)束幀圖4.28翻頁動(dòng)畫運(yùn)動(dòng)軌跡4.5傳統(tǒng)補(bǔ)間動(dòng)畫的制作4.5.1傳統(tǒng)補(bǔ)間動(dòng)畫

4.5.2實(shí)踐與練習(xí)一：夏日海景動(dòng)畫4.5.3實(shí)踐與練習(xí)二：小球自由落體動(dòng)畫

4.5.1傳統(tǒng)補(bǔ)間動(dòng)畫1、制作方法在Flash中，在前后兩個(gè)關(guān)鍵幀上放置同一個(gè)元件，然后在其中一個(gè)關(guān)鍵幀中改變此元件的顏色、大小、位置、透明度等，F(xiàn)lash會自動(dòng)根據(jù)這兩幀中元件的區(qū)別創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫。建立傳統(tǒng)補(bǔ)間動(dòng)畫后，【時(shí)間軸】面板相應(yīng)部分的背景色會變成淺紫色，在起始幀和結(jié)束幀之間會出現(xiàn)一條長長的箭頭表明動(dòng)畫創(chuàng)建成功，如圖4.29所示。2、傳統(tǒng)補(bǔ)間動(dòng)畫的【屬性】面板當(dāng)我們建立了一個(gè)傳統(tǒng)補(bǔ)間動(dòng)畫后，單擊幀便會出現(xiàn)如圖4.30所示的【屬性】面板。【緩動(dòng)】項(xiàng)：前面我們已經(jīng)講到過，不再贅述?！拘D(zhuǎn)】項(xiàng)：有“無”、“自動(dòng)”、“順時(shí)針”、“逆時(shí)針”四個(gè)選項(xiàng)，其中“無”為禁止元件旋轉(zhuǎn)；“自動(dòng)”使元件在一定方向上旋轉(zhuǎn)一次；“順時(shí)針”和“逆時(shí)針”可以指定旋轉(zhuǎn)的方向，并且可以在后面設(shè)置旋轉(zhuǎn)的圈數(shù)?！举N緊】項(xiàng)：選擇此項(xiàng)，對于補(bǔ)間的調(diào)整都會對我們添加的參考線進(jìn)行貼緊。【調(diào)整到路徑】項(xiàng)：主要用于引導(dǎo)線動(dòng)畫，選擇此項(xiàng)后會將補(bǔ)間元素的基線調(diào)整到運(yùn)動(dòng)路徑?！就健宽?xiàng)：選擇此項(xiàng)，可使元件實(shí)例的動(dòng)畫與主時(shí)間軸同步?！究s放】項(xiàng)：可根據(jù)元件的注冊點(diǎn)將補(bǔ)間元素附加到運(yùn)動(dòng)路徑。圖4.29創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫后的【時(shí)間軸】面板圖4.30傳統(tǒng)補(bǔ)間動(dòng)畫【屬性】面板

4.5.2實(shí)踐與練習(xí)一：夏日海景動(dòng)畫這里我們通過“夏日海景”動(dòng)畫的制作，讓讀者掌握傳統(tǒng)補(bǔ)間動(dòng)畫的制作方法以及如何通過【屬性】面板控制動(dòng)畫的播放。1、新建一個(gè)Flash文檔，將圖層1命名為“背景”，利用工具欄的繪圖工具在舞臺上繪制如圖4.31所示的海景，延長至120幀。2、鎖定背景層，在“背景”圖層上方新建一個(gè)圖層，命名為“太陽”，利用繪圖工具繪制好太陽后，調(diào)整好大小和方位，選擇太陽轉(zhuǎn)換為圖形元件，在第120幀處插入關(guān)鍵幀，回到第1幀創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫，在【屬性】面板中將“旋轉(zhuǎn)”設(shè)置為順時(shí)針1次。3、鎖定“太陽”層，在“背景”層上方新建一個(gè)圖層，命名為“帆船”，利用繪圖工具繪制好帆船后將其轉(zhuǎn)換為圖形元件，放置于舞臺右側(cè)外，在第120幀處插入關(guān)鍵幀，按住Shift鍵將帆船水平拖動(dòng)到舞臺左側(cè)外，回到第1幀創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫。4、測試并保存動(dòng)畫。圖4.31背景層內(nèi)容圖4.32制作“太陽”圖層動(dòng)畫圖4.33帆船的運(yùn)動(dòng)路徑4.5.3實(shí)踐與練習(xí)二：小球自由落體動(dòng)畫這里我們通過“小球自由落體”動(dòng)畫的制作，讓讀者掌握傳統(tǒng)補(bǔ)間動(dòng)畫的制作方法以及如何通過【屬性】面板控制動(dòng)畫的播放。（本動(dòng)畫可以作為物理課件，表現(xiàn)的是沒有阻力的理想狀態(tài)下小球受萬有引力的作用落地形變并恢復(fù)彈起的過程）1、新建一個(gè)Flash文檔，將背景色修改為藍(lán)色，將圖層一命名為“地面”，利用線條工具，調(diào)整好筆觸樣式，在舞臺底部繪制一條水平線條作為地面，如圖4.34所示。選中第84幀，單擊鼠標(biāo)右鍵選擇“插入幀”，將第1幀內(nèi)容延長至84幀。2、可以鎖定“地面”圖層防止誤操作，在它上方新建一個(gè)圖層，命名為“小球”，繪制一個(gè)漸變的正圓，按F8鍵轉(zhuǎn)換為圖形元件，將注冊點(diǎn)設(shè)置為中心點(diǎn)，利用任意變形工具將其調(diào)整到合適大小，將小球拖放到舞臺上方中央位置，如圖4.35所示。圖4.34水平地面圖4.35漸變的小球3、在第40幀處插入關(guān)鍵幀，按住鍵盤上的Shift鍵不放將小球垂直拖動(dòng)下來，直到接觸到地面。4、現(xiàn)在制作小球落地產(chǎn)生形變的部分，在第41幀插入關(guān)鍵幀，選擇任意變形工具后將小球的中心點(diǎn)下移至下邊緣中心，并且稍微縮小小球的高度；在第42幀插入關(guān)鍵幀，同上步驟，繼續(xù)縮小小球的高度，如圖4.36所示。6、復(fù)制第41幀，并在43幀處粘貼；復(fù)制第40幀，并在第44幀處粘貼，實(shí)現(xiàn)小球恢復(fù)變形的過程。7、復(fù)制第1幀，并且在84幀處粘貼，實(shí)現(xiàn)小球彈起回到原點(diǎn)的過程。回到第1幀，單擊鼠標(biāo)左鍵，選擇“創(chuàng)建傳統(tǒng)補(bǔ)間”，在【屬性】面板中設(shè)置緩動(dòng)參數(shù)為-100（速度最大程度的逐漸變快）；回到第44幀，創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫，設(shè)置緩動(dòng)參數(shù)為100（速度最大程度的逐漸變慢）。8、測試并保存動(dòng)畫。圖4.36兩次縮小小球的高度圖4.37小球自由落體的軌跡4.6上機(jī)實(shí)習(xí)4.6.1完成項(xiàng)目中部分動(dòng)畫的創(chuàng)作

4.6.2

制作“發(fā)展成就”部分的區(qū)域標(biāo)識

4.6.1完成項(xiàng)目中部分動(dòng)畫的創(chuàng)作

本項(xiàng)目一共有六個(gè)主要的畫面，所以從現(xiàn)在開始，我們打開項(xiàng)目文件，進(jìn)行以下操作。1、更改圖層1名稱為“背景圖”，在第1幀導(dǎo)入光盤中的項(xiàng)目素材圖像“image2.jpg”，利用【對齊】面板將圖像置于舞臺正中。完成后繼續(xù)導(dǎo)入素材圖像“image1.png”，調(diào)整其在“image2.jpg”上的位置，直至與項(xiàng)目效果相同。2、依次在“背景圖”圖層第2、3、4、5、6幀處插入另外五個(gè)關(guān)鍵幀，每個(gè)關(guān)鍵幀依次插入背景圖像“image9.jpg”、“image16.jpg”、“image18.jpg”、“image35.jpg”、“image59.jpg”，讓所有圖像置于舞臺正中。3、在“背景圖”圖層上方新建一個(gè)圖層，取名為“首頁動(dòng)畫”，選中首頁動(dòng)畫的第2至第6幀，單擊右鍵選擇“刪除幀”，只保留第一個(gè)關(guān)鍵幀，我們需要在里面制作首頁圖像切換的動(dòng)畫：在該幀導(dǎo)入圖像“6.png”，調(diào)整好位置后選取圖像，按下F8鍵將其轉(zhuǎn)換為影片剪輯元件，雙擊該元件，進(jìn)入元件編輯模式，以下操作都在元件編輯模式下進(jìn)行。修改圖層1名稱為“6”，在第49幀單擊鼠標(biāo)右鍵選擇“插入幀”，將第1幀內(nèi)容延長至49幀。在第50幀單擊鼠標(biāo)右鍵選擇“插入空白關(guān)鍵幀”，復(fù)