Flash動畫實例教程詳編

1、Flash CS4Flash CS4動動畫制作教程畫制作教程Flash CS4動畫制作實例教程2Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 本章主要內容：本章主要內容： FlashFlash動畫的特點和應用；動畫的特點和應用； Flash CS4Flash CS4的工作界面；的工作界面； Flash CS4Flash CS4界面的設置；界面的設置； 基本文件的操作?；疚募牟僮?。2Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 1.1 1.1 認識認識 Flash CS4Flash CS41.1.1

2、Flash1.1.1 Flash動畫的特點動畫的特點 Flash的主要特點如下：n Flash使用了矢量圖形和流式播放技術，可以隨意調整縮放，而不會影響圖形文件的大小和質量。n 通過使用關鍵幀和元件，使所生成的“.swf”格式的動畫文件非常小，便于在網絡上播放和傳播。n Flash制作的動畫，能夠交互式地將音樂、動畫、聲效等融合在一起，很多用戶已經把Flash當做一個開發(fā)多媒體的首選工具。n Flash擁有功能強大的ActionScript語言，它采用了與JavaScript類似的語法結構，擁有自己的ActionScript函數、屬性和目標對象等，并且兼容并支持Flash 低版本。 1.1.2

3、 Flash1.1.2 Flash動畫的應用動畫的應用 1 1制作動畫短片制作動畫短片 2Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 2 2制作游戲制作游戲3 3制作制作MTVMTV4 4制作多媒體教學課件制作多媒體教學課件5 5制作制作InternetInternet應用程序應用程序6 6制作網頁制作網頁1.2 Flash CS41.2 Flash CS4的工的工作界面，如右圖作界面，如右圖1-11-1所示。所示。菜單欄標題欄布局模式舞臺屬性面板繪圖工具箱時間軸/圖層/動畫編輯器窗口1.2.1 1.2.1 標題欄標題欄1.2.2 1.2.2 菜

4、單欄菜單欄 1.2.3 1.2.3 主工具欄主工具欄1.2.4 1.2.4 繪圖工具箱繪圖工具箱圖1-12Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 單擊“小三角”可以展開下一級菜單進行選擇1.2.4 1.2.4 繪圖工具箱繪圖工具箱圖1-2 繪圖工具箱如右圖1-2所示,它包含了10多種繪圖工具，用戶可以使用這些工具對圖像或選定區(qū)進行操作。單擊繪圖工具箱右上角的 按鈕，可以將工具箱折疊為圖標 。若要展開面板可單擊 按鈕或 圖標；另外，可以把面板縮放成單列或多列。2Flash CS4Flash CS4動動畫制作教程畫制作教程2第1章 Flash C

5、S4入門 1.2.5 1.2.5 時間軸時間軸 時間軸面板如右圖所示，它的主要組件是層、幀和播放頭，還包括一些信息指示器，如圖1-3所示。 層幀播放頭信息指示器1.2.6 1.2.6 場景與舞臺場景與舞臺 在當前編輯的動畫窗口中，我們把動畫內容編輯的整個區(qū)域叫做場景。舞臺就是繪制和編輯動畫內容的矩形區(qū)域 ，具體如圖1-4所示。 圖1-3Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 場景名稱舞臺工作區(qū)舞臺比例圖1-4 場景和舞臺 2Flash CS4Flash CS4動動畫制作教程畫制作教程第1章 Flash CS4入門 1.3 Flash CS41

6、.3 Flash CS4界面的設置界面的設置1.3.1 1.3.1 動畫屬性的設置動畫屬性的設置 按照下列步驟設置動畫屬性：第1步：打開【屬性】面板,它會顯示整個動畫的屬性。第2步：點擊【550400像素】右側的【編輯】按鈕，彈出【文檔屬性】對話框。第3步：在【幀頻】框鍵入正確的放映速度，即幀每秒。默認值24，即動畫的每一秒要顯示24幀畫面。第4步：在【尺寸】框中，輸入電影的寬度和高度值。最小為18像素，最大為2880像素。第5步：點擊【背景顏色】右側的色框，在彈出的顏色面板里用戶可以選擇動畫背景的顏色。第6步：單擊【確定】。2Flash CS4Flash CS4動動畫制作教程畫制作教程第1章

7、 Flash CS4入門 1.3.2 1.3.2 時間軸線的設置時間軸線的設置1.3.3 1.3.3 工具欄、工具面板的設置工具欄、工具面板的設置 工具欄、工具面板以及工作區(qū)等都可以在屏幕上任意拖動，用戶可以將其拖放到最適合自己操作的位置。 1.4 基本文件的操作 1.4.1 1.4.1 創(chuàng)建新文檔創(chuàng)建新文檔 1.4.2 Flash1.4.2 Flash文檔的操作文檔的操作2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：設計一個小球從上向下運動的動畫設計一個小球從上向下運動的動畫 實訓實訓2 2：設計一個小球由大漸小的動畫 第1章 Flash CS4入門 提示提

8、示: :先用橢圓工具繪一個小球,然后在第1關鍵幀把小球位置放在舞臺上方，在第30關鍵幀把小球位置放在舞臺下方,最后在第1幀至30幀之間創(chuàng)建補間形狀動畫。提示提示: :用橢圓工具繪一個小球； 用變形工具將第30關鍵幀的小球縮小；在第1幀至30幀之間創(chuàng)建補間形狀動畫。2Flash CS4Flash CS4動動畫制作教程畫制作教程第2章 工具的使用 本章主要內容：本章主要內容： 矢量圖和位圖；矢量圖和位圖； 線條和填充圖形；線條和填充圖形； Flash CS4Flash CS4常用工具的功能及其使用。常用工具的功能及其使用。2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一

9、：制作一張制作一張“幾何形體圖幾何形體圖” , ,效果如圖2-1所示。任務二：任務二：制作一張制作一張“荷花圖荷花圖”，效果如圖2-2所示。第2章 工具的使用（圖2-1）（圖2-2）2Flash CS4Flash CS4動動畫制作教程畫制作教程任務三：任務三：制作一張制作一張“春天美景圖春天美景圖” , ,效果如圖2-3所示。第2章 工具的使用（圖2-3）2Flash CS4Flash CS4動動畫制作教程畫制作教程問題與思考：問題與思考：第2章 工具的使用 Flash CS4Flash CS4的工具箱中的各種工具如的工具箱中的各種工具如何使用？何使用？ 如何繪制圖形？如何繪制圖形？ 如何編輯

10、圖形？如何編輯圖形？2Flash CS4Flash CS4動動畫制作教程畫制作教程第2章 工具的使用2.2.1 2.2.1 矢量圖和位圖矢量圖和位圖 矢量圖形使用稱作矢量的直線和曲線描述圖像，矢量也包括顏色和位置屬性。矢量圖形與分辨率無關，它適合于線性圖，特別是二維卡通動畫，能夠有效地減少文件容量。位圖圖形使用稱作像素的排列在網格內的彩色點來描述圖像。在編輯位圖圖形時，修改的是像素，而不是直線和曲線。位圖圖形跟分辨率有關，位圖適合表現(xiàn)層次和色彩細膩豐富，包含大量細節(jié)的圖像。 2.2.2 2.2.2 線條和填充圖形線條和填充圖形 線條，是指用線條工具、鋼筆工具、鉛筆工具繪制的圖形以及由橢圓工具、

11、矩形工具繪制的邊框線。調整線條的粗細可以使用屬性面板中的“筆觸”數值的大小來改變；改變線條顏色可以使用墨水瓶工具。 填充圖形，是指用刷子工具繪制的圖形，或者是由橢圓工具、矩形工具繪制的圖形的填充部分。填充圖形的顏色不能通過墨水瓶工具來改變，只能使用顏料桶工具來調整。2Flash CS4Flash CS4動動畫制作教程畫制作教程第2章 工具的使用2.2.3 2.2.3 工具介紹工具介紹（圖2-4 繪圖工具箱）2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“幾何圖形幾何圖形” 實訓實訓2 2：制作制作“鄉(xiāng)間美景圖鄉(xiāng)間美景圖 ”，效果如圖，效果如圖2-52-

12、5所示。所示。 要求：要求：繪制正方形、矩形、多邊形、圓、五角星等幾何圖表，并自定顏色填充。第2章 工具的使用圖2-52Flash CS4Flash CS4動動畫制作教程畫制作教程 要求：要求：用3D工具制作由6張大小相同但內容不同的圖片構成的正方體圖形第2章 工具的使用實訓實訓4 4：制作制作“正方體圖正方體圖 ” ” 實訓實訓3 3：設計制作設計制作“卡通人物圖卡通人物圖 ”，效果如圖，效果如圖2-62-6所示。所示。 圖2-62Flash CS4Flash CS4動動畫制作教程畫制作教程第3章 文本處理本章主要內容：本章主要內容： 文本的類型及屬性的設置；文本的類型及屬性的設置； 文本的

13、輸入及編輯；文本的輸入及編輯； 文字效果和靜態(tài)動畫的制作。文字效果和靜態(tài)動畫的制作。2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：制作制作 “ “漸變色的文字漸變色的文字”的動畫的動畫 , ,效果如圖3-1所示。任務二：任務二：制作制作 “ “金屬文字金屬文字”的動畫的動畫 ，效果如圖3-2所示。第3章 文本處理（圖3-1）（圖3-2）2Flash CS4Flash CS4動動畫制作教程畫制作教程任務三：任務三：制作一幅制作一幅“霓虹廣告霓虹廣告”的動畫的動畫 , ,效果如圖3-3所示。第3章 文本處理（圖3-3 第1幀和第5幀的效果圖）2Flash CS4Fl

14、ash CS4動動畫制作教程畫制作教程問題與思考：問題與思考：第3章 文本處理 文本有哪些類型？文本有哪些類型？ 文字轉化為矢量圖形的方法是什么？文字轉化為矢量圖形的方法是什么？ 如何制作文字效果？如何制作文字效果？ 靜態(tài)動畫如何制作？靜態(tài)動畫如何制作？2Flash CS4Flash CS4動動畫制作教程畫制作教程2第3章 文本處理3.2.1 3.2.1 文本及其類型文本及其類型 在Flash CS4中，文本類型可分為3種：靜態(tài)文本、動態(tài)文本和輸入文本。三種類型的切換方法是在文本工具屬性面板的第一個下拉列表框中選擇。 一般情況下默認的文本是靜態(tài)文本，在動畫播放過程中，靜態(tài)文本區(qū)域中的文字是不可

15、編輯和改變的，但是可以對靜態(tài)文本塊進行縮放、旋轉或者扭曲，可以為他們指定不同的顏色和透明度效果。動態(tài)文本就是可編輯的文本，在動畫播放過程中，文本區(qū)域的文字可通過事件的激發(fā)來改變。輸入文本就是在動畫播放過程中，提供我們輸入文本，產生交互。它允許用戶在空的文本區(qū)域中輸入文字，用于填充表格，回答調查的問題或者輸入密碼等。 3.2.2 3.2.2 設置文本屬性設置文本屬性3.2.3 3.2.3 設置段落屬性設置段落屬性1 1設置段落的對齊方式設置段落的對齊方式2 2設置邊距和間距設置邊距和間距Flash CS4Flash CS4動動畫制作教程畫制作教程第3章 文本處理3.2.4 3.2.4 文本的輸入

16、文本的輸入 分為水平方向輸入和垂直方向輸入兩種。分為水平方向輸入和垂直方向輸入兩種。 3.2.5 3.2.5 文本的編輯文本的編輯1 1轉換文本類型轉換文本類型2. 2. 分散文字：分散文字： 分散文字就是將文字轉換為矢量圖形，具體操作是使用【修改】/【分離】命令。 3. 3. 填充文字填充文字 注意：注意：一旦把字符轉換成線條和填充以后，就不能把它們作為文本來編輯。即使重新組合字符或者把它們轉換成符號，也不能再應用字體、字距或是段落選項。2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“數學公式數學公式” ，效果如圖3-4所示。實訓實訓2 2：制作制作

17、“空心字空心字 ”，效果如圖，效果如圖3-53-5所示。所示。 第3章 文本處理圖3-4實訓實訓3 3：設計制作“霓虹燈廣告”。圖3-52Flash CS4Flash CS4動動畫制作教程畫制作教程第4章 元件和庫本章主要內容：本章主要內容： 元件的類型；元件的類型； 元件的創(chuàng)建和編輯；元件的創(chuàng)建和編輯； 實例的編輯；實例的編輯； 庫的使用；庫的使用； 元件的制作元件的制作 2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：制作制作 “ “漸變色的文字漸變色的文字”的動畫的動畫 , ,效果如圖3-1所示。任務二：任務二：制作制作 “ “金屬文字金屬文字”的動畫的動畫

18、 ，效果如圖3-2所示。第4章 元件和庫（圖3-1）（圖3-2）2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：如何創(chuàng)建圖形元件如何創(chuàng)建圖形元件 。第4章 元件和庫（圖4-1)要求要求: :創(chuàng)建一圖形元件，效果如圖4-1所示 任務二：任務二：如何創(chuàng)建圖形元件如何創(chuàng)建圖形元件 。要求要求: :創(chuàng)建一“動態(tài)按鈕”元件，設置四個關鍵幀中按鈕顏色屬性變化，鼠標在“動態(tài)按鈕”上“按下”、“彈起”等不同狀態(tài)會出現(xiàn)不同的效果，如圖4-2所示。圖4-2“鼠標按下”和“鼠標彈起”時按鈕狀態(tài)2Flash CS4Flash CS4動動畫制作教程畫制作教程第4章 元件和庫（圖4-3)任務

19、三：任務三：如何創(chuàng)建影片剪輯元件如何創(chuàng)建影片剪輯元件 。要求要求: :創(chuàng)建一影片剪輯元件，組成四個正方形在舞臺上旋轉的動畫，如圖4-3所示 。2Flash CS4Flash CS4動動畫制作教程畫制作教程問題與思考：問題與思考：第4章 元件和庫 元件的類型有哪些？元件的類型有哪些？ 如何制作元件？如何制作元件？ 如何使用元件？如何使用元件？ 元件庫如何使用？元件庫如何使用？2Flash CS4Flash CS4動動畫制作教程畫制作教程第4章 元件和庫4.2.1 4.2.1 在動畫中使用元件的優(yōu)點在動畫中使用元件的優(yōu)點1 1可以簡化動畫的制作過程可以簡化動畫的制作過程2 2減小文件大小減小文件大

20、小3 3方便網絡傳輸方便網絡傳輸4.2.2 4.2.2 元件的類型元件的類型 元件主要有圖形、影片剪輯和按鈕3種類型，不同類型的元件有著不同的作用。 4.2.3 4.2.3 元件的創(chuàng)建元件的創(chuàng)建 1 1創(chuàng)建新元件創(chuàng)建新元件2 2將舞臺元素轉換為元件將舞臺元素轉換為元件2Flash CS4Flash CS4動動畫制作教程畫制作教程第4章 元件和庫4.2.4 4.2.4 編輯元件編輯元件 1 1編輯元件的方法編輯元件的方法2 2元件的編輯元件的編輯 4.2.5 4.2.5 創(chuàng)建與編輯實例創(chuàng)建與編輯實例1 1將元件的實例添加至舞臺將元件的實例添加至舞臺2 2編輯實例編輯實例4.2.6 4.2.6 庫

21、和公用庫庫和公用庫1 1定義公用庫定義公用庫2 2使用公用庫使用公用庫2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“環(huán)環(huán)相扣圖形元件環(huán)環(huán)相扣圖形元件” ，效果如圖4-4所示。實訓實訓2 2：制作“變色按鈕” ，效果如圖，效果如圖4-54-5所示。所示。 第4章 元件和庫圖4-4實訓實訓3 3：制作“一小球從大變小的影片剪輯元件” 。圖4-5“彈起”時效果 “鼠標經過”時效果 “按下”時效果 要求：要求：將實訓1至實訓3所制作的元件從庫中拖放到舞臺上，將實訓3轉換為圖形元件。 實訓實訓4 4：實例的編輯2Flash CS4Flash CS4動動畫制作教

22、程畫制作教程第5章 逐幀動畫動畫的原理動畫的原理；幀的概念、分類和基本操作；幀的概念、分類和基本操作；逐幀動畫的創(chuàng)建。逐幀動畫的創(chuàng)建。本章主要內容：本章主要內容：2Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 任務一：任務一：制作制作“奔跑的豹子奔跑的豹子”動畫動畫要求：要求：制作一只豹子奔跑運動（設計效果如下圖5-1所示）。圖5-12Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 任務二：任務二：制作制作“倒計時效果倒計時效果”動畫動畫要求：要求：制作在一個紅色圓角矩形背景下顯示“5、4、3、1、GO！”的倒計時動畫效果（設計效果

23、如下圖5-2所示）。圖5-22Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 要求：要求：制作花盆中的花兒逐漸成長，并生成一朵花的動畫效果（設計效果如下圖5-3所示）。任務三：任務三：制作制作“花逐漸成長的過程花逐漸成長的過程”動畫動畫圖5-32Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 動畫的基本原理是什么？動畫的基本原理是什么？ 如何創(chuàng)建逐幀動畫？如何創(chuàng)建逐幀動畫？什么叫幀？什么叫幀？幀分為幾種類型？幀分為幾種類型？如何操作幀？如何操作幀？問題與思考：問題與思考：2Flash CS4Flash CS4動動畫制作教程畫制作教程第

24、5章 逐幀動畫 5.2.1 5.2.1 動畫基本原理動畫基本原理 動畫就是通過連續(xù)播放一系列畫面，給視覺造成連續(xù)變化的圖畫，它的基本原理與電影、電視一樣，都是視覺原理。動畫不是“會動的畫”，而是“畫出來的運動”。5.2.2 5.2.2 幀的顯示形式及操作幀的顯示形式及操作 1. 幀的概念：構成動畫的每一個畫面叫做一個幀。2. 幀的分類：空白幀、關鍵幀和空白關鍵幀3. 幀的操作：包括添加幀 、刪除幀 、清除關鍵幀 、選擇所有幀 、復制幀 、粘貼幀 、移動幀 和翻轉幀 5.2.3 5.2.3 逐幀動畫知識介紹逐幀動畫知識介紹創(chuàng)建逐幀動畫的典型方法主要有以下幾種：n從外部導入素材生成逐幀動畫，如導入

25、靜態(tài)的圖片和序列圖像等。n使用數字或者文字制作逐幀動畫，如實現(xiàn)文字跳躍或旋轉等特效動畫。n繪制矢量逐幀動畫。應用各種設計工具在場景中繪制矢量逐幀動畫。2Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 實訓實訓1 1 ：制作制作“手指計數手指計數”動畫，如圖動畫，如圖5-45-4所示。所示。實訓實訓2 2： 制作制作“毛筆寫字毛筆寫字”動畫，如圖動畫，如圖5-55-5所示所示 圖5-4圖5-52Flash CS4Flash CS4動動畫制作教程畫制作教程第5章 逐幀動畫 實訓實訓3 3： 制作制作“變臉變臉”動畫，如圖動畫，如圖5-65-6所示。所示。 實訓實訓4

26、4： 制作制作“卡通人走路卡通人走路”動畫動畫 提示：提示： 用繪制工具繪制卡通人物走路的圖形元件：在各關鍵幀中，直接修改人物走路的圖形元件，使不同時刻的走路姿勢不一樣，從而創(chuàng)建逐幀動畫。圖5-62Flash CS4Flash CS4動動畫制作教程畫制作教程第6章 補間形狀動畫創(chuàng)建補間形狀動畫需要的條件；創(chuàng)建補間形狀動畫需要的條件；如何創(chuàng)建補間形狀動畫；如何創(chuàng)建補間形狀動畫；補間形狀動畫的屬性設置；補間形狀動畫的屬性設置；形狀提示符的使用：形狀提示符的使用：圖層的基本操作。圖層的基本操作。本章主要內容：本章主要內容：2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：

27、制作制作“矩形變心形（矩形變心形（1 1）”動畫。動畫。效果如圖6-1所示 （圖（圖6-1）要求：要求：矩形有規(guī)律地變化成心形（效果如圖6-2所示）。任務二：任務二：制作制作“矩形變心形（矩形變心形（2 2）”動畫動畫（圖（圖6-2）第6章 補間形狀動畫 2Flash CS4Flash CS4動動畫制作教程畫制作教程任務三：任務三：制作制作“文字變形文字變形”動畫。動畫。要求：要求：制作一個英文字母“A”變化成字母“B”的動畫（效果如圖6-3所示）。（圖6-3）要求：要求：先由一個樹樁漸漸生長成一棵樹，然后在樹枝上桃花朵朵綻放。（效果如圖6-4所示）。任務四：任務四：制作制作“桃花朵朵開桃花朵

28、朵開”動畫動畫（圖6-4）第6章 補間形狀動畫 2Flash CS4Flash CS4動動畫制作教程畫制作教程如何創(chuàng)建補間形狀動畫？如何創(chuàng)建補間形狀動畫？創(chuàng)建補間形狀動畫有什么條件？創(chuàng)建補間形狀動畫有什么條件？如何控制補間形狀變化？如何控制補間形狀變化？圖層的作用是什么？圖層的作用是什么？如何創(chuàng)建和編輯圖層？如何創(chuàng)建和編輯圖層？問題與思考：問題與思考：第6章 補間形狀動畫 2Flash CS4Flash CS4動動畫制作教程畫制作教程6.2.1 6.2.1 補間形狀動畫補間形狀動畫 第6章 補間形狀動畫 1創(chuàng)建補間形狀動畫需要的條件創(chuàng)建補間形狀動畫需要的條件 補間形狀動畫可以實現(xiàn)兩個圖形之間顏

29、色、形狀、大小和位置的過渡。創(chuàng)建補間形狀動畫需要一定的條件：n 在一個補間形狀動畫中至少要有兩個關鍵幀。n 這兩個關鍵幀中的對象必須是可編輯的矢量圖形對象。一次補間一個形狀通?？梢垣@得最佳效果。如果一次補間多個形狀，則所有的形狀必須在同一個層上。如果要使用群組對象、圖符引例對象或位圖圖像創(chuàng)建形狀補間動畫，需要先將其分離成矢量圖形。n 這兩個關鍵幀中的圖形必須有一些變化，否則制作的動畫將沒有動的效果。2 2創(chuàng)建補間形狀動畫創(chuàng)建補間形狀動畫 創(chuàng)建補間形狀動畫有兩種方法，一是通過右鍵菜單創(chuàng)建補間形狀動畫，二是使用菜單命令創(chuàng)建補間形狀動畫。 2Flash CS4Flash CS4動動畫制作教程畫制作教

30、程第6章 補間形狀動畫 3 3刪除補間形狀動畫刪除補間形狀動畫4. 4. 補間形狀動畫屬性設置補間形狀動畫屬性設置 設置運動速度設置動畫中間形狀效果5 5形狀提示形狀提示 首先選擇已經創(chuàng)建補間形狀動畫兩個關鍵幀之間的任意一幀，然后打開幀【屬性】面板，如右圖6-5所示。 在制作補間形狀動畫后，加入形狀提示可控制更加復雜的形狀變化。 圖6-52Flash CS4Flash CS4動動畫制作教程畫制作教程第6章 補間形狀動畫 6.2.2 6.2.2 圖層圖層1 1圖層面板，如下圖圖層面板，如下圖6-66-6所示。所示。2 2圖層的基本操作圖層的基本操作 圖層圖標可編輯圖層圖標隱藏/顯示圖層鎖定圖標顯

31、示所有圖層的輪廓刪除圖層新建圖層新建圖層文件夾圖6-62Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“矩形變圓形矩形變圓形”動畫動畫實訓實訓2 2：制作制作“文字變化文字變化”動畫動畫第6章 補間形狀動畫 提示：提示：制作數字“2”向數字“3”的形狀補間動畫前要把文字分離，創(chuàng)建補間動畫后需加入形狀提示控制形變，如下圖6-7所示。 圖6-72Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓3 3：制作制作“圖形變文字圖形變文字”動畫動畫 實訓實訓4 4：制作制作“文字變圖形文字變圖形”動畫動畫 要求要求：一個“心”字逐漸地變成了心形，

32、然后又變化為兩個心形的動畫，效果如下圖6-9所示。第6章 補間形狀動畫 要求：要求：四顆五角星從禮盒中旋轉而出，隨即轉變?yōu)椤肮?jié)日快樂”四個字的動畫，如下圖6-8所示。圖6-8圖6-92Flash CS4Flash CS4動動畫制作教程畫制作教程第7章 傳統(tǒng)補間動畫創(chuàng)建傳統(tǒng)補間動畫需要的條件；創(chuàng)建傳統(tǒng)補間動畫需要的條件；傳統(tǒng)補間動畫的創(chuàng)建；傳統(tǒng)補間動畫的創(chuàng)建；傳統(tǒng)補間動畫的屬性設置；傳統(tǒng)補間動畫的屬性設置；場景的使用場景的使用本章主要內容：本章主要內容：2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：制作制作“小球碰撞小球碰撞”動畫，動畫， 效果如圖7-1所示。（圖

33、（圖7-1）任務二：任務二：制作制作“旋轉的風車旋轉的風車”動畫，動畫，效果如圖7-2所示。（圖（圖7-2）第7章 傳統(tǒng)補間動畫 要求：要求：制作一幅動畫，一個紅色小球垂直下落時碰到地面上的綠色小球，紅球彈起，綠球向遠處滾去并慢慢消失（效果如圖7-1所示）。任務三：任務三：制作制作“多場景動畫多場景動畫”。要求：要求：按片頭、動畫、片尾3個場景的順序播放動畫內容。 2Flash CS4Flash CS4動動畫制作教程畫制作教程問題與思考：問題與思考：第7章 傳統(tǒng)補間動畫傳統(tǒng)補間動畫與補間形狀動畫有什么區(qū)別？傳統(tǒng)補間動畫與補間形狀動畫有什么區(qū)別？創(chuàng)建傳統(tǒng)補間動畫，應滿足什么條件？創(chuàng)建傳統(tǒng)補間動畫

34、，應滿足什么條件？ 多場景動畫如何制作？多場景動畫如何制作？ 2Flash CS4Flash CS4動動畫制作教程畫制作教程第7章 傳統(tǒng)補間動畫7.2.1 7.2.1 傳統(tǒng)補間動畫傳統(tǒng)補間動畫1. 1. 創(chuàng)建傳統(tǒng)補間動畫條件創(chuàng)建傳統(tǒng)補間動畫條件n 在兩個關鍵幀中，只能有一個元件的實例或群組物體、文字。n 必須作用在相同的對象上才能創(chuàng)造出移動和縮放的效果。n 動畫的兩個關鍵幀畫面不能有矢量圖形存在。2. 創(chuàng)建創(chuàng)建傳統(tǒng)補間動畫方法傳統(tǒng)補間動畫方法 創(chuàng)建傳統(tǒng)補間動畫也有兩種方法，一種是通過右鍵快捷菜單，一種通過菜單命令。 3. 刪除刪除傳統(tǒng)補間動畫傳統(tǒng)補間動畫4. 4. 傳統(tǒng)補間動畫的屬性設置傳統(tǒng)補

35、間動畫的屬性設置（1）緩動：通過【緩動】選項右邊輸入一個數值來調整變化速率，從而創(chuàng)建更為自然的由先慢后快或先快后慢的減速效果。 （2）旋轉：用于設置對象旋轉的動畫 2Flash CS4Flash CS4動動畫制作教程畫制作教程第7章 傳統(tǒng)補間動畫（3）【貼緊】：勾選該項，可以將對象貼緊到引導線上。（4）【同步】：勾選項該項，可以使圖形元件實例的動畫和主時間同步。（5）【調整到路徑】：制作運動引導線動畫時，勾選該項，可以使動畫對象沿著路徑運動。（6）【縮放】：勾選項該項，用于改變對象的大小。 7.2.2 7.2.2 場景場景1 1場景的使用場景的使用 執(zhí)行【窗口】/【其他面板】/【場景】命令，則

36、會調出【場景】面板，使用場景的好處和模塊化設計的優(yōu)勢一樣，便于分工協(xié)作、便于修改。2 2場景的添加和切換場景的添加和切換 3 3場景的命名場景的命名4 4場景的刪除及復制場景的刪除及復制2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“矩形變圓形矩形變圓形”動畫動畫實訓實訓2 2：制作制作“旋轉的指針旋轉的指針”動畫動畫 第7章 傳統(tǒng)補間動畫 要求：要求：通過改變對象位置、【顏色】和“Alpha”值，創(chuàng)建傳統(tǒng)補間動畫的方法。 提示：提示：先創(chuàng)建“指針”圖形元件，并把它的變形中心調整到指針下端。然后通過改變【變形】面板中的【旋轉】值創(chuàng)建傳統(tǒng)補間動畫。實訓實

37、訓3 3：制作制作“圖片翻轉圖片翻轉”動畫，效果如下圖動畫，效果如下圖7-3所示。所示。 圖圖7-37-32Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓4 4：制作制作“卡通火車在行駛卡通火車在行駛”動畫動畫 ，效果如下圖7-4所示。第7章 傳統(tǒng)補間動畫 提示：提示：先分層繪制“田野”和“鐵軌”背景“火車”元件，再通過改變火車位置，創(chuàng)建“火車”的補間動畫。實訓5：制作一個多場景動畫 圖7-42Flash CS4Flash CS4動動畫制作教程畫制作教程第8章 補間動畫 “ “補間動畫補間動畫”中常見的基本概念；中常見的基本概念； “ “補間動畫補間動畫”的創(chuàng)建；的創(chuàng)建；

38、 自定義動畫預設操作；自定義動畫預設操作； 動畫編輯器的使用。動畫編輯器的使用。 本章主要內容：本章主要內容：2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：制作制作“滾動的小球滾動的小球”動畫動畫, ,效果如圖8-1所示。（圖8-2）任務二：任務二：制作制作“沖浪小子沖浪小子”動畫動畫，效果如圖8-2所示。（圖8-1）第8章 補間動畫 要求：要求：小球自下往上運動時，速度由快到慢；而當小球從上往下運動時，速度由慢到快。要求：要求：沖浪員沿著事先設計好的運動路線運動（沖浪），然后慢慢地消失。 2Flash CS4Flash CS4動動畫制作教程畫制作教程任務三：任

39、務三：制作制作“家具家具”動畫廣告動畫廣告 , ,效果如圖8-3所示。（圖8-3）第8章 補間動畫 要求：要求：在一片清爽的綠色背景圖中，顯示著“綠色設計 綠色環(huán)?！蔽淖?，沙發(fā)由左向右?guī)в羞\動模糊進入舞臺，相應的說明文字由小到大在顯示的動畫效果 。2Flash CS4Flash CS4動動畫制作教程畫制作教程問題與思考：問題與思考：第8章 補間動畫 如何創(chuàng)建補間動畫？如何創(chuàng)建補間動畫？可補間的對象的屬性包括哪些？可補間的對象的屬性包括哪些？如何應用動畫預設？如何應用動畫預設？ 傳統(tǒng)補間動畫與補間動畫有什么區(qū)別？傳統(tǒng)補間動畫與補間動畫有什么區(qū)別？如何使用動畫編輯器？如何使用動畫編輯器？ 2Fla

40、sh CS4Flash CS4動動畫制作教程畫制作教程第8章 補間動畫 8.2.1 8.2.1 補間動畫補間動畫 1 1基本概念基本概念 （1）補間：補間是通過為一個幀中的對象屬性指定一個值并為另一個幀中的相同屬性指定另一個值創(chuàng)建的動畫。 （2）補間范圍：補間范圍是時間軸中的一組幀，其舞臺上的對象的一個或多個屬性可以隨著時間而改變。補間范圍在時間軸中顯示為具有淺藍色背景的單個圖層中的一組幀。 （3）目標對象：在每個補間范圍中，只能對舞臺上的一個對象進行動畫處理，此對象稱為補間范圍的目標對象。 （4）關鍵幀和屬性關鍵幀：Flash CS4 中，“關鍵幀”是指時間軸中其元件實例首次出現(xiàn)在舞臺上的幀

41、；“屬性關鍵幀”是指在補間范圍中為補間目標對象顯式定義一個或多個屬性值的幀。 （5）運動路徑：如果補間對象在補間過程中更改其舞臺位置，則補間范圍具有與之關聯(lián)的運動路徑。 2Flash CS4Flash CS4動動畫制作教程畫制作教程第8章 補間動畫 2 2創(chuàng)建補間動畫創(chuàng)建補間動畫 創(chuàng)建補間動畫與創(chuàng)建傳統(tǒng)補間動畫的方法一樣，創(chuàng)建補間動畫后的【時間軸】面板如所示。 圖8-48.2.2 8.2.2 使用動畫編輯器調整補間動畫使用動畫編輯器調整補間動畫 在Flash CS4中通過動畫編輯器可以查看所有補間屬性和屬性關鍵幀，從而對補間動畫進行全面細致控制。在【時間軸】面板中選擇已經創(chuàng)建的補間范圍，或者選

42、擇舞臺中已經創(chuàng)建補間動畫的對象后，然后單擊菜單欄中的【窗口】/【動畫編輯器】命令，可以彈出一個如圖8-5所示的【動畫編輯器】面板。 2Flash CS4Flash CS4動動畫制作教程畫制作教程第8章 補間動畫 圖8-5 【動畫編輯器】面板2Flash CS4Flash CS4動動畫制作教程畫制作教程 單擊菜單欄中的【窗口】/【動畫預設】命令，可將該面板展開，如圖8-6所示。第8章 補間動畫 圖8-68.2.3 8.2.3 動畫預設動畫預設1 1【動畫預設動畫預設】窗口的打開窗口的打開 預覽窗口預設區(qū)列表將選區(qū)中另存為預設2 2應用動畫預設應用動畫預設應用動畫預設的具體步驟如下：第1步：在舞臺

43、上選擇需要添加動畫預設的對象。第2步：在動畫預設面板的預設列表中選擇需要應用的預設，F(xiàn)lash隨附的每個動畫預設都包括預覽，通過在上方的“預覽窗口”中進行動畫的顯示預覽。第3步：選擇合適的動畫預設后，單擊動畫預設面板中的【應用】按鈕，就可以將選擇預設應用到舞臺選擇的對象中。 2Flash CS4Flash CS4動動畫制作教程畫制作教程第8章 補間動畫 3 3將補間另存為自定義動畫預設將補間另存為自定義動畫預設 將補間另存為自定義動畫預設的操作可以通過【動畫預設】面板下方的【將選區(qū)另存為預設】按鈕完成。 4 4創(chuàng)建自定義預設的預覽創(chuàng)建自定義預設的預覽創(chuàng)建自定義預設的預覽，具體步驟如下：第1步：

44、創(chuàng)建補間動畫，并將其另存為自定義預設。第2步：然后創(chuàng)建一個只包含補間動畫的FLA文件，注意使用與自定義預設完全相同的名稱將其保存為FLA文件，并通過【發(fā)布】命令將FLA文件創(chuàng)建SWF文件。第3步：將剛才創(chuàng)建的SWF格式文件放置在已保存的自定義動畫預設XML文件所在目錄中，如果用戶使用的是windows系統(tǒng)，那么就可以放置在如下目錄中：/Documents and Settings/Local Settings/Application Data/Adobe/Flash CS4/Configuration/motion Presets/中。2Flash CS4Flash CS4動動畫制作教程畫制作

45、教程實訓實訓1 1 ：制作制作“小球彈跳小球彈跳”動畫動畫 實訓實訓2 2：設計制作一個廣告動畫設計制作一個廣告動畫 提示：提示：通過改變小球位置從而添加屬性關鍵幀，再編輯補間路徑，使小球的彈跳具有真實性。 提示：提示：從網絡中尋找相關廣告的背景圖并導入舞臺；輸入廣告詞，分層管理；創(chuàng)建補間動畫后，在【動畫編輯器】面板中編輯動畫。實訓實訓3 3：設計制作骨骼動畫設計制作骨骼動畫 。 第8章 補間動畫 提示：提示：通過上網查找骨骼動畫（反向運動動畫）的資料，了解骨骼動畫的制作方法。根據資料介紹，自己設計制作一個骨骼動畫。 2Flash CS4Flash CS4動動畫制作教程畫制作教程第9章 遮罩層

46、動畫 本章主要內容：本章主要內容： 遮罩圖層的作用；遮罩圖層的作用； 遮罩圖層的創(chuàng)建；遮罩圖層的創(chuàng)建； 遮罩層動畫的制作。遮罩層動畫的制作。2Flash CS4Flash CS4動動畫制作教程畫制作教程任務一：任務一：制作制作“聚光燈效果聚光燈效果”動畫動畫 , ,效果如圖9-1所示。（圖9-2）任務二：任務二：制作制作“顏色變化的圓環(huán)顏色變化的圓環(huán)”動畫動畫 ，效果如圖9-2所示。第9章 遮罩層動畫要求：要求：聚光燈左右不斷移動形成的聚光效果 。（圖9-1）任務三：任務三：制作制作“鏡頭劃變轉換鏡頭劃變轉換”動畫動畫 ，效果如右圖9-3所示。（圖9-3）2Flash CS4Flash CS4

47、動動畫制作教程畫制作教程問題與思考：問題與思考：第9章 遮罩層動畫 遮罩圖層有什么作用？遮罩圖層有什么作用？ 如何創(chuàng)建遮罩圖層？如何創(chuàng)建遮罩圖層？ 如何制作遮罩層動畫如何制作遮罩層動畫? ?2Flash CS4Flash CS4動動畫制作教程畫制作教程第9章 遮罩層動畫9.2.1 9.2.1 遮罩圖層的作用遮罩圖層的作用 遮罩層中有動畫對象存在的地方，都產生一個孔，使其鏈接的被遮罩層相應區(qū)域中的對象顯示出來。 9.2.2 9.2.2 創(chuàng)建遮罩圖層創(chuàng)建遮罩圖層1 1利用快捷菜單創(chuàng)建遮罩圖層利用快捷菜單創(chuàng)建遮罩圖層2 2在在【圖層屬性圖層屬性】對話框中進行設置對話框中進行設置9.2.3 9.2.3

48、 取消遮罩圖層取消遮罩圖層9.2.4 9.2.4 構成遮罩和被遮罩的元素構成遮罩和被遮罩的元素 遮罩層中的圖形對象在播放時是看不到的，遮罩層中的內容可以是按鈕、影片剪輯、圖形、位圖、文字等，但不能使用線條，如果一定要用線條，可以將線條轉化為“填充”。9.2.5 9.2.5 遮罩層中可以使用的動畫形式遮罩層中可以使用的動畫形式 2Flash CS4Flash CS4動動畫制作教程畫制作教程第9章 遮罩層動畫9.2.3 9.2.3 取消遮罩圖層取消遮罩圖層9.2.4 9.2.4 構成遮罩和被遮罩的元素構成遮罩和被遮罩的元素 遮罩層中的圖形對象在播放時是看不到的，遮罩層中的內容可以是按鈕、影片剪輯、

49、圖形、位圖、文字等，但不能使用線條，如果一定要用線條，可以將線條轉化為“填充”。9.2.5 9.2.5 遮罩層中可以使用的動畫形式遮罩層中可以使用的動畫形式 取消圖層的遮罩屬性有下面兩種方法：1、在時間軸的遮罩層單擊鼠標右鍵，從彈出的快捷菜單中選擇【遮罩層】選項，當【遮罩層】前沒有了“”符號，就取消了遮罩屬性。2、選擇某個圖層，選擇【修改】/【時間軸】/【圖層屬性】命令，打開【圖層屬性】對話框，在【類型】中選擇【一般】，就取消了遮罩屬性。 可以在遮罩層、被遮罩層中分別或同時使用補間形狀動畫、傳統(tǒng)補間動畫、引導層動畫等動畫手段，從而使遮罩動畫變成一個可以施展無限想象力的創(chuàng)作空間。 2Flash CS4Flash CS4動動畫制作教程畫制作教程實訓實訓1 1 ：制作制作“電影謝幕電影謝幕”動畫動畫 實訓實訓2 2：制作制作“水波紋效果水波紋效果”動畫動畫 要求：要求：字幕在升入過程中逐漸顯示