Flash第3節(jié)-基本動畫制作(一)

FLASH商務應用

第三講逐幀動畫、傳統(tǒng)補間動畫、補間形狀動畫【目的】1．掌握逐幀動畫制作方法和技巧。2．掌握傳統(tǒng)補間動畫和形狀補間動畫的方法和技巧?！局攸c】1．逐幀動畫的特點。2．形狀補間動畫對動畫對象的要求。3．形狀補間動畫對形狀提示設置方法和技巧?！倦y點】逐幀動畫、傳統(tǒng)補間動畫、形狀補間動畫三者的區(qū)別。形狀補間動畫形狀提示的設置技巧。3.1逐幀動畫適合于圖像在每一幀中都在變化而不是在舞臺上移動的復雜動畫。將動畫中的每一幀都設置為關鍵幀，在每一個關鍵幀中創(chuàng)立不同的內(nèi)容，就成為逐幀動畫。將這些靜態(tài)圖片快速連續(xù)播放，根據(jù)視覺暫留原理，人的眼睛會將原本并不連續(xù)的靜態(tài)圖片看成一個連續(xù)的動作。因為逐幀動畫保存每一個關鍵幀中的所有內(nèi)容，所以可能會使文件的尺寸大大增加。3.1.1創(chuàng)立逐幀動畫的途徑一般有兩種：導入逐幀動畫和制作逐幀動畫。當向Flash中導入圖像時，如果要導入的圖像是多張名稱具有連續(xù)編號的圖像序列中的一張，導入后Flash自動將每一張圖像添加到一個單獨的關鍵幀中，形成一個逐幀動畫。制作逐幀動畫與導入逐幀動畫的區(qū)別在于：導入逐幀動畫的工作主要是準備要導入的圖像序列，這項工作往往是在Flash之外完成的；而制作逐幀動畫主要是在Flash中創(chuàng)立逐幀動畫每一幀中的內(nèi)容，這項工作主要是在Flash內(nèi)部完成的。3.1.2逐幀動畫的制作步驟創(chuàng)立一個新圖層；在空白關鍵幀中制作和編輯畫面內(nèi)容；在編輯完成的關鍵幀后插入另一空白關鍵幀進行編輯，使之與上一幀略有不同；重復步驟3的操作，創(chuàng)立其他各幀，直至全部制作完畢；保存文件。注：假設每幀的畫面已用其他繪圖軟件制作成系列圖片文件，那么3、4兩步可并為一步，即使用File/Import命令導入系列圖片文件。實例3-1翻牌一條龍

翻牌一條龍【實例說明】創(chuàng)立翻牌的動畫效果，紅桃A-10、J、Q、K順序顯示。【技術要點】將外部圖形文件導入到Flash庫中，弄懂關鍵幀、空白關鍵幀、普通幀的概念，通過在時間軸不同幀中定制五張牌的有序出場。88課堂例如1:關鍵步驟菜單上，文件新建，創(chuàng)立了一個新的Flash影片文件。菜單上，文件另存為...，在翻開的“另存為”對話框上，選擇保存文件的文件夾位置，在“文件名”后輸入：翻牌一條龍.fla，點擊“保存”按鈕。菜單上，文件導入到庫…,翻開“導入到庫”對話框，找到五張紙牌文件，用鼠標選中這五張紙牌，點擊“翻開”按鈕，五張紙牌文件進入到“庫”中，菜單上，窗口庫，查看庫。菜單上，修改文檔，翻開“文檔屬性”對話框，設置文檔尺寸為100×120，背景顏色為白色，幀頻為12fps(即12幀/秒)。單擊“確定”按鈕，返回到文檔場景編輯窗口，在舞臺右上方的“縮放比例”下拉列表框中選擇100%，此時舞臺將以設置的文檔尺寸顯示，如圖。99課堂例如1:關鍵步驟鼠標點擊“圖層1”的第一幀，然后將庫面板中的紅桃A拖動到舞臺上，菜單上，窗口對齊，在“對齊”面板上點擊“水平”、“垂直”對齊按鈕，將圖片“黑桃A”相對于舞臺居中，如下圖。在“圖層1”的第4幀上單擊鼠標右鍵插入空白關鍵幀，此時舞臺上變?yōu)榭瞻?，F(xiàn)lash自動在第2幀～第3幀中插入普通幀〔普通幀中的內(nèi)容與前一個關鍵幀中的畫面相同。注意：當啟動Flash時，系統(tǒng)自動處于“圖層1”的第一幀，這個幀是個空白的“關鍵幀”〕，此時，時間軸如以下圖所示。1010課堂例如1:關鍵步驟將庫面板中的方片K拖到舞臺上，使其相對舞臺居中。參照步驟6〕、7〕，依次在“圖層1”的第7幀插入空白關鍵幀，將庫面板中的方片Q拖到舞臺上，使其相對舞臺居中；第10幀插入空白關鍵幀，將庫面板中的紅桃J拖到舞臺上，使其相對舞臺居中；第13幀插入空白關鍵幀，將庫面板中的草花10拖到舞臺上，使其相對舞臺居中。完成后的時間軸窗口如下圖。菜單上，文件保存，保存對文檔的修改實例3-2花兒綻放花兒綻放【實例說明】繪制一枝花從發(fā)芽到開花的過程動畫?！炯夹g要點】建立“圖框”和“花”兩個圖層，“圖框”圖層中顯示圖框、桌子和花盆，它們在花綻放的過程中都屬于“靜止”的對象。而在“花”圖層中制作逐幀動畫，展示花綻放的過程。課堂例如2:關鍵步驟啟動FlashCS4，菜單上，文件另存為，在“另存為”的對話框上，先選擇保存文件的文件夾的位置，在文件名后輸入：花兒綻放.fla，點擊“保存”按鈕。菜單上，修改文檔，翻開“文檔屬性”對話框，設置文檔尺寸為250px×300px，幀頻為6fps，點擊“確定”。在時間軸窗口中建立兩個圖層，下面的圖層為“花”，上面的圖層為“外框”如圖1所示。用鼠標點擊“外框”圖層的第一幀，并按圖2所示的樣張繪圖框、桌子和花盆?！沧ⅲ簣D框線寬8，花盆線寬3，均為黑色；桌子用刷子工具來畫，畫筆的大小和形狀如圖3所示，為淡灰色—#999999〕課堂例如2:關鍵步驟鼠標在“外框”圖層的第15幀上點擊右鍵插入幀，那么“外框”圖層的第1幀至第15幀的舞臺上均顯示第1幀的內(nèi)容。鼠標右擊“花”圖層的第2幀插入空白關鍵幀，選擇工具箱中的鉛筆工具，線寬設為1，按圖第2幀所示樣張繪圖〔只繪花的芽，花盆是“外框”圖層中的背景〕，花的葉子填充綠色。鼠標右擊“花”圖層的第3幀插入空白關鍵幀，按圖第3幀所示樣張繪圖，花的葉子填充綠色，花的桿用“鉛筆工具”繪出，線寬為3，顏色為綠色課堂例如2:關鍵步驟依次類推，“花”圖層的第9幀是第9幀的畫面；第7～9幀用黃色鉛筆繪制花蕊〔線寬為1〕“花”圖層上花的“葉”和“花瓣”的邊緣都有黑色的鉛筆輪廓線條，選擇工具箱中的箭頭工具，分別點擊各幀中“葉”和“花瓣”的邊緣線條，按【Delete】鍵，將它們?nèi)慷紕h除，只留下填充色，例如第9幀處理后的結果如下圖。最后用鼠標在“花”圖層的第15幀上點擊右鍵插入幀〔第10～15幀的畫面與第9幀的一致，為的是播放到最后一幀時多停留一會〕。Ctrl+enter預覽，菜單上，文件保存。3.2補間形狀動畫補間形狀動畫是一種在制作對象形狀變化時經(jīng)常被使用到的動畫形式，它的制作原理是通過在兩個具有不同形狀的關鍵幀之間指定形狀補間，以表現(xiàn)中間變化過程的方法形成動畫。3.2.1補間形狀動畫的要求補間形狀動畫的對象必須是別離的(矢量圖)元件、組合、文字需要別離有的對象需要別離屢次，如文字繪圖工具繪制的圖形本身就是別離的18183.2.2補間形狀動畫的表現(xiàn)形式補間形狀動畫頭尾必須是關鍵幀，兩關鍵幀中間被帶有一個黑箭頭和淺綠色背景的中間過渡幀分開(如圖層4所示)如果兩關鍵幀中間的黑箭頭變?yōu)楹邳c，代表補間形狀動畫創(chuàng)立錯誤缺少開始或結束關鍵幀(如圖層2,3所示)對象別離或沒有徹底別離(如圖層1所示)193.2.3形狀提示原理補間形狀動畫中，如果要控制復雜或罕見的形狀變化，可以使用形狀提示來控制形狀以什么方式漸變。形狀提示會標識起始形狀和結束形狀中添加相對應的“參考點”，使Flash在計算變形過渡時依一定的規(guī)那么進行，從而較有效地控制變形過程。形狀提示包含字母〔從a到z〕，用于識別起始形狀和結束形狀中的相對應的點。最多可以使用26個形狀提示。203.2.4創(chuàng)立形狀提示選擇補間形狀動畫的開始幀，執(zhí)行“修改/形狀/添加形狀提示”菜單命令，該幀的形狀上就會增加一個帶字母的紅色圓圈，相應地，在結束幀形狀中也會出現(xiàn)一個“提示圓圈”；分別用鼠標拖動開始和結束幀上的“提示圓圈”，放置在適當位置，安放成功后開始幀上的“提示圓圈”變?yōu)辄S色，結束幀上的“提示圓圈”變?yōu)榫G色；安放不成功或不在一條曲線上時，“提示圓圈”顏色不變還是為紅色。選擇形狀提示，點擊鼠標右鍵，可以通過快捷菜單添加和刪除形狀提示實例3-3形狀漸變動畫：數(shù)字“1”變?yōu)閿?shù)字“2”

數(shù)字變化【實例說明】創(chuàng)作數(shù)字“1”漸變?yōu)閿?shù)字“2”的動畫?！炯夹g要點】學會形狀補間動畫的制作，學會“形狀提示”的使用方法和技巧，掌握制作補間動畫的要領。2323課堂例如3:關鍵步驟啟動FlashCS4，菜單上，文件另存為，在“另存為”的對話框上，先選擇保存文件的文件夾的位置，在文件名后輸入：數(shù)字漸變.fla，點擊“保存”按鈕。菜單上，修改文檔，翻開“文檔屬性”對話框，設置文檔尺寸為160px×160px，幀頻為12fps，點擊“確定”。選擇工具箱中的文本工具，點擊舞臺左下角的“屬性”圖標，翻開“屬性”設置面板，設置字體為ArialBlack，大小為150，字體顏色為黑色。鼠標在舞臺上點擊一下，輸入數(shù)字“1”，再使數(shù)字“1”相對于舞臺居中〔菜單上，窗口對齊〕，菜單上，修改別離。鼠標在時間軸第20幀上點擊右鍵插入空白關鍵幀，選擇工具箱中的文本工具，鼠標在舞臺上點擊一下，輸入數(shù)字“2”，再使數(shù)字“2”相對于舞臺居中，菜單上，修改別離。選擇兩關鍵幀之間任何一幀，按鼠標右鍵，在快捷菜單中選擇“創(chuàng)立補間形狀”命令2424課堂例如3:關鍵步驟打【Ctrl+Enter】鍵，觀看播放，發(fā)現(xiàn)中間過渡亂七八糟，第10幀也不象樣張所示那樣。此時我們要添加“形狀提示”〔有些書上稱之為“形狀標記”〕。鼠標點擊第1幀，菜單上，修改形狀添加形狀提示，舞臺上出現(xiàn)一個小寫的字母“a”，用鼠標拖動字母“a”到數(shù)字“1”的左上角，菜單上，修改形狀添加形狀提示，舞臺上出現(xiàn)一個小寫的字母“b”，用鼠標拖動字母“b”到數(shù)字“1”的右下角，如圖1所示。鼠標點擊第20幀，此時“形狀提示”字母“a”、“b”均已在舞臺上中央，只要將它們拖動到如圖2所示的位置上即可。實例1—【實例說明】一只小猴從桌子下面冒出來，眼睛滴溜溜地轉。實例1—【技術要點】通過圖層順序編排來控制對象的前后順序；使用補間動畫制作小猴冒出來與眼睛轉動的動畫效果。3.4聰明的小猴2626課堂例如4:關鍵步驟啟動聰明的小猴.fla，修改文檔，翻開“文檔屬性”對話框，設置文檔尺寸為550×350,背景顏色為白色，幀頻為12fps，單擊“確定”按鈕。將“圖層1”改名為“桌子”。菜單上，窗口庫，該庫中有一個元件“桌子”，用鼠標直接將元件“桌子”拖動到“舞臺上。用鼠標右鍵單擊第20幀插入幀。單擊時間軸窗口左下方的“插入圖層”按鈕，在“桌子”圖層之上新建“椅子”圖層。將“椅子”元件拖動到“舞臺上。鼠標單擊“桌子”圖層，單擊“插入圖層”按鈕，那么在“桌子”圖層之上新建“小猴”圖層從庫面板中將“無眼小猴”元件拖動到舞臺上，調(diào)整其大小與位置2727課堂例如4:關鍵步驟在“小猴”圖層之上新建“眼睛”圖層，如圖1所示。選擇工具箱中的橢圓工具，設置筆觸顏色為黑色，填充顏色為黑色，在小猴的眼睛中添加眼珠，如圖2所示。2828課堂例如4:關鍵步驟單擊“眼睛”圖層的第1幀，選中該幀上的兩個眼珠，菜單上，插入轉換成元件，翻開“轉換為元件”對話框。設置名稱為“眼珠”，行為選“圖形”，注冊點為中心點。交換“桌子”圖層和“椅子”圖層的上下位置，使得“桌子”圖層位于最上面，“椅子”圖層位于最下面用鼠標右鍵單擊“小猴”圖層的第1幀創(chuàng)立傳統(tǒng)補間動畫，在“小猴”圖層的第8幀上單擊鼠標右鍵插入關鍵幀，從而創(chuàng)立第1幀～第8幀之間的傳統(tǒng)補間動畫。單擊選中“小猴”圖層的第8幀，然后使用鍵盤上的“向上”方向鍵將小猴向上移動到圖1所示的位置。按照同樣的操作，在“眼睛”圖層創(chuàng)立第1幀～第8幀之間的傳統(tǒng)補間動畫，并將眼睛在第8幀中的位置調(diào)整到如圖2所示2929課堂例如4:關鍵步驟在“眼睛”圖層的第10幀中插入關鍵幀，F(xiàn)lash自動在第8幀到第10幀之間也創(chuàng)立傳統(tǒng)補間動畫，但不調(diào)整眼睛在第10幀中的位置。在“眼睛”圖層的第13幀中插入關鍵幀，并將該幀中眼睛對象向左移動，如圖1所示在“眼睛”圖層的第16幀中插入關鍵幀，并將該幀中眼睛對象向右移動，如圖2所示。3030課堂例如4:關鍵步驟按照同樣的方法，在“眼睛”圖層的第18幀中插入關鍵幀，并將該幀中的眼睛對象向左移動；在第20幀中插入關鍵幀，并將該幀中的眼睛對象向右移動。菜單上，ctrl+enter，觀看動畫效果。菜單上，文件

保存?；丶易鳂I(yè)：存入作業(yè)模板3.fla里第一題步驟：翻開作業(yè)模板.fla創(chuàng)立影片剪輯元件t1具體操作步驟為：菜單-新建元件，名稱t1,類型選影片剪輯勾選actionscript導出和在幀1中導出然后翻開“翻牌一條龍.fla”，復制所有幀到t1的影片剪輯編輯中。修改腳本：選中第一題按鈕，右鍵/動作，將語句_root.attachMovie("t11","ball_1",1)修改成_root.attachMovie(“t1”,“ball_1”,1)即可回家作業(yè)：存入作業(yè)模板3.fla里第二題作業(yè)3.1翻牌一條龍回家作業(yè)：存入作業(yè)模板3.fla里第一題步驟：翻開作業(yè)模板.fla創(chuàng)立影片剪輯元件t2具體操作步驟為：菜單-新建元件，名稱t2,類型選影片剪輯勾選actionscript導出和在幀1中導出然后翻開“花兒綻放.fla”，復制所有幀到t2的影片剪輯編輯中。修改腳本：選中第二題按鈕，右鍵/動作，將語句_root.attachMovie("t21","ball_2",1)修改成_root.attachMovie(“t2”,“ball_2”,1)即可回家作業(yè)：存入作業(yè)