flash教程之骨骼動畫

1、項目七 創(chuàng)建高級動畫,創(chuàng)建路徑引導(dǎo)動畫 創(chuàng)建骨骼動畫 場景和動畫預(yù)設(shè),任務(wù)二 創(chuàng)建路徑引導(dǎo)動畫,任務(wù)說明,路徑引導(dǎo)動畫也是Flash常用的動畫制作手法之一，利用它可以使對象沿制作者繪制的引導(dǎo)線移動（引導(dǎo)線的作用與補間動畫中的運動路徑相似，但只能作用于傳統(tǒng)補間動畫）。本任務(wù)將帶領(lǐng)讀者學(xué)習(xí)創(chuàng)建路徑引導(dǎo)動畫的方法。,預(yù)備知識,路徑引導(dǎo)動畫由“引導(dǎo)層”和“被引導(dǎo)層”組成。制作路徑引導(dǎo)動畫時，需要在“引導(dǎo)層”上繪制引導(dǎo)對象運動的引導(dǎo)線（利

2、用鋼筆、鉛筆、線條、橢圓或矩形工具等繪制的線條），然后將“被引導(dǎo)層”上的對象吸附到引導(dǎo)線上（“被引導(dǎo)層”中必須是傳統(tǒng)補間動畫）。播放動畫時，“引導(dǎo)層”上的內(nèi)容不會被顯示。,,路徑引導(dǎo)動畫,下面通過一個簡單實例，介紹路徑引導(dǎo)動畫的創(chuàng)建方法。,,,新建圖層并拖入“飛機”圖形元件,創(chuàng)建傳統(tǒng)補間動畫,1.打開素材文檔，在“背景”圖層上方新建一個圖層并將其命名為“飛機”，然后將“庫”面板中的“飛機”圖形元件拖到“飛機”圖層舞臺右側(cè)外 。,2.在所

3、有圖層的第40幀插入普通幀，在“飛機”圖層的第40幀插入關(guān)鍵幀，然后將“飛機”圖層第40幀中的“飛機”元件實例移動到舞臺左側(cè)外，并在“飛機”圖層第1幀與第40幀之間創(chuàng)建傳統(tǒng)補間動畫 。,,創(chuàng)建“引導(dǎo)層,繪制引導(dǎo)線,,3.在“飛機”圖層的圖層名稱上右擊，在彈出的快捷菜單中選擇“添加傳統(tǒng)運動引導(dǎo)層”菜單，在“飛機”圖層上方創(chuàng)建一個引導(dǎo)層，此時“飛機”圖層自動變?yōu)楸灰龑?dǎo)層 。,4.使用“鉛筆工具”和“選擇工具”在“引導(dǎo)層”上繪制一條引導(dǎo)線。,

4、,,,將變形中心點對齊到引導(dǎo)線,勾選“調(diào)整到路徑”復(fù)選項,5.使用“選擇工具”調(diào)整“飛機”圖層第1幀和第40幀中“飛機”元件實例的位置，使其變形中心點對齊到引導(dǎo)線 。,6.選中“飛機”圖層的第1幀，然后在“屬性”面板中勾選“調(diào)整到路徑”復(fù)選項 。,調(diào)整到路徑：勾選該復(fù)選項，可使“被引導(dǎo)層”上的對象在沿引導(dǎo)線移動的同時，還可以根據(jù)引導(dǎo)線的切線方向調(diào)整其自身的方向（如果不勾選該復(fù)選項，對象在沿引導(dǎo)線運動時只是平移，與引導(dǎo)線的切線方向沒有關(guān)系

5、）。對齊：勾選該復(fù)選項后，在將對象對齊到引導(dǎo)線時，可使對象的變形中心點更容易吸附到引導(dǎo)線上。,任務(wù)實施——制作翩翩起舞的蝴蝶動畫,下面通過制作翩翩起舞的蝴蝶動畫效果，學(xué)習(xí)路徑引導(dǎo)動畫的應(yīng)用。,制作思路,,翩翩起舞的蝴蝶,本案例主要是通過在兩個圖層上創(chuàng)建蝴蝶由下向上移動的傳統(tǒng)補間動畫，再在這兩個圖層上添加傳統(tǒng)運動引導(dǎo)層，并在引導(dǎo)層上繪制引導(dǎo)線，使蝴蝶按照引導(dǎo)線的路徑進行運動來實現(xiàn)。本例具體操作可參考本書配套視頻“7-2.avi” 。,任

6、務(wù)三 創(chuàng)建骨骼動畫,任務(wù)說明,骨骼動畫是利用反向運動工具模擬人體或動物骨骼關(guān)節(jié)的運動。Flash CS5提供的反向運動工具包括“骨骼工具”和“綁定工具”，本任務(wù)將帶領(lǐng)讀者學(xué)習(xí)它們的使用方法。,預(yù)備知識,一、“骨骼工具”的使用,1．為分離對象創(chuàng)建骨骼動畫,利用“骨骼工具”在分離對象中添加骨骼后，可以通過旋轉(zhuǎn)或移動添加的骨骼來創(chuàng)建骨骼動畫。下面通過一個簡單實例，介紹為分離對象創(chuàng)建骨骼動畫的方法。,,繪制矩形,1. 新建一個Flash（Ac

7、tionScript 3.0）文檔，使用“矩形工具”在舞臺中繪制一個矩形 。,,創(chuàng)建第1個IK骨骼,2.單擊“圖層1”的第1幀選中舞臺中的矩形，然后單擊工具箱中的“骨骼工具”或者按快捷鍵【M】，將光標(biāo)移動到矩形左側(cè)邊緣處，此時按住鼠標(biāo)左鍵并向右拖動，即可在矩形中創(chuàng)建一個IK（反向運動學(xué)）骨骼，同時在“時間軸”面板中自動生成了一個“骨架_1”圖層，并且矩形自動移動到“骨架_1”圖層中 。,,創(chuàng)建第2個和第3個IK骨骼,3.將光標(biāo)移動到第一

8、個IK骨骼的尾部，按住鼠標(biāo)左鍵并拖動，以上一級IK骨骼的尾端為起點創(chuàng)建下一級IK骨骼；利用相同的操作再創(chuàng)建1個IK骨骼 。,,調(diào)整第20幀中矩形的形狀,4.在所有圖層的第40幀處插入普通幀，然后將播放頭跳轉(zhuǎn)到第20幀處，并使用“選擇工具”拖動“骨架_1”圖層第20幀中骨骼的相應(yīng)關(guān)節(jié)，調(diào)整其形狀，此時在“骨架_1”圖層的第20幀處會自動插入一個姿勢關(guān)鍵幀。,5.播放頭跳轉(zhuǎn)到第40幀處，并拖動“骨架_1”圖層第40幀中的骨骼，調(diào)整其形狀，至

9、此實例就完成了，按【Enter】鍵可在舞臺中預(yù)覽動畫。,2．為元件實例創(chuàng)建骨骼動畫,利用“骨骼工具”可以將一系列元件實例通過骨骼連接在一起，然后通過旋轉(zhuǎn)或移動相應(yīng)的骨骼或元件實例來創(chuàng)建不同效果的骨骼動畫。下面通過一個簡單實例進行說明。,,打開素材文檔,1.打開素材文檔，會在舞臺中看到一個吊車圖形，它的各個部分都是由圖形元件組成的 。,,,創(chuàng)建第1個IK骨骼,創(chuàng)建第2個IK骨骼,2.選擇工具箱中的“骨骼工具”或者按快捷鍵【M】，將光標(biāo)移

10、動到支架的底部，然后按住鼠標(biāo)左鍵并拖動到與吊桿結(jié)合的部位，創(chuàng)建一個IK骨骼 。,3.以上一個IK骨骼的尾端為起點按住鼠標(biāo)左鍵并拖動到吊桿右側(cè)與掛鉤的結(jié)合處，創(chuàng)建第2個IK骨骼 。,,,調(diào)整第15幀中的吊車形狀,調(diào)整第30幀中的吊車形狀,4.在所有圖層的第40幀插入普通幀，然后將播放頭跳轉(zhuǎn)到第15幀處，選擇“選擇工具”，在按住【Shift】鍵的同時分別拖動舞臺中吊車的吊桿和掛鉤，調(diào)整其形狀。,5.將播放頭跳轉(zhuǎn)到第15幀處，在按住【Shif

11、t】鍵的同時使用“選擇工具”分別拖動吊車的吊桿和掛鉤，調(diào)整其形狀。至此實例就完成了，按【Enter】鍵可在舞臺中預(yù)覽動畫。,二、“綁定工具”的使用,“綁定工具”的使用方法可參考以下操作。,,,顯示形狀控制點,向選定骨骼添加形狀控制點,1.使用“骨骼工具”為分離對象添加IK骨骼后，單擊選中工具箱中的“綁定工具”或者按快捷鍵【Z】，然后單擊選中任意骨骼，被選中的骨骼會以紅色高亮顯示，連接到該骨骼的形狀控制點會以黃色高亮顯示 。,2.若要向選

12、定的骨骼添加控制點（即將該控制點連接到選定的骨骼），可在按住【Shift】鍵的同時單擊未加亮顯示的控制點 。,為形狀控制點添加骨骼,3.若要從骨骼中刪除控制點（即刪除骨骼與某個或某幾個控制點的連接），可在按住【Ctrl】鍵的同時單擊黃色加亮顯示的控制點,4.使用“綁定工具”單擊選中某個形狀控制點后，選定控制點會以紅色高亮顯示，已連接到該控制點的骨骼會以黃色高亮顯示，在按住【Shift】鍵的同時單擊骨骼，可為選定控制點添加骨骼（即將該控制

13、點連接到某個骨骼） 。,5.若要從選定的控制點中刪除骨骼，可在按住【Ctrl】鍵的同時單擊以黃色高光顯示的骨骼。,任務(wù)實施——制作滑板男孩動畫,下面通過制作滑板男孩動畫，學(xué)習(xí)骨骼動畫的的實際應(yīng)用。,制作思路,,滑板男孩,打開素材文檔后，進入“滑板少年”圖形元件的編輯窗口，利用“骨骼工具”為滑板男孩添加IK骨骼，然后插入普通幀，并通過拖動各幀中男孩身體各部分，創(chuàng)建男孩和滑板搖擺的骨骼動畫；最后返回主場景，通過創(chuàng)建傳統(tǒng)補間動畫，制作滑板少年

14、由遠到近的動畫效果。本例具體操作可參考本書配套視頻“7-3.avi” 。,任務(wù)四 場景和動畫預(yù)設(shè),任務(wù)說明,在Flash中，利用場景可以組織復(fù)雜動畫；利用“動畫預(yù)設(shè)”面板可為元件實例添加Flash預(yù)設(shè)或用戶自定的動畫效果，從而快速制作出精彩的動畫特效。本任務(wù)將帶領(lǐng)讀者學(xué)習(xí)場景的基本操作和應(yīng)用動畫預(yù)設(shè)的方法。,預(yù)備知識,一、組織多場景動畫,Flash在默認情況下只使用一個場景（場景1）來組織動畫，但在制作復(fù)雜的動畫時，一個場景有時候會無

15、法滿足要求。遇到此情況時，我們可以使用多個場景來組織動畫。例如，可以使用不同的場景來組織動畫的影片簡介、影片內(nèi)容、動畫預(yù)載等部分 。,,,,多場景動畫,下面介紹在Flash CS5中創(chuàng)建及編輯場景的方法。,新建文檔后默認會自動創(chuàng)建一個“場景1”場景，要創(chuàng)建新的場景，可選擇“窗口”>“其他面板”>“場景”菜單，在打開的“場景”面板中單擊“添加場景”按鈕。新建場景后，其默認將成為當(dāng)前場景，用戶可以在其中制作動畫。要切換到其他場

16、景，可在“場景”面板中單擊相應(yīng)的場景，或單擊舞臺右上方的“編輯場景”按鈕，在展開的下拉列表中進行選擇。,,創(chuàng)建新場景,要更改場景的名稱，只需在“場景”面板中雙擊要改名的場景，使場景名稱變?yōu)榭删庉嫚顟B(tài)，然后輸入新的名稱即可。 要復(fù)制場景，只需在“場景”面板中選中要復(fù)制的場景，然后單擊“直接復(fù)制場景”按鈕即可。此時原場景中的所有內(nèi)容都將復(fù)制到新場景中。,,復(fù)制場景,在發(fā)布包含多個場景的Flash文檔時，這些場景將按照在“場景”面板中的排列

17、順序進行播放，要更改場景的播放順序，只需在“場景”面板中將希望改變順序的場景拖拽到相應(yīng)位置即可。要刪除場景，只需在“場景”面板中選中要刪除的場景，然后單擊“刪除場景”按鈕，在彈出的警告對話框中單擊“確定”按鈕即可。,,,改變場景排列順序,,二、動畫預(yù)設(shè)的應(yīng)用,下面通過一個簡單實例介紹動畫預(yù)設(shè)的應(yīng)用。,,選中要應(yīng)用動畫預(yù)設(shè)的元件實例,,為所選實例添加動畫預(yù)設(shè),1.打開素材文檔，使用“選擇工具” 選中舞臺中的“紅心”元件實例 。,2.選

18、擇“窗口”>“動畫預(yù)設(shè)”菜單，打開“動畫預(yù)設(shè)”對話框，雙擊“默認預(yù)設(shè)”文件夾，在展開的列表中選擇要應(yīng)用的動畫預(yù)設(shè)，如“脈搏”預(yù)設(shè)，然后單擊“應(yīng)用”按鈕，系統(tǒng)會根據(jù)所選預(yù)設(shè)自動為所選元件實例創(chuàng)建補間動畫。,下面通過制作節(jié)約用水的公益廣告動畫，練習(xí)遮罩動畫與路徑引導(dǎo)動畫的實際應(yīng)用，以及使用多場景組織動畫的方法。,,節(jié)約用水,制作思路,打開素材文檔后，首先利用遮罩動畫創(chuàng)建波紋和地球浮出水面的效果；然后新建并重命名場景，再在新建的場景中利