资源描述：
《动画快速上手》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。
1、第2章動畫快速上手本章提要2-1快速建立移動動畫2-2製作逐一影格動畫22-1快速建立移動動畫Flash能讓製作網頁動畫的人趨之若鶩,有大半功勞都要歸給補間動畫(Tweened)。它是最方便又容易的一種動畫製作方式,我們只要製作連續動作的開始和結束的內容,中間的動畫過程就交給Flash自動完成。3快速建立移動動畫4快速建立移動動畫運用補間動畫可以輕易製作出具有移動、縮放、旋轉、形狀漸變、色彩漸變等效果的動畫,還能控制移動速度變慢或變快…等。Flash的補間動畫分為形狀補間動畫(ShapeTweening)和移動補間動畫(MotionT
2、weening)2種,此處我們先介紹移動補間動畫的製作方法,讓您搶先體驗補間動畫的魅力。5快速建立移動動畫請雙按範例檔02.swf,先看看已完成的移動補間動畫是什麼樣子。6快速建立移動動畫請開啟練習檔02-learn.fla,我們來實際體驗一下移動補間動畫的製作步驟。7快速建立移動動畫開啟檔案後,我們要製作第1格影格的內容。請先按一下時間軸面板上圖層1的影格1,再執行『視窗/元件庫』命令開啟元件庫面板,其中小汽車是我們準備好的圖形,請從元件庫面板將小汽車拉曳到舞台左邊的位置：8快速建立移動動畫9快速建立移動動畫接下來我們要製作結束影格
3、的內容。假設動畫共有10格影格,請在時間軸面板上圖層1的影格10處按下滑鼠右鈕,執行『插入關鍵影格』命令：10「播放磁頭」的作用我們可由播放磁頭得知目前舞台上播放的是哪一格影格的內容。請先按一下影格1的位置,將播放磁頭移至動畫的最前面,再按下[Enter]鍵,此時播放磁頭會依序由影格1移動至影格10,不過由於我們尚未進行移動的設定,因此舞台上的小汽車沒有任何的移動或變化。11快速建立移動動畫選取圖層1的影格10,然後按下工具箱的選取工具,再將舞台左邊的小汽車拉曳到舞台的右邊,代表小汽車的行徑路線。移動時請儘量保持水平移動,如果擔心無法
4、維持在相同的水平位置,請在拉曳前先按下[Shift]鍵不放再進行拉曳,小汽車就會維持在相同的水平位置囉！12快速建立移動動畫13快速建立移動動畫請在影格1上按右鈕,執行『建立移動補間動畫』命令,影格1到影格10之間便會顯示一個箭頭圖示,箭頭穿過的影格,就是Flash幫我們完成的,這些自動完成的影格稱之為補間動畫影格：14快速建立移動動畫15快速建立移動動畫動畫設定到此就完成了,請按下時間軸面板上的影格1,將播放磁頭移至影格1的位置,再按下[Enter]鍵,即可藉由播放磁頭的移動來檢視小汽車的移動效果。在此動畫中,小汽車會從舞台左邊開往
5、右邊,如果將影格1的小汽車移至舞台外左邊的位置：16快速建立移動動畫17快速建立移動動畫再將影格10的小汽車移至舞台外右邊的位置：18快速建立移動動畫如此一來當動畫重複播放時,就會有穿流不息的效果囉！你可以執行『控制/測試影片』命令,瀏覽完成的動畫效果。19快速建立移動動畫特別提醒您,執行『控制/測試影片』命令後,Flash將會自動建立一個相同檔名,但格式為.swf的播放檔,因此若是開啟光碟中的練習檔來練習,請務必將檔案儲存至自己的硬碟中,才能順利進行動畫測試。有關於動畫測試及發佈的完整說明,可參考第17章。202-2製作逐一影格動畫
6、除了補間動畫的製作方式,我們也可以一格一格的繪製影格內容,這種類似傳統卡通的繪製方法,我們稱之為連續影格動畫(FramebyFrame)。連續影格動畫所採用的製作方式,是將要表現動態的部份分解成多個動作,然後一個個的製作,再將這些動作連續播放,就形成了動態效果。21製作逐一影格動畫請雙按範例檔02-01.swf,瀏覽我們完成的連續影格動畫：22製作逐一影格動畫由範例來看,連續影格動畫需要繪製很多內容不同的影格,適合用來表現細膩的動作,例如︰人物的跑步,但它的缺點主要是製作費時,而且檔案體積較大,所以如果動畫要應用在網頁上的話,最好盡量
7、減少使用連續影格動畫,以免增加網頁下載的時間。23製作逐一影格動畫在Flash中製作連續影格動畫有2種方式,一種是在Flash中逐格地繪製分解動作,另一種是直接匯入由其它軟體(如︰Illustrator、Photoshop、PhotoImpact...)所製作的分解動作連續圖檔。在此,我們使用的是第1種方式,在Flash中逐格繪製動作。24製作逐一影格動畫為了方便您練習,我們已在練習檔02-learn1.fla準備好每個分解動作的圖檔,請開啟練習檔02-learn1.fla,跟我們一起進行如下的操作。25製作逐一影格動畫開啟檔案後,即
8、可在元件庫面板(執行『視窗/元件庫』命令可開啟元件庫面板)看到我們事先準備好的7個分解動作圖檔。請拉曳動作1至舞台中靠近右邊的位置：26製作逐一影格動畫27製作逐一影格動畫請點選時間軸面板圖層1的影格2再按下[F6]鍵(
