Flash動畫實例教程PPT演示課件
Flash CS4動畫制作實例教程,2,第1章 Flash CS4入門,本章主要內(nèi)容:,Flash動畫的特點和應(yīng)用; Flash CS4的工作界面; Flash CS4界面的設(shè)置; 基本文件的操作。,2,第1章 Flash CS4入門 ,1.1 認(rèn)識 Flash CS4,1.1.1 Flash動畫的特點,Flash的主要特點如下: Flash使用了矢量圖形和流式播放技術(shù),可以隨意調(diào)整縮放,而不會影響圖形文件的大小和質(zhì)量。 通過使用關(guān)鍵幀和元件,使所生成的“.swf”格式的動畫文件非常小,便于在網(wǎng)絡(luò)上播放和傳播。 Flash制作的動畫,能夠交互式地將音樂、動畫、聲效等融合在一起,很多用戶已經(jīng)把Flash當(dāng)做一個開發(fā)多媒體的首選工具。 Flash擁有功能強大的ActionScript語言,它采用了與JavaScript類似的語法結(jié)構(gòu),擁有自己的ActionScript函數(shù)、屬性和目標(biāo)對象等,并且兼容并支持Flash 低版本。,1.1.2 Flash動畫的應(yīng)用,1制作動畫短片,2,第1章 Flash CS4入門 ,2制作游戲3制作MTV4制作多媒體教學(xué)課件5制作Internet應(yīng)用程序6制作網(wǎng)頁,1.2 Flash CS4的工作界面,如右圖1-1所示。,菜單欄,標(biāo)題欄,布局模式,舞臺,屬性面板,繪圖工具箱,時間軸/圖層/動畫編輯器窗口,1.2.1 標(biāo)題欄,1.2.2 菜單欄,1.2.3 主工具欄,1.2.4 繪圖工具箱,圖1-1,2,第1章 Flash CS4入門 ,單擊“小三角”可以展開下一級菜單進行選擇,1.2.4 繪圖工具箱,圖1-2,繪圖工具箱如右圖1-2所示,它包含了10多種繪圖工具,用戶可以使用這些工具對圖像或選定區(qū)進行操作。單擊繪圖工具箱右上角的 按鈕,可以將工具箱折疊為圖標(biāo) 。若要展開面板可單擊 按鈕或 圖標(biāo);另外,可以把面板縮放成單列或多列。,2,2,第1章 Flash CS4入門 ,1.2.5 時間軸,時間軸面板如右圖所示,它的主要組件是層、幀和播放頭,還包括一些信息指示器,如圖1-3所示。,層,幀,播放頭,信息指示器,1.2.6 場景與舞臺,在當(dāng)前編輯的動畫窗口中,我們把動畫內(nèi)容編輯的整個區(qū)域叫做場景。舞臺就是繪制和編輯動畫內(nèi)容的矩形區(qū)域 ,具體如圖1-4所示。,圖1-3,第1章 Flash CS4入門 ,場景名稱,舞臺,工作區(qū),舞臺比例,圖1-4 場景和舞臺,2,第1章 Flash CS4入門 ,1.3 Flash CS4界面的設(shè)置,1.3.1 動畫屬性的設(shè)置,按照下列步驟設(shè)置動畫屬性:第1步:打開【屬性】面板,它會顯示整個動畫的屬性。第2步:點擊【550×400像素】右側(cè)的【編輯】按鈕,彈出【文檔屬性】對話框。第3步:在【幀頻】框鍵入正確的放映速度,即幀每秒。默認(rèn)值24,即動畫的每一秒要顯示24幀畫面。第4步:在【尺寸】框中,輸入電影的寬度和高度值。最小為18像素,最大為2880像素。第5步:點擊【背景顏色】右側(cè)的色框,在彈出的顏色面板里用戶可以選擇動畫背景的顏色。第6步:單擊【確定】。,2,第1章 Flash CS4入門 ,1.3.2 時間軸線的設(shè)置,1.3.3 工具欄、工具面板的設(shè)置,工具欄、工具面板以及工作區(qū)等都可以在屏幕上任意拖動,用戶可以將其拖放到最適合自己操作的位置。,1.4 基本文件的操作,1.4.1 創(chuàng)建新文檔,1.4.2 Flash文檔的操作,2,實訓(xùn)1 :設(shè)計一個小球從上向下運動的動畫,實訓(xùn)2:設(shè)計一個小球由大漸小的動畫,第1章 Flash CS4入門 ,提示:先用橢圓工具繪一個小球,然后在第1關(guān)鍵幀把小球位置放在舞臺上方,在第30關(guān)鍵幀把小球位置放在舞臺下方,最后在第1幀至30幀之間創(chuàng)建補間形狀動畫。,提示:用橢圓工具繪一個小球; 用變形工具將第30關(guān)鍵幀的小球縮??;在第1幀至30幀之間創(chuàng)建補間形狀動畫。,2,第2章 工具的使用,本章主要內(nèi)容:,矢量圖和位圖; 線條和填充圖形; Flash CS4常用工具的功能及其使用。,2,任務(wù)一:制作一張“幾何形體圖” ,效果如圖2-1所示。,任務(wù)二:制作一張“荷花圖”,效果如圖2-2所示。,第2章 工具的使用,(圖2-1),(圖2-2),2,任務(wù)三:制作一張“春天美景圖” ,效果如圖2-3所示。,第2章 工具的使用,(圖2-3),2,問題與思考:,第2章 工具的使用,Flash CS4的工具箱中的各種工具如何使用? 如何繪制圖形? 如何編輯圖形?,2,第2章 工具的使用,2.2.1 矢量圖和位圖,矢量圖形使用稱作矢量的直線和曲線描述圖像,矢量也包括顏色和位置屬性。矢量圖形與分辨率無關(guān),它適合于線性圖,特別是二維卡通動畫,能夠有效地減少文件容量。位圖圖形使用稱作像素的排列在網(wǎng)格內(nèi)的彩色點來描述圖像。在編輯位圖圖形時,修改的是像素,而不是直線和曲線。位圖圖形跟分辨率有關(guān),位圖適合表現(xiàn)層次和色彩細膩豐富,包含大量細節(jié)的圖像。,2.2.2 線條和填充圖形,線條,是指用線條工具、鋼筆工具、鉛筆工具繪制的圖形以及由橢圓工具、矩形工具繪制的邊框線。調(diào)整線條的粗細可以使用屬性面板中的“筆觸”數(shù)值的大小來改變;改變線條顏色可以使用墨水瓶工具。 填充圖形,是指用刷子工具繪制的圖形,或者是由橢圓工具、矩形工具繪制的圖形的填充部分。填充圖形的顏色不能通過墨水瓶工具來改變,只能使用顏料桶工具來調(diào)整。,2,第2章 工具的使用,2.2.3 工具介紹,(圖2-4 繪圖工具箱),2,實訓(xùn)1 :制作“幾何圖形”,實訓(xùn)2:制作“鄉(xiāng)間美景圖 ”,效果如圖2-5所示。,要求:繪制正方形、矩形、多邊形、圓、五角星等幾何圖表,并自定顏色填充。,第2章 工具的使用,圖2-5,2,要求:用3D工具制作由6張大小相同但內(nèi)容不同的圖片構(gòu)成的正方體圖形,第2章 工具的使用,實訓(xùn)4:制作“正方體圖 ”,實訓(xùn)3:設(shè)計制作“卡通人物圖 ”,效果如圖2-6所示。,圖2-6,2,第3章 文本處理,本章主要內(nèi)容:,文本的類型及屬性的設(shè)置; 文本的輸入及編輯; 文字效果和靜態(tài)動畫的制作。,2,任務(wù)一:制作 “漸變色的文字”的動畫 ,效果如圖3-1所示。,任務(wù)二:制作 “金屬文字”的動畫 ,效果如圖3-2所示。,第3章 文本處理,(圖3-1),(圖3-2),2,任務(wù)三:制作一幅“霓虹廣告”的動畫 ,效果如圖3-3所示。,第3章 文本處理,(圖3-3 第1幀和第5幀的效果圖),2,問題與思考:,第3章 文本處理,文本有哪些類型? 文字轉(zhuǎn)化為矢量圖形的方法是什么? 如何制作文字效果? 靜態(tài)動畫如何制作?,2,2,第3章 文本處理,3.2.1 文本及其類型,在Flash CS4中,文本類型可分為3種:靜態(tài)文本、動態(tài)文本和輸入文本。三種類型的切換方法是在文本工具屬性面板的第一個下拉列表框中選擇。 一般情況下默認(rèn)的文本是靜態(tài)文本,在動畫播放過程中,靜態(tài)文本區(qū)域中的文字是不可編輯和改變的,但是可以對靜態(tài)文本塊進行縮放、旋轉(zhuǎn)或者扭曲,可以為他們指定不同的顏色和透明度效果。動態(tài)文本就是可編輯的文本,在動畫播放過程中,文本區(qū)域的文字可通過事件的激發(fā)來改變。輸入文本就是在動畫播放過程中,提供我們輸入文本,產(chǎn)生交互。它允許用戶在空的文本區(qū)域中輸入文字,用于填充表格,回答調(diào)查的問題或者輸入密碼等。,3.2.2 設(shè)置文本屬性,3.2.3 設(shè)置段落屬性,1設(shè)置段落的對齊方式2設(shè)置邊距和間距,第3章 文本處理,3.2.4 文本的輸入,分為水平方向輸入和垂直方向輸入兩種。,3.2.5 文本的編輯,1轉(zhuǎn)換文本類型2. 分散文字: 分散文字就是將文字轉(zhuǎn)換為矢量圖形,具體操作是使用【修改】/【分離】命令。 3. 填充文字,注意:一旦把字符轉(zhuǎn)換成線條和填充以后,就不能把它們作為文本來編輯。即使重新組合字符或者把它們轉(zhuǎn)換成符號,也不能再應(yīng)用字體、字距或是段落選項。,2,實訓(xùn)1 :制作“數(shù)學(xué)公式” ,效果如圖3-4所示。,實訓(xùn)2:制作“空心字 ”,效果如圖3-5所示。,第3章 文本處理,圖3-4,實訓(xùn)3:設(shè)計制作“霓虹燈廣告”。,圖3-5,2,第4章 元件和庫,本章主要內(nèi)容:,元件的類型; 元件的創(chuàng)建和編輯; 實例的編輯; 庫的使用; 元件的制作,2,任務(wù)一:制作 “漸變色的文字”的動畫 ,效果如圖3-1所示。,任務(wù)二:制作 “金屬文字”的動畫 ,效果如圖3-2所示。,第4章 元件和庫,(圖3-1),(圖3-2),2,任務(wù)一:如何創(chuàng)建圖形元件 。,第4章 元件和庫,(圖4-1),要求:創(chuàng)建一圖形元件,效果如圖4-1所示,任務(wù)二:如何創(chuàng)建圖形元件 。,要求:創(chuàng)建一“動態(tài)按鈕”元件,設(shè)置四個關(guān)鍵幀中按鈕顏色屬性變化,鼠標(biāo)在“動態(tài)按鈕”上“按下”、“彈起”等不同狀態(tài)會出現(xiàn)不同的效果,如圖4-2所示。,圖4-2“鼠標(biāo)按下”和“鼠標(biāo)彈起”時按鈕狀態(tài),2,第4章 元件和庫,(圖4-3),任務(wù)三:如何創(chuàng)建影片剪輯元件 。,要求:創(chuàng)建一影片剪輯元件,組成四個正方形在舞臺上旋轉(zhuǎn)的動畫,如圖4-3所示 。,2,問題與思考:,第4章 元件和庫,元件的類型有哪些? 如何制作元件? 如何使用元件? 元件庫如何使用?,2,第4章 元件和庫,4.2.1 在動畫中使用元件的優(yōu)點,1可以簡化動畫的制作過程2減小文件大小3方便網(wǎng)絡(luò)傳輸,4.2.2 元件的類型,元件主要有圖形、影片剪輯和按鈕3種類型,不同類型的元件有著不同的作用。,4.2.3 元件的創(chuàng)建,1創(chuàng)建新元件2將舞臺元素轉(zhuǎn)換為元件,2,第4章 元件和庫,4.2.4 編輯元件,1編輯元件的方法2元件的編輯,4.2.5 創(chuàng)建與編輯實例,1將元件的實例添加至舞臺2編輯實例,4.2.6 庫和公用庫,1定義公用庫2使用公用庫,2,實訓(xùn)1 :制作“環(huán)環(huán)相扣圖形元件” ,效果如圖4-4所示。,實訓(xùn)2:制作“變色按鈕” ,效果如圖4-5所示。,第4章 元件和庫,圖4-4,實訓(xùn)3:制作“一小球從大變小的影片剪輯元件” 。,圖4-5,“彈起”時效果,“鼠標(biāo)經(jīng)過”時效果,“按下”時效果,要求:將實訓(xùn)1至實訓(xùn)3所制作的元件從庫中拖放到舞臺上,將實訓(xùn)3轉(zhuǎn)換為圖形元件。,實訓(xùn)4:實例的編輯,2,第5章 逐幀動畫,動畫的原理;幀的概念、分類和基本操作;逐幀動畫的創(chuàng)建。,本章主要內(nèi)容:,2,第5章 逐幀動畫 ,任務(wù)一:制作“奔跑的豹子”動畫,要求:制作一只豹子奔跑運動(設(shè)計效果如下圖5-1所示)。,圖5-1,2,第5章 逐幀動畫 ,任務(wù)二:制作“倒計時效果”動畫,要求:制作在一個紅色圓角矩形背景下顯示“5、4、3、1、GO!”的倒計時動畫效果(設(shè)計效果如下圖5-2所示)。,圖5-2,2,第5章 逐幀動畫 ,要求:制作花盆中的花兒逐漸成長,并生成一朵花的動畫效果(設(shè)計效果如下圖5-3所示)。,任務(wù)三:制作“花逐漸成長的過程”動畫,圖5-3,2,第5章 逐幀動畫 ,動畫的基本原理是什么? 如何創(chuàng)建逐幀動畫?什么叫幀?幀分為幾種類型?如何操作幀?,問題與思考:,2,第5章 逐幀動畫 ,5.2.1 動畫基本原理,動畫就是通過連續(xù)播放一系列畫面,給視覺造成連續(xù)變化的圖畫,它的基本原理與電影、電視一樣,都是視覺原理。動畫不是“會動的畫”,而是“畫出來的運動”。,5.2.2 幀的顯示形式及操作,1. 幀的概念:構(gòu)成動畫的每一個畫面叫做一個幀。,2. 幀的分類:空白幀、關(guān)鍵幀和空白關(guān)鍵幀,3. 幀的操作:包括添加幀 、刪除幀 、清除關(guān)鍵幀 、選擇所有幀 、復(fù)制幀 、粘貼幀 、移動幀 和翻轉(zhuǎn)幀,5.2.3 逐幀動畫知識介紹,創(chuàng)建逐幀動畫的典型方法主要有以下幾種:從外部導(dǎo)入素材生成逐幀動畫,如導(dǎo)入靜態(tài)的圖片和序列圖像等。使用數(shù)字或者文字制作逐幀動畫,如實現(xiàn)文字跳躍或旋轉(zhuǎn)等特效動畫。繪制矢量逐幀動畫。應(yīng)用各種設(shè)計工具在場景中繪制矢量逐幀動畫。,2,第5章 逐幀動畫 ,實訓(xùn)1 :制作“手指計數(shù)”動畫,如圖5-4所示。,實訓(xùn)2: 制作“毛筆寫字”動畫,如圖5-5所示,圖5-4,圖5-5,2,第5章 逐幀動畫 ,實訓(xùn)3: 制作“變臉”動畫,如圖5-6所示。,實訓(xùn)4: 制作“卡通人走路”動畫,提示: 用繪制工具繪制卡通人物走路的圖形元件:在各關(guān)鍵幀中,直接修改人物走路的圖形元件,使不同時刻的走路姿勢不一樣,從而創(chuàng)建逐幀動畫。,圖5-6,2,第6章 補間形狀動畫,創(chuàng)建補間形狀動畫需要的條件;如何創(chuàng)建補間形狀動畫;補間形狀動畫的屬性設(shè)置;形狀提示符的使用:圖層的基本操作。,本章主要內(nèi)容:,2,任務(wù)一:制作“矩形變心形(1)”動畫。效果如圖6-1所示,(圖6-1),要求:矩形有規(guī)律地變化成心形(效果如圖6-2所示)。,任務(wù)二:制作“矩形變心形(2)”動畫,(圖6-2),第6章 補間形狀動畫 ,2,任務(wù)三:制作“文字變形”動畫。,要求:制作一個英文字母“A”變化成字母“B”的動畫(效果如圖6-3所示)。,(圖6-3),要求:先由一個樹樁漸漸生長成一棵樹,然后在樹枝上桃花朵朵綻放。(效果如圖6-4所示)。,任務(wù)四:制作“桃花朵朵開”動畫,(圖6-4),第6章 補間形狀動畫 ,2,如何創(chuàng)建補間形狀動畫?創(chuàng)建補間形狀動畫有什么條件?如何控制補間形狀變化?圖層的作用是什么?如何創(chuàng)建和編輯圖層?,問題與思考:,第6章 補間形狀動畫 ,2,6.2.1 補間形狀動畫,第6章 補間形狀動畫 ,1創(chuàng)建補間形狀動畫需要的條件,補間形狀動畫可以實現(xiàn)兩個圖形之間顏色、形狀、大小和位置的過渡。創(chuàng)建補間形狀動畫需要一定的條件: 在一個補間形狀動畫中至少要有兩個關(guān)鍵幀。 這兩個關(guān)鍵幀中的對象必須是可編輯的矢量圖形對象。一次補間一個形狀通??梢垣@得最佳效果。如果一次補間多個形狀,則所有的形狀必須在同一個層上。如果要使用群組對象、圖符引例對象或位圖圖像創(chuàng)建形狀補間動畫,需要先將其分離成矢量圖形。 這兩個關(guān)鍵幀中的圖形必須有一些變化,否則制作的動畫將沒有動的效果。,2創(chuàng)建補間形狀動畫,創(chuàng)建補間形狀動畫有兩種方法,一是通過右鍵菜單創(chuàng)建補間形狀動畫,二是使用菜單命令創(chuàng)建補間形狀動畫。,2,第6章 補間形狀動畫 ,3刪除補間形狀動畫,4. 補間形狀動畫屬性設(shè)置,設(shè)置運動速度,設(shè)置動畫中間形狀效果,5形狀提示,首先選擇已經(jīng)創(chuàng)建補間形狀動畫兩個關(guān)鍵幀之間的任意一幀,然后打開幀【屬性】面板,如右圖6-5所示。,在制作補間形狀動畫后,加入形狀提示可控制更加復(fù)雜的形狀變化。,圖6-5,2,第6章 補間形狀動畫 ,6.2.2 圖層,1圖層面板,如下圖6-6所示。,2圖層的基本操作,圖層圖標(biāo),可編輯圖層圖標(biāo),隱藏/顯示圖層,鎖定圖標(biāo),顯示所有圖層的輪廓,刪除圖層,新建圖層,新建圖層文件夾,圖6-6,2,實訓(xùn)1 :制作“矩形變圓形”動畫,實訓(xùn)2:制作“文字變化”動畫,第6章 補間形狀動畫 ,提示:制作數(shù)字“2”向數(shù)字“3”的形狀補間動畫前要把文字分離,創(chuàng)建補間動畫后需加入形狀提示控制形變,如下圖6-7所示。,圖6-7,2,實訓(xùn)3:制作“圖形變文字”動畫,實訓(xùn)4:制作“文字變圖形”動畫,要求:一個“心”字逐漸地變成了心形,然后又變化為兩個心形的動畫,效果如下圖6-9所示。,第6章 補間形狀動畫 ,要求:四顆五角星從禮盒中旋轉(zhuǎn)而出,隨即轉(zhuǎn)變?yōu)椤肮?jié)日快樂”四個字的動畫,如下圖6-8所示。,圖6-8,圖6-9,2,第7章 傳統(tǒng)補間動畫,創(chuàng)建傳統(tǒng)補間動畫需要的條件;傳統(tǒng)補間動畫的創(chuàng)建;傳統(tǒng)補間動畫的屬性設(shè)置;場景的使用,本章主要內(nèi)容:,2,任務(wù)一:制作“小球碰撞”動畫, 效果如圖7-1所示。,(圖7-1),任務(wù)二:制作“旋轉(zhuǎn)的風(fēng)車”動畫,效果如圖7-2所示。,(圖7-2),第7章 傳統(tǒng)補間動畫,要求:制作一幅動畫,一個紅色小球垂直下落時碰到地面上的綠色小球,紅球彈起,綠球向遠處滾去并慢慢消失(效果如圖7-1所示)。,任務(wù)三:制作“多場景動畫”。,要求:按片頭、動畫、片尾3個場景的順序播放動畫內(nèi)容。,2,問題與思考:,第7章 傳統(tǒng)補間動畫,傳統(tǒng)補間動畫與補間形狀動畫有什么區(qū)別?創(chuàng)建傳統(tǒng)補間動畫,應(yīng)滿足什么條件? 多場景動畫如何制作?,2,第7章 傳統(tǒng)補間動畫,7.2.1 傳統(tǒng)補間動畫,1. 創(chuàng)建傳統(tǒng)補間動畫條件,在兩個關(guān)鍵幀中,只能有一個元件的實例或群組物體、文字。 必須作用在相同的對象上才能創(chuàng)造出移動和縮放的效果。 動畫的兩個關(guān)鍵幀畫面不能有矢量圖形存在。,2. 創(chuàng)建傳統(tǒng)補間動畫方法,創(chuàng)建傳統(tǒng)補間動畫也有兩種方法,一種是通過右鍵快捷菜單,一種通過菜單命令。,3. 刪除傳統(tǒng)補間動畫,4. 傳統(tǒng)補間動畫的屬性設(shè)置,(1)緩動:通過【緩動】選項右邊輸入一個數(shù)值來調(diào)整變化速率,從而創(chuàng)建更為自然的由先慢后快或先快后慢的減速效果。,(2)旋轉(zhuǎn):用于設(shè)置對象旋轉(zhuǎn)的動畫,2,第7章 傳統(tǒng)補間動畫,(3)【貼緊】:勾選該項,可以將對象貼緊到引導(dǎo)線上。(4)【同步】:勾選項該項,可以使圖形元件實例的動畫和主時間同步。(5)【調(diào)整到路徑】:制作運動引導(dǎo)線動畫時,勾選該項,可以使動畫對象沿著路徑運動。(6)【縮放】:勾選項該項,用于改變對象的大小。,7.2.2 場景,1場景的使用,執(zhí)行【窗口】/【其他面板】/【場景】命令,則會調(diào)出【場景】面板,使用場景的好處和模塊化設(shè)計的優(yōu)勢一樣,便于分工協(xié)作、便于修改。,2場景的添加和切換,3場景的命名,4場景的刪除及復(fù)制,2,實訓(xùn)1 :制作“矩形變圓形”動畫,實訓(xùn)2:制作“旋轉(zhuǎn)的指針”動畫,第7章 傳統(tǒng)補間動畫,要求:通過改變對象位置、【顏色】和“Alpha”值,創(chuàng)建傳統(tǒng)補間動畫的方法。,提示:先創(chuàng)建“指針”圖形元件,并把它的變形中心調(diào)整到指針下端。然后通過改變【變形】面板中的【旋轉(zhuǎn)】值創(chuàng)建傳統(tǒng)補間動畫。,實訓(xùn)3:制作“圖片翻轉(zhuǎn)”動畫,效果如下圖7-3所示。,圖7-3,2,實訓(xùn)4:制作“卡通火車在行駛”動畫 ,效果如下圖7-4所示。,第7章 傳統(tǒng)補間動畫,提示:先分層繪制“田野”和“鐵軌”背景“火車”元件,再通過改變火車位置,創(chuàng)建“火車”的補間動畫。,實訓(xùn)5:制作一個多場景動畫,圖7-4,2,第8章 補間動畫,“補間動畫”中常見的基本概念; “補間動畫”的創(chuàng)建; 自定義動畫預(yù)設(shè)操作; 動畫編輯器的使用。,本章主要內(nèi)容:,2,任務(wù)一:制作“滾動的小球”動畫,效果如圖8-1所示。,(圖8-2),任務(wù)二:制作“沖浪小子”動畫,效果如圖8-2所示。,(圖8-1),第8章 補間動畫 ,要求:小球自下往上運動時,速度由快到慢;而當(dāng)小球從上往下運動時,速度由慢到快。,要求:沖浪員沿著事先設(shè)計好的運動路線運動(沖浪),然后慢慢地消失。,2,任務(wù)三:制作“家具”動畫廣告 ,效果如圖8-3所示。,(圖8-3),第8章 補間動畫 ,要求:在一片清爽的綠色背景圖中,顯示著“綠色設(shè)計 綠色環(huán)?!蔽淖?,沙發(fā)由左向右?guī)в羞\動模糊進入舞臺,相應(yīng)的說明文字由小到大在顯示的動畫效果 。,2,問題與思考:,第8章 補間動畫 ,如何創(chuàng)建補間動畫?可補間的對象的屬性包括哪些?如何應(yīng)用動畫預(yù)設(shè)? 傳統(tǒng)補間動畫與補間動畫有什么區(qū)別?如何使用動畫編輯器?,2,第8章 補間動畫 ,8.2.1 補間動畫,1基本概念,(1)補間:補間是通過為一個幀中的對象屬性指定一個值并為另一個幀中的相同屬性指定另一個值創(chuàng)建的動畫。,(2)補間范圍:補間范圍是時間軸中的一組幀,其舞臺上的對象的一個或多個屬性可以隨著時間而改變。補間范圍在時間軸中顯示為具有淺藍色背景的單個圖層中的一組幀。,(3)目標(biāo)對象:在每個補間范圍中,只能對舞臺上的一個對象進行動畫處理,此對象稱為補間范圍的目標(biāo)對象。,(4)關(guān)鍵幀和屬性關(guān)鍵幀:Flash CS4 中,“關(guān)鍵幀”是指時間軸中其元件實例首次出現(xiàn)在舞臺上的幀;“屬性關(guān)鍵幀”是指在補間范圍中為補間目標(biāo)對象顯式定義一個或多個屬性值的幀。,(5)運動路徑:如果補間對象在補間過程中更改其舞臺位置,則補間范圍具有與之關(guān)聯(lián)的運動路徑。,2,第8章 補間動畫 ,2創(chuàng)建補間動畫,創(chuàng)建補間動畫與創(chuàng)建傳統(tǒng)補間動畫的方法一樣,創(chuàng)建補間動畫后的【時間軸】面板如所示。,圖8-4,8.2.2 使用動畫編輯器調(diào)整補間動畫,在Flash CS4中通過動畫編輯器可以查看所有補間屬性和屬性關(guān)鍵幀,從而對補間動畫進行全面細致控制。在【時間軸】面板中選擇已經(jīng)創(chuàng)建的補間范圍,或者選擇舞臺中已經(jīng)創(chuàng)建補間動畫的對象后,然后單擊菜單欄中的【窗口】/【動畫編輯器】命令,可以彈出一個如圖8-5所示的【動畫編輯器】面板。,2,第8章 補間動畫 ,圖8-5 【動畫編輯器】面板,2,單擊菜單欄中的【窗口】/【動畫預(yù)設(shè)】命令,可將該面板展開,如圖8-6所示。,第8章 補間動畫 ,圖8-6,8.2.3 動畫預(yù)設(shè),1【動畫預(yù)設(shè)】窗口的打開,預(yù)覽窗口,預(yù)設(shè)區(qū)列表,將選區(qū)中另存為預(yù)設(shè),2應(yīng)用動畫預(yù)設(shè),應(yīng)用動畫預(yù)設(shè)的具體步驟如下:第1步:在舞臺上選擇需要添加動畫預(yù)設(shè)的對象。第2步:在動畫預(yù)設(shè)面板的預(yù)設(shè)列表中選擇需要應(yīng)用的預(yù)設(shè),F(xiàn)lash隨附的每個動畫預(yù)設(shè)都包括預(yù)覽,通過在上方的“預(yù)覽窗口”中進行動畫的顯示預(yù)覽。第3步:選擇合適的動畫預(yù)設(shè)后,單擊動畫預(yù)設(shè)面板中的【應(yīng)用】按鈕,就可以將選擇預(yù)設(shè)應(yīng)用到舞臺選擇的對象中。,2,第8章 補間動畫 ,3將補間另存為自定義動畫預(yù)設(shè),將補間另存為自定義動畫預(yù)設(shè)的操作可以通過【動畫預(yù)設(shè)】面板下方的【將選區(qū)另存為預(yù)設(shè)】按鈕完成。,4創(chuàng)建自定義預(yù)設(shè)的預(yù)覽,創(chuàng)建自定義預(yù)設(shè)的預(yù)覽,具體步驟如下:第1步:創(chuàng)建補間動畫,并將其另存為自定義預(yù)設(shè)。第2步:然后創(chuàng)建一個只包含補間動畫的FLA文件,注意使用與自定義預(yù)設(shè)完全相同的名稱將其保存為FLA文件,并通過【發(fā)布】命令將FLA文件創(chuàng)建SWF文件。第3步:將剛才創(chuàng)建的SWF格式文件放置在已保存的自定義動畫預(yù)設(shè)XML文件所在目錄中,如果用戶使用的是windows系統(tǒng),那么就可以放置在如下目錄中:/Documents and Settings/Local Settings/Application Data/Adobe/Flash CS4/Configuration/motion Presets/中。,2,實訓(xùn)1 :制作“小球彈跳”動畫,實訓(xùn)2:設(shè)計制作一個廣告動畫,提示:通過改變小球位置從而添加屬性關(guān)鍵幀,再編輯補間路徑,使小球的彈跳具有真實性。,提示:從網(wǎng)絡(luò)中尋找相關(guān)廣告的背景圖并導(dǎo)入舞臺;輸入廣告詞,分層管理;創(chuàng)建補間動畫后,在【動畫編輯器】面板中編輯動畫。,實訓(xùn)3:設(shè)計制作骨骼動畫 。,第8章 補間動畫 ,提示:通過上網(wǎng)查找骨骼動畫(反向運動動畫)的資料,了解骨骼動畫的制作方法。根據(jù)資料介紹,自己設(shè)計制作一個骨骼動畫。,2,第9章 遮罩層動畫,本章主要內(nèi)容:,遮罩圖層的作用; 遮罩圖層的創(chuàng)建; 遮罩層動畫的制作。,2,任務(wù)一:制作“聚光燈效果”動畫 ,效果如圖9-1所示。,(圖9-2),任務(wù)二:制作“顏色變化的圓環(huán)”動畫 ,效果如圖9-2所示。,第9章 遮罩層動畫,要求:聚光燈左右不斷移動形成的聚光效果 。,(圖9-1),任務(wù)三:制作“鏡頭劃變轉(zhuǎn)換”動畫 ,效果如右圖9-3所示。,(圖9-3),2,問題與思考:,第9章 遮罩層動畫,遮罩圖層有什么作用? 如何創(chuàng)建遮罩圖層? 如何制作遮罩層動畫?,2,第9章 遮罩層動畫,9.2.1 遮罩圖層的作用,遮罩層中有動畫對象存在的地方,都產(chǎn)生一個孔,使其鏈接的被遮罩層相應(yīng)區(qū)域中的對象顯示出來。,9.2.2 創(chuàng)建遮罩圖層,1利用快捷菜單創(chuàng)建遮罩圖層,2在【圖層屬性】對話框中進行設(shè)置,9.2.3 取消遮罩圖層,9.2.4 構(gòu)成遮罩和被遮罩的元素,遮罩層中的圖形對象在播放時是看不到的,遮罩層中的內(nèi)容可以是按鈕、影片剪輯、圖形、位圖、文字等,但不能使用線條,如果一定要用線條,可以將線條轉(zhuǎn)化為“填充”。,9.2.5 遮罩層中可以使用的動畫形式,2,第9章 遮罩層動畫,9.2.3 取消遮罩圖層,9.2.4 構(gòu)成遮罩和被遮罩的元素,遮罩層中的圖形對象在播放時是看不到的,遮罩層中的內(nèi)容可以是按鈕、影片剪輯、圖形、位圖、文字等,但不能使用線條,如果一定要用線條,可以將線條轉(zhuǎn)化為“填充”。,9.2.5 遮罩層中可以使用的動畫形式,取消圖層的遮罩屬性有下面兩種方法:1、在時間軸的遮罩層單擊鼠標(biāo)右鍵,從彈出的快捷菜單中選擇【遮罩層】選項,當(dāng)【遮罩層】前沒有了“”符號,就取消了遮罩屬性。2、選擇某個圖層,選擇【修改】/【時間軸】/【圖層屬性】命令,打開【圖層屬性】對話框,在【類型】中選擇【一般】,就取消了遮罩屬性。,可以在遮罩層、被遮罩層中分別或同時使用補間形狀動畫、傳統(tǒng)補間動畫、引導(dǎo)層動畫等動畫手段,從而使遮罩動畫變成一個可以施展無限想象力的創(chuàng)作空間。,2,實訓(xùn)1 :制作“電影謝幕”動畫,實訓(xùn)2:制作“水波紋效果”動畫,要求:字幕在升入過程中逐漸顯示,在升出過程中逐漸消失,效果如圖9-4所示。,要求:當(dāng)湖水被風(fēng)吹,會起陣陣漣漪效果,效果如圖9-5所示。,第9章 遮罩層動畫,圖9-5,圖9-4,2,實訓(xùn)3 :設(shè)計制作鏡頭切換動畫,實訓(xùn)4:制作文字遮罩動畫,要求:制作多種有動態(tài)鏡頭切換。,要求:制作文字遮罩動畫,文字上出現(xiàn)漂亮且不斷變化的背景。效果如圖9-6所示。,第9章 遮罩層動畫,圖9-5文字遮罩動畫效果,2,第10章 引導(dǎo)層動畫,本章主要內(nèi)容:,普通引導(dǎo)圖層; 運動引導(dǎo)圖層; 引導(dǎo)層選項。,2,任務(wù)一:繪制“等距離的矩形”圖,效果如圖10-1所示。,任務(wù)二:制作“氣球冉冉上升”動畫,效果如圖10-2所示。,第10章 引導(dǎo)層動畫 ,(圖10-1),(圖10-2),2,任務(wù)三:制作“風(fēng)吹落葉”動畫,效果如圖10-3所示。,第10章 引導(dǎo)層動畫 ,(圖10-3),(圖10-4),任務(wù)四:制作“地月系”動畫,效果如圖10-4所示。,2,問題與思考:,第10章 引導(dǎo)層動畫 ,在第7章中,大家學(xué)習(xí)了傳統(tǒng)補間動畫,其案例中的動畫是怎樣運動的? 利用第7章的傳統(tǒng)補間動畫可不可以制作曲線運動的動畫? 引導(dǎo)圖層分為哪兩種類型?,2,第10章 引導(dǎo)層動畫 ,在【時間軸】面板中,在層名前有 標(biāo)志的就是普通引導(dǎo)層。在引導(dǎo)層中,可以像其他層一樣繪制各種圖形、引入元件等,但最終發(fā)布作品的時候,它們不會顯示出來。普通引導(dǎo)層主要為其層提供輔助繪圖和繪圖定位的幫助。,在【時間軸】面板中,在層名前有 標(biāo)志的就是運動引導(dǎo)層。運動引導(dǎo)層可以起到設(shè)置運動路徑的導(dǎo)向作用,使與之相鏈接的被引導(dǎo)層中的對象沿此路徑運動。,10.2.1 普通引導(dǎo)圖層,10.2.2 運動引導(dǎo)圖層,用鼠標(biāo)右鍵單擊圖層名,在打開的快捷菜單中選擇【添加傳統(tǒng)運動引導(dǎo)層】命令,在當(dāng)前圖層上增加一個運動引導(dǎo)層,當(dāng)前圖層變成被引導(dǎo)層。,2,第10章 引導(dǎo)層動畫 ,被引導(dǎo)層中的對象在被引導(dǎo)運動時,還可作更細致的設(shè)置。有兩個參數(shù)可以控制引導(dǎo)層動畫中元件沿路徑運動的屬性,它們可以在【屬性】面板中設(shè)置。,1.【調(diào)整到路徑】選項:使補間實例按曲線路徑走向,自身運動角度做出相應(yīng)調(diào)整。,10.2.3 引導(dǎo)層選項,2.【對齊】選項:可使實例在某一幀處抓取到導(dǎo)線位置,元件的注冊點就會與運動路徑對齊。,2,實訓(xùn)1 :制作“翻山越嶺”動畫,效果如圖10-5所示。,要求:制作汽車翻過一座座山嶺的動畫。,第10章 引導(dǎo)層動畫 ,圖10-5,2,實訓(xùn)2:制作“導(dǎo)彈打飛機”動畫,效果如圖10-6所示。,要求:當(dāng)導(dǎo)彈接觸到飛機時,導(dǎo)彈會消失,同時飛機會爆炸,其中兩幀的效果如圖10-28和圖10-29所示。,第10章 引導(dǎo)層動畫 ,圖10-6,實訓(xùn)3:制作“花兒飄”動畫,效果如圖10-7所示。,圖10-7,2,