形狀補間動畫制作(精)

1、形狀補問動畫制作學(xué)習(xí)目標：1、認識形狀補問的動畫原理2、會制作形狀補問的動畫重、難點：認識形狀補問的動畫的動畫原理 一會制作形狀補問的動畫教學(xué)方法：演示法、講授法、練習(xí)法學(xué)時：1課時教學(xué)過程：一、引入由演示形狀動畫的實例引入二、新課學(xué)習(xí)1 .形狀補問動畫在一個關(guān)鍵幀中繪制一個形狀，然后在另一個關(guān)鍵幀中更改該形狀或繪制另一個形狀，F(xiàn)lash根據(jù)二者之間的幀的值或形狀來創(chuàng)建的動畫被稱為“形狀補問動畫”。2 .構(gòu)成形狀補問動畫的元素形狀補問動畫可以實現(xiàn)兩個圖形之間顏色、形狀、大小、位置的相互變化，其變形 的靈活性介于逐幀動畫和動作補問動畫二者之間，使用的元素多為用鼠標或壓感筆 繪制出的形狀，如果使用

2、圖形元件、按鈕、文字，則必先“打散”才能創(chuàng)建變形動 畫。形狀補問動畫建好后，時間幀面板的背景色變?yōu)榈G色，在起始幀和結(jié)束幀之間有 一個長長的箭頭。4 .創(chuàng)建形狀補問動畫的方法在時間軸面板上動畫開始播放的地方創(chuàng)建或選擇一個關(guān)鍵幀并設(shè)置要開始變形的形 狀，一般一幀中以一個對象為好，在動畫結(jié)束處創(chuàng)建或選擇一個關(guān)鍵幀并設(shè)置要變 成的形狀，再單擊開始幀，在【屬性】面板上單擊【補問】旁邊的小三角，在彈出 的菜單中選擇【形狀】，此時，時間軸上的變化如圖3-3-1所示，一個形狀補問動畫就創(chuàng)建完畢。學(xué)生練習(xí)任務(wù)：熟悉形狀補問動畫的制作1 .根據(jù)老師所提供的學(xué)習(xí)資料制作形狀補問動畫2 .從網(wǎng)上搜索更多的教程學(xué)習(xí)四

3、、課堂小結(jié)小結(jié)本節(jié)的主要內(nèi)容和學(xué)生中存在的問題附：學(xué)生資料形狀補問動畫形狀補問動畫是Flash中非常重要的表現(xiàn)手法之一，運用它，你可以變幻出各種奇妙的、不可思議的變形效果。本節(jié)從形狀補問動畫基本概念入手，帶你認識形狀補問動畫在時間幀上的表現(xiàn)，了解補問動畫的創(chuàng)建方法，學(xué)會應(yīng)用“形狀提示”讓圖形的形變自然流暢，最后，提供了二個實例，幫助你更深地理解形狀補問動畫。.形狀補間動畫的概念(1)形狀補問動畫的概念在一個關(guān)鍵幀中繪制一個形狀，然后在另一個關(guān)鍵幀中更改該形狀或繪制另一個形狀，F(xiàn)lash根據(jù)二者之間的幀的值或形狀來創(chuàng)建的動畫被稱為“形狀補問動畫”。(2)構(gòu)成形狀補問動畫的元素形狀補問動畫可以實現(xiàn)

4、兩個圖形之間顏色、形狀、大小、位置的相互變化，其變形 的靈活性介于逐幀動畫和動作補問動畫二者之間，使用的元素多為用鼠標或壓感筆 繪制出的形狀，如果使用圖形元件、按鈕、文字，則必先“打散”才能創(chuàng)建變形動 畫。(3)形狀補問動畫在時間幀面板上的表現(xiàn)形狀補問動畫建好后，時間幀面板的背景色變?yōu)榈G色，在起始幀和結(jié)束幀之間有 一個長長的箭頭，如圖3-3-1所示。圖3-3-1形狀補問動畫在時間幀面板上的標記(4)創(chuàng)建形狀補問動畫的方法在時間軸面板上動畫開始播放的地方創(chuàng)建或選擇一個關(guān)鍵幀并設(shè)置要開始變形的形 狀，一般一幀中以一個對象為好，在動畫結(jié)束處創(chuàng)建或選擇一個關(guān)鍵幀并設(shè)置要變 成的形狀，再單擊開始幀，在

5、【屬性】面板上單擊【補問】旁邊的小三角，在彈出 的菜單中選擇【形狀】，此時，時間軸上的變化如圖3-3-1所示，一個形狀補問動畫就創(chuàng)建完畢。2.認識形狀補問動畫的屬性面板Flash的【屬性】面板隨鼠標選定的對象不同而發(fā)生相應(yīng)的變化。當我們建立了一 個形狀補問動畫后，單擊幀，【屬性】面板如圖3-3-2所示。i ,位| gflftt *IX 舄 Q V+ sink*圖3-3-2形狀補問動畫的【屬性】面板形狀補問動畫的【屬性】面板上只有二個參數(shù)：(1) “簡易”選項單擊其右邊的.按鈕，會彈出滑動桿，拖動上面的滑塊可以調(diào)節(jié)參數(shù)值，當然也可 以在文本框中直接輸入具體的數(shù)值，設(shè)置后，形狀補問動畫會隨之發(fā)生相

6、應(yīng)的變 化。 在1到-100的負值之間，動畫運動的速度從慢到快，朝運動結(jié)束的方向加速度補問。 在1到100的正值之間，動畫運動的速度從快到慢，朝運動結(jié)束的方向減慢補問。默認情況下，補問幀之間的變化速率是不變的。(2) “混合”選項“混合”選項中有二項供選擇： 【角形】選項：創(chuàng)建的動畫中間形狀會保留有明顯的角和直線，適合于具有銳化轉(zhuǎn)角和直線的混合形狀。 【分布式】選項：創(chuàng)建的動畫中間形狀比較平滑和不規(guī)則。3.使用形狀提示形狀補問動畫看似簡單，實則不然，F(xiàn)lash在“計算” 2個關(guān)鍵幀中圖形的差異時，遠不如我們想象中的“聰明”，尤其前后圖形差異較大時，變形結(jié)果會顯得亂七八糟，這時，“形狀提示”功能

7、會大大改善這一情況。(1)形狀提示的作用在“起始形狀”和“結(jié)束形狀”中添加相對應(yīng)的“參考點”，使 Flash在計算變形過渡時依一定的規(guī)則進行，從而較有效地控制變形過程。(2)添加形狀提示的方法先在形狀補問動畫的開始幀上單擊一下，再執(zhí)行【修改】 |【形狀】【添 加形狀提示】命令，該幀的形狀上就會增加一個帶字母的紅色圓圈，相應(yīng)地，在結(jié) 束幀形狀中也會出現(xiàn)一個“提示圓圈”，用鼠標左鍵單擊并分別按住這2個“提示圓圈”，放置在適當位置，安放成功后開始幀上的“提示圓圈”變?yōu)辄S色，結(jié)束幀 上的“提示圓圈”變?yōu)榫G色，安放不成功或不在一條曲線上時，“提示圓圈”顏色 不變，如圖3-3-3所示。調(diào)就”時居H 始愀處

8、交黃色淞十死狀箕小斤+. 調(diào)整位學(xué)時的秋志*W*晴帖求獨姓妙丑工圖3-3-3添加形狀提示后各幀的變化說明：在制作復(fù)雜的變形動畫時，形狀提示的添加和拖放要多方位嘗試，每添加一個形狀提示，最好播放一下變形效果，然后再對變形提示的位置做進一步的調(diào)整第三節(jié)形狀補問動畫(2(3)添加形狀提示的技巧“形狀提示”可以連續(xù)添加，最多能添加 26個。將變形提示從形狀的左上角開始按逆時針順序擺放，將使變形提示工作得更有效形狀提示的擺放位置也要符合邏輯順序。例如，起點關(guān)鍵幀和終點關(guān)鍵幀上各有一個三角形，我們使用 3個“形狀提示”，如果它們在起點關(guān)鍵幀的 三角形上的順序為abc,那么在重點關(guān)鍵幀的三角形上的順序就不能

9、是 acb,也要 是 abc。形狀提示要在形狀的邊緣才能起作用，在調(diào)整形狀提示位置前，要 打開工具欄上【選項】下面的【吸咐開關(guān)】颯，這樣，會自動把“形狀提示”吸咐到邊緣上，如果你發(fā)覺“形狀提示”仍然無效，則可以用工具欄上的【縮放工 具】q：單擊形狀，放大到足夠大，以確?！靶螤钐崾尽蔽挥趫D形邊緣上。另外，要刪除所有的形狀提示，可執(zhí)行【修改】【形狀】【刪除所有提示】命令。刪除單個形狀提示，可用鼠標右鍵單擊它，在彈出菜單中 選擇【刪除提示】。至此，“形狀補問動畫”的相關(guān)知識我們已都介紹給大家了，下面來一起動手制作 二個實例，體會一下形狀補問動畫的奇妙。4.實例1慶祝國慶實例簡介國慶的夜空絢麗多彩，朵

10、朵禮花在天空中綻放，遠處傳來禮炮的轟鳴聲，讓我們來給這美麗的夜晚增加點喜慶，掛幾個大紅燈籠來慶祝祖國的生日吧！實例播放效果如圖3-3-4所示。ac * F1 ajth PI ayer 7圖3-3-4慶祝國慶實例畫面知識提要 創(chuàng)建矢量圖形 創(chuàng)建形狀補問動畫 將文字轉(zhuǎn)變?yōu)樾螤?用混色器設(shè)置顏色 在場景中導(dǎo)入聲音制作步驟步驟1創(chuàng)建新文檔執(zhí)行【文件】【新建】命令，在彈出的對話框中選擇【常規(guī)】|【Flash文檔】選項后，單擊【確定】按鈕，新建一個影片文檔，在【屬性】面板上設(shè)置文件大小為400X330像素，【背景色】為白色，如圖3-3-5所示。530 r 4見打的幽內(nèi)幽。圖3-3-5文檔屬性步驟2創(chuàng)建背景

11、圖層執(zhí)行【文件】|【導(dǎo)入】|【導(dǎo)入到舞臺】命令，將配套光盤中的名為“節(jié)日夜空.jpg ”圖片導(dǎo)入到場景中，（“節(jié)日夜空”圖片位置：光盤圖片節(jié)日夜空.jpg ）,選擇第80幀，按鍵盤上的F5鍵，增加一個普通幀，如圖3-3-6所示。第三節(jié)形狀補問動畫（3步驟3導(dǎo)入聲音文件執(zhí)行【文件】|【導(dǎo)入】【導(dǎo)入到庫】命令，打開配套光盤中的名為 “sound.mpS的文件，將其導(dǎo)入到庫中。步驟4創(chuàng)建燈籠形狀我們先來畫燈籠，執(zhí)行【窗口】|【設(shè)計面板】|【混色器】命令，打開【混色器】面板，設(shè)置各項參數(shù)，漸變的顏色為白色到紅色，如圖 3-3-7所示。圖3-3-7【混色器】面板設(shè)置之一新建一個圖層，并將其重新命名為“燈

12、籠一”。選擇工具箱中的【橢圓工具】 ,設(shè)置【筆觸顏色】為無，在場景中繪制出一個橢圓做燈籠的主體，大小為 65X 40像素。接著我們來畫燈籠上下的邊，打開【混色器】面板，按照如圖3-3-8所示設(shè)置深黃色到淺黃色的【線性】漸變填充。從左到右三個填充色標的顏色值分別為： #FF990。#FFFF00 #FFCC00圖3-3-8【混色器】面板設(shè)置之選擇工具箱上的【矩形工具】 口丁，設(shè)置【筆觸顏色】為無，繪制出一個矩 形，大小為30X 10像素，復(fù)制這個矩形，分別放在燈籠的上下方，再畫一個小的 矩形，長寬為7X10像素，作為燈籠上面的提手。最后用【線條工具】/ ,在燈籠的下面畫幾條黃色線條做燈籠穗，一個

13、漂亮 的燈籠就畫好了。如圖3-3-9所示（為了能清楚的顯示燈籠，可暫時將背景色改為 藍色）。圖3-3-9畫好的燈籠步驟5復(fù)制粘貼四個燈籠復(fù)制剛畫好的燈籠，新建三個圖層，在每個圖層中粘貼一個燈籠，調(diào)整燈籠的 位置，使其錯落有致地排列在場景中在第20、40幀處為各圖層添加關(guān)鍵幀，如圖 3-3-10所示圖3-3-10錯落有致的燈籠及時間軸面板第三節(jié)形狀補問動畫（4步驟6把文字轉(zhuǎn)為形狀取代燈籠選取第一個燈籠，在第40幀處用文字“慶”取代燈籠，在【屬性】面板上,3-3-11 所設(shè)置文本類型為【靜態(tài)文本】，字體為【隸書】，字體大小為60,顏色為紅色對“慶”字執(zhí)行【修改】|【分離】命令，把文字轉(zhuǎn)為形狀。如圖

14、示。圖3-3-11用“慶”字替換第一個燈籠依照以上步驟，在第40幀處的相應(yīng)圖層上依次用“?！?、“國”、“慶”三 個字取代另外三個燈籠，并執(zhí)行【分散】操作，其效果如圖3-3-12所示。圖3-3-12用文字形狀取代燈籠形狀及文字打散步驟7設(shè)置文字形狀到燈籠形狀的轉(zhuǎn)變。在“燈籠”各圖層的第60幀及80幀處，分別添加關(guān)鍵幀，現(xiàn)在，在 80幀處 各“燈籠”圖層中的內(nèi)容為“文字圖形”，應(yīng)該把它們換成“燈籠”。具體辦法是分別復(fù)制第20幀中的“燈籠”圖形，再分別粘貼到第 80幀中，當 然，你應(yīng)該先清除第80幀處4個“燈籠”圖層中的內(nèi)容哦！在“燈籠”各圖層的第20、60幀處單擊幀，在【屬性】面板上單擊【補問】

15、旁邊的小三角，在彈出的菜單中選擇【形狀】，建立形狀補問動畫，如圖 3-3-13 所示。圖3-3-13創(chuàng)建形狀補問動畫步驟9設(shè)置聲音添加一層，在第20、60幀處按F6鍵，創(chuàng)建關(guān)鍵幀，在【屬性】面板上單擊【聲音】旁邊的小三角，選擇 sound.mp3,如圖3-3-14所示。圖3-3-14聲音設(shè)置設(shè)置好的時間幀面板如圖3-3-15所示n B Q It kl Ft rt- i* 修話 g = t， ife 3-* I 1 I才114圖3-3-15設(shè)置好的時間幀面板說明：有關(guān)聲音導(dǎo)入及應(yīng)用的詳細內(nèi)容請參閱本書第五章的相關(guān)內(nèi)容。5.實例2添加形狀提示練習(xí)實例簡介上面我們曾談到，為得到流暢自然的形狀變形動畫

16、，可以添加形狀提示，本例 是專為此而設(shè)計的練習(xí)。請你在光盤的相關(guān)目錄中找到“添加形狀提示練習(xí).swf”文件，如圖3-3-16 所示。這2個同樣是“形狀變形”，其中右邊的變形用了變形“參考點”，從中， 我們可以看出變形效果有明顯的差異。1 1東加形狀提永加用形狀提忝圖3-3-16添加形狀提示實例界面知識提要添加形狀提示創(chuàng)建形狀補問動畫步驟1創(chuàng)建新文檔執(zhí)行【文件】【新建】命令，新建一個影片文檔，設(shè)置舞臺尺寸為 300X 200 像素，設(shè)置【背景色】為藍色#0000FF。步驟2創(chuàng)建變形對象。我們要在場景中寫二個數(shù)字“ 1”，讓它們同時變形，一個加形狀提示，一個 不加形狀提示，看看這二個變形有什么不同。先在【圖層11的場景左邊輸入數(shù)字“ 1”，在【屬性】面板上，設(shè)置文本格式 為【靜態(tài)文本】、字體為隸書、字號為 100、【顏色】為白色。再建一個【圖層 2】，在場景右邊輸入數(shù)字“ 1”，參數(shù)同上，此層是添加形狀提示層。然后在兩個 圖層的第40幀處添加關(guān)鍵幀，各輸入數(shù)字“ 2”，在第60幀處添加普通幀，使變 形后的文字稍做停留。第三節(jié)形狀補問動畫（5步驟3把字符轉(zhuǎn)為形狀逐一選取各層數(shù)字的第1、40幀，執(zhí)行【修改】|【分離】命令，把數(shù)字打 散，轉(zhuǎn)為形狀。步驟4創(chuàng)建