資源簡介

第五課
形狀補間動畫
教學目標
（一）知識與技能
1形狀補間動畫。
2制作形狀補間動畫
3添加形狀提示點來控制形狀補間動畫。
4逐幀動畫、動畫補間動畫、形狀補間動畫的制作要點與使用需求。
過程與方法
根據首尾關鍵幀補充中間幀的方法制作形狀補間動畫。體驗添加形狀提示點來控制形狀補間動畫技術；掌握逐幀動畫、動畫補間動畫、形狀補間動畫的制作要點與使用需求。
情感態度價值觀
通過學習、體驗、制作動畫，進一步激發學生學習flash動畫的積極性，培養學生自主探索、協作進取的精神。
教學重難點
形狀補間動畫的制作方法。（重）
2.實例的動手操作和屬性設置。（難）
教學過程
補間動畫由用戶制作起始關鍵幀和結束關鍵幀，中間的各過渡幀由
Flash通過計算自動補充。元件實例的大小、位置、亮度、色調、
Alpha值等的變化可以使用動畫補間動畫來實現，但要用補間動畫的方式實現形狀上的變化則需要使用形狀補間動畫。
試一試
打開文件“漢字的演變.swf”，觀看播放效果。
一、形狀補間動畫
形狀補間動畫指的是在起始關鍵幀中繪制一個形狀，然后在結束關鍵幀中更改該形狀或繪制另一個形狀，
Flash根據起始關鍵幀和結束關鍵幀的值或形狀來自動創建中間幀的動畫。制作形狀補間動畫時，起始關鍵幀或結束關鍵幀中的對象必須是分離狀態的圖形。
Flash中的圖形有分離狀態的，也有組合狀態的。選中分離狀態與組合狀態的對象以不同形式顯示，如圖5-1、圖5-2所示。
“對象繪制”未被選中時，舞臺上直接繪制的圖形為分離狀態;被選中時，繪制的圖形則是組合狀態。通常，所有通過庫元件在舞臺上生成的實例對象則是組合狀態的。
圖5-1圖形的分離狀態與組合狀態
圖5-2文宇的分離狀態與組合狀態
練一練
模仿“范例1.fla”，在舞臺上繪制起始關鍵幀的一彎半月，以及結束關鍵幀的象形文字。
1.制作形狀補間動畫
(1)在起始關鍵幀和結束關鍵幀中繪制所需形態變化的圖形，并確保兩關鍵幀中的圖形均為分離狀態。如果是組合狀態的對象，可以通過單擊“修改”菜單下的“分離”命令，或者直接使用快捷組合鍵【Crl+B】使之變為分離狀態。
(2)選中起始關鍵幀與結關鍵幀之間的任意幀，在“屬性”面板中設置“補間”為“形狀”，此時將自動生成形狀補間動畫。形狀補間動畫建立后，時間軸面板的背景色變為淡綠色，在起始關鍵幀和結關鍵幀之間有一條實線箭頭，如圖5-3所示。
2.可能產生的問題及解決方法
當起始關鍵幀和結束關鍵幀之間帶箭頭的線為虛線，或不帶箭頭時，說明形狀補間動畫生成有誤。解決方法如下。
(1)檢查兩端是否都有非空白的關鍵幀，即從外觀上看，兩端是否都是黑色實心圓點。
(2)檢查兩端關鍵幀中的圖形是否均被分離。
3能實現的效果
形狀補間動畫可以實現元件實例大小、位置、色調等的變化，但通常形狀補間動畫主要用于實現不同形狀之間流暢變化的動態演變過程。
練一練
模仿“范例2.fla”，繪制關鍵幀，制作從象形文字到甲骨文演變過程的動畫。
二、繪圖紙外觀工具
為了方便用戶操作，
Flash提供了繪圖紙外觀工具，它可同時編輯多個幀，如圖5-4至圖5-7所示。
試一試
嘗試使用繪圖紙外觀工具，在文件“范例2.fla”中對齊前后不同幀的位置。
圖5-4繪圖紙外觀工具
圖5-5繪圖紙外觀
圖5-6繪圖紙外觀輪廓
圖5-7編輯多個幀
Flash舞臺上通常只能顯示某一幀的畫面，即只能顯示某一時刻的變化。
但使用繪圖紙外觀工具，就可以同時顯示或編輯多個幀的內容，方便對整個影
片進行定位和安排。
練一練
打開文件“范例3.fla”，使用元件以及繪圖紙外觀工具，制作從甲骨文到金文演變過程的動畫。
具體操作步驟如下。
(1)動畫的起始關鍵幀為上一動畫的結束關鍵幀(第60幀)，在第120幀插入空白關鍵幀。
(2)將“金文”元件拖動至舞臺，并將其分離。
(3)保持選中第120幀，單擊“繪圖紙外觀”工具，在時間軸刻度上便會出現帶有空心圓圈的中括號，左括號表示使用繪圖紙外觀工具查看動畫的起始點，右括號表示使用繪圖紙外觀工具查看動畫的結束點，如圖5-8所示。
圖5-8查看動畫的起始點與結束點
將指針移動到括號上，拖動左括號調至第
59幀或第60幀，查看此間包括所有幀的顯示。
由于尚未創建補間動畫，所以沒有中間幀的圖像顯示，可以很清楚地看到兩個關鍵幀的大小、位置等關系。
(4)選中結束關鍵幀，調整其位置，使之與起始關鍵幀相對重合。
(5)選中中間頓，單擊“屬性”面板，設置“形狀”補間。
形狀補間動畫的起始關鍵幀和結東關鍵幀通常具有形狀、顏色等相關性，為得到流暢美觀的效果，最好不要使用完全不同的圖像，否則會產生許多變化中的雜亂線條。因此，圖標的形象化示意、云彩的變化等適合使用形狀補間來實現。
三、添加形狀提示點
1.插入形狀提示點
練一練
打開文件“范例4.fla＂，運用文字工具，制作從金文到隸書演變過程的動畫。
具體操作步驟如下。
(1)在第121幀到第159幀中制作動畫補間動畫，實現文字的旋轉及縮放變化。
(2)在第160幀到第220幀中制作形狀補間動畫，實現文字形狀的變化。
測試效果時發現，實現的變化效果與范例不一樣。實際上，
Flash在“計算”兩個關鍵幀中圖形的差異時，遠不如我們想象中“聰明”，尤其在前后圖形差異較大時，變形效果不佳。“形狀提示”可以幫助計算機在計算時，準確對應兩個關鍵幀中的相應變形點。
(3)插入形狀提示點。
選中形狀補間動畫的起始關鍵幀，執行“修改”菜單下的“形狀”→“添加形狀提示”命令，該幀的形狀就會增加一個帶字母的“提示圓圈”，在結關鍵幀形狀中也會出現一個“提示圓圈”。單擊并分別按住這兩個“提示圓圈”拖至適當位置安放，起始關鍵幀上的“提示圓圈”變為黃色，結束關鍵幀上的“提示圓圈”變為綠色，當安放不成功或不在一條曲線上時，“提示圓圈”顏色不變。這些“提示圓圈”就是形狀提示點，每一個圖形可以有多組形狀提示點。設置過程如圖5-9、圖5-10所示。
如果測試后發現化效果仍不佳，可以手工修正起始關鍵幀的形狀。使用形狀補間動畫的起始關鍵幀和結束關鍵幀在空間結構上類似，可以很好地實現形狀補間動畫。因此，需要選中第160幀，使用刷子工具將“月”字中的第一橫兩端封口，并繼續添加形狀提示點控制變化過程。
2.添加形狀提示點的技巧
(1)可以連續添加“形狀提示”，最多添加26個。
(2)
Flash中按逆時針方向從形狀的左上角開始放置“形狀提示”，這樣它們的工作效果最好。
(3)確保起始關鍵幀和結關鍵幀中的“形狀提示”是一一對應并符合邏輯的。
(4)“形狀提示”要在形狀的邊緣才能起作用，在調整“形狀提示”位置前，要打開工具欄上“選項”下面的“緊貼至對象”，系統自動把“形狀提示”吸附到邊緣上。如果發覺“形狀提示”仍然無效，則可用工具欄上的放大工具放大圖形后操作，以確保“形狀提示”位于圖形邊緣上。
(5)選中形狀提示點，單擊鼠標右鍵，去掉“顯示形狀提示”前面的對鉤，可以實現隱藏形狀提示點的效果。
(6)若要將隱藏后的形狀提示點顯示出來，可選擇“視圖”菜單下的“顯示形狀提示”，或者同時按【Cr+
Alt+H】鍵。
(7)若要刪除所有的“形狀提示”，可選擇“修改”菜單下的“形狀”→“刪除所有提示”，或者指向提示點后用快捷菜單刪除。
思考與練習
1打開文件“漢字的演變.fla＂，添加標題場景，完成整個動畫創作。
2打開文件“圖標.swf”，嘗試在完成的網站標題動畫上，加上動態示意圖標。3逐幀動畫、動畫補間動畫和形狀補間動畫的對比。
(1)分析逐幀動畫、動畫補間動畫和形狀補間動畫在制作及應用上的不同，歸納如表5-1所示。
表5-1逐幀動畫、動畫補間動畫和形狀補間動畫的比較
(2)打開文件“漢字的演變.swf＂，分析從金文到隸書的變化中運用了哪些動畫類型。
課堂小結
這節課，我們了解了形狀補間動畫的特點，根據首尾關鍵幀補充中間幀的方法制作形狀補間動畫。體驗添加形狀提示點來控制形狀補間動畫技術；掌握逐幀動畫、動畫補間動畫、形狀補間動畫的制作要點與使用需求。
板書設計
形狀補間動畫
制作形狀補間動畫
形狀補間動畫
添加形狀提示點來控制形狀補間動畫
逐幀動畫、動畫補間動畫、形狀補動畫的制作要點與使用需求
課后反思(共43張PPT)
第五課
形狀補間動畫
補間動畫由用戶制作起始關鍵幀和結束關鍵幀，中間的各過渡幀由
Flash通過計算自動補充。元件實例的大小、位置、亮度、色調、
Alpha值等的變化可以使用動畫補間動畫來實現，但要用補間動畫的方式實現形狀上的變化則需要使用形狀補間動畫。
試一試
打開文件“漢字的演變swf”，觀看播放效果。
一、形狀補間動畫
形狀補間動畫指的是在起始關鍵幀中繪制一個形狀，然后在結束關鍵幀中更改該形狀或繪制另一個形狀，
Flash根據起始關鍵幀和結束關鍵幀的值或形狀來自動創建中間幀的動畫。制作形狀補間動畫時，起始關鍵幀或結束關鍵幀中的對象必須是分離狀態的圖形。
Flash中的圖形有分離狀態的，也有組合狀態的。選中分離狀態與組合狀態的對象以不同形式顯示，如圖5-1、圖5-2所示。
“對象繪制”未被選中時，舞臺上直接繪制的圖形為分離狀態;被選中時，繪制的圖形則是組合狀態。通常，所有通過庫元件在舞臺上生成的實例對象則是組合狀態的。
練一練
模仿“范例1.fla”，在舞臺上繪制起始關鍵幀的一彎半月，以及結束關鍵幀的象形文字。
1.制作形狀補間動畫
(1)在起始關鍵幀和結束關鍵幀中繪制所需形態變化的圖形，并確保兩關鍵幀中的圖形均為分離狀態。如果是組合狀態的對象，可以通過單擊“修改”菜單下的“分離”命令，或者直接使用快捷組合鍵【Crl+B】使之變為分離狀態。
(2)選中起始關鍵幀與結關鍵幀之間的任意幀，在“屬性”面板中設置“補間”為“形狀”，此時將自動生成形狀補間動畫。形狀補間動畫建立后，時間軸面板的背景色變為淡綠色，在起始關鍵幀和結關鍵幀之間有一條實線箭頭，如圖5-3所示。
2.可能產生的問題及解決方法
當起始關鍵幀和結束關鍵幀之間帶箭頭的線為虛線，或不帶箭頭時，說明形狀補間動畫生成有誤。解決方法如下。
(1)檢查兩端是否都有非空白的關鍵幀，即從外觀上看，兩端是否都是黑色實心圓點。
(2)檢查兩端關鍵幀中的圖形是否均被分離。
3
能實現的效果
形狀補間動畫可以實現元件實例大小、位置、色調等的變化，但通常形狀補間動畫主要用于實現不同形狀之間流暢變化的動態演變過程。
練一練
模仿“范例2.fla”，繪制關鍵幀，制作從象形文字到甲骨文演變過程的動畫。
二、繪圖紙外觀工具
為了方便用戶操作，
Flash提供了繪圖紙外觀工具，它可同時編輯多個幀，如圖5-4至圖5-7所示。
試一試
嘗試使用繪圖紙外觀工具，在文件“范例2.fla”中對齊前后不同幀的位置。
Flash舞臺上通常只能顯示某一幀的畫面，即只能顯示某一時刻的變化。
但使用繪圖紙外觀工具，就可以同時顯示或編輯多個幀的內容，方便對整個影片進行定位和安排。
練一練
打開文件“范例3.fla”，使用元件以及繪圖紙外觀工具，制作從甲骨文到金文演變過程的動畫。
具體操作步驟如下。
(1)動畫的起始關鍵幀為上一動畫的結束關鍵幀(第60幀)，在第120幀插入空白關鍵幀。
(2)將“金文”元件拖動至舞臺，并將其分離。
(3)保持選中第120幀，單擊“繪圖紙外觀”工具，在時間軸刻度上便會出現帶有空心圓圈的中括號，左括號表示使用繪圖紙外觀工具查看動畫的起始點，右括號表示使用繪圖紙外觀工具查看動畫的結束點，如圖5-8所示。
將指針移動到括號上，拖動左括號調至第59幀或第60幀，查看此間包括所有幀的顯示。
由于尚未創建補間動畫，所以沒有中間幀的圖像顯示，可以很清楚地看到兩個關鍵幀的大小、位置等關系。
(4)選中結束關鍵幀，調整其位置，使之與起始關鍵幀相對重合。
(5)選中中間頓，單擊“屬性”面板，設置“形狀”補間。
形狀補間動畫的起始關鍵幀和結東關鍵幀通常具有形狀、顏色等相關性，為得到流暢美觀的效果，最好不要使用完全不同的圖像，否則會產生許多變化中的雜亂線條。因此，圖標的形象化示意、云彩的變化等適合使用形狀補間來實現。
三、添加形狀提示點
1.插入形狀提示點
練一練
打開文件“范例4.fla＂，運用文字工具，制作從金文到隸書演變過程的動畫。
具體操作步驟如下。
(1)在第121幀到第159幀中制作動畫補間動畫，實現文字的旋轉及縮放變化。
(2)在第160幀到第220幀中制作形狀補間動畫，實現文字形狀的變化。
測試效果時發現，實現的變化效果與范例不一樣。實際上，
Flash在“計算”兩個關鍵幀中圖形的差異時，遠不如我們想象中“聰明”，尤其在前后圖形差異較大時，變形效果不佳。“形狀提示”可以幫助計算機在計算時，準確對應兩個關鍵幀中的相應變形點。
(3)插入形狀提示點。
選中形狀補間動畫的起始關鍵幀，執行“修改”菜單下的“形狀”→“添加形狀提示”命令，該幀的形狀就會增加一個帶字母的“提示圓圈”，在結關鍵幀形狀中也會出現一個“提示圓圈”。單擊并分別按住這兩個“提示圓圈”拖至適當位置安放，起始關鍵幀上的“提示圓圈”變為黃色，結束關鍵幀上的“提示圓圈”變為綠色，當安放不成功或不在一條曲線上時，“提示圓圈”顏色不變。這些“提示圓圈”就是形狀提示點，每一個圖形可以有多組形狀提示點。設置過程如圖5-9、圖5-10所示。
如果測試后發現化效果仍不佳，可以手工修正起始關鍵幀的形狀。使用形狀補間動畫的起始關鍵幀和結束關鍵幀在空間結構上類似，可以很好地實現形狀補間動畫。因此，需要選中第160幀，使用刷子工具將“月”字中的第一橫兩端封口，并繼續添加形狀提示點控制變化過程。
2.添加形狀提示點的技巧
(1)可以連續添加“形狀提示”，最多添加26個。
(2)
Flash中按逆時針方向從形狀的左上角開始放置“形狀提示”，這樣它們的工作效果最好。
(3)確保起始關鍵幀和結關鍵幀中的“形狀提示”是一一對應并符合邏輯的。
(4)“形狀提示”要在形狀的邊緣才能起作用，在調整“形狀提示”位置前，要打開工具欄上“選項”下面的“緊貼至對象”，系統自動把“形狀提示”吸附到邊緣上。如果發覺“形狀提示”仍然無效，則可用工具欄上的放大工具放大圖形后操作，以確保“形狀提示”位于圖形邊緣上。
(5)選中形狀提示點，單擊鼠標右鍵，去掉“顯示形狀提示”前面的對鉤，可以實現隱藏形狀提示點的效果。
(6)若要將隱藏后的形狀提示點顯示出來，可選擇“視圖”菜單下的“顯示形狀提示”，或者同時按【Cr+
Alt+H】鍵。
(7)若要刪除所有的“形狀提示”，可選擇“修改”菜單下的“形狀”→“刪除所有提示”，或者指向提示點后用快捷菜單刪除。
思考與練習
1打開文件“漢字的演變.fla＂，添加標題場景，完成整個動畫創作。
2打開文件“圖標.swf”，嘗試在完成的網站標題動畫上，加上動態示意圖標。
3逐幀動畫、動畫補間動畫和形狀補間動畫的對比。
(1)分析逐幀動畫、動畫補間動畫和形狀補間動畫在制作及應用上的不同，歸納如表5-1所示。
表5-1逐幀動畫、動畫補間動畫和形狀補間動畫的比較
(2)打開文件“漢字的演變.swf＂，分析從金文到隸書的變化中運用了哪些動畫類型。
課堂小結
這節課，我們了解了形狀補間動畫的特點，根據首尾關鍵幀補充中間幀的方法制作形狀補間動畫。體驗添加形狀提示點來控制形狀補間動畫技術；掌握逐幀動畫、動畫補間動畫、形狀補間動畫的制作要點與使用需求。
板書設計
形狀補間動畫
制作形狀補間動畫
形狀補間動畫
控制形狀補間動畫
形狀補動畫的制作要點與使用需求

展開更多......

收起↑