1、第8章Flash動畫制作本章主要內容 8.1FlashCS3簡介 8.2Flash繪圖基礎 8.3動畫制作 8.4Flash編程 8.5在網頁中使用Flash8.1 FlashCS3簡介 8.1.1FlashCS3的安裝與啟動 8.1.2FlashCS3的工作環境 8.1.3FlashCS3的基本概念8.1.1FlashCS3的安裝與啟動1.打開最近的項目2.新建3.從模板創建.1.2FlashCS3的工作環境 iudwxx "»c 必霸蒙vl y,“的ftlT X 口. J JAdobe Flh CS3 rxofoaiaeall未備名 1J.1.3FlashCS3的基本概

2、念1 .動畫原理Flash動畫通常由幾個場景組成，而場景又由幾個圖層組成，每個圖層又由許多幀組成。一個幀，就有一幅圖片，幾幅略有變化的圖片連續播放，就成了一個簡單動畫。8.1.3 Flash CS3的基本柢E念:2 .時間軸時間軸用于組織和控制文檔內容在一定時間內播放的圖層數和幀數。時間軸面板由圖層面板、“幀”面板、播放頭三部分組成。.93，慎勘而弁電的明手-3X：a1Sr10152025303540«505S6065,口.U4«|4«3雪坳育£.rjJ-J3II>Cl七，【：812.006s<.1.3FlashCS3的基本概念圖層就像堆疊在

3、一起的多張幻燈膠片一樣，每個圖層都包含一個顯示在舞臺中的不同圖像。 普通圖層就像沒有厚度的透明紙，上圖層的圖形可以覆蓋下圖層的圖形。通過運動引導建立的層是引導層，它的作用是提供引導線作為被引導層中對象的運動軌跡。 遮罩層是通過遮罩關系建立的層，它的作用是為了實現遮罩關系下的特別效果。 注釋層從本質上說是一個運動引導層，可以在其中添加一些說明性的文字，而輸出時不輸出該層的內容。4.幀 幀是構成動畫作品的基本單位，裝載了Flash播放的內容。 關鍵幀：決定一段動畫的必要幀。其中可以放置圖形、播放對象，并可以對所包含的內容進行編輯。關鍵幀一般在動畫的開始點、控制轉折點和結束點。 空白關鍵幀：空白關鍵

4、幀就是沒有內容的關鍵幀。 過渡幀：在兩個關鍵幀之間的普通幀稱為過渡幀。在Flash中，當確定了兩端的關鍵幀之后，利用命令可以自動計算添加過渡幀，無須人工添加。8.1.3FlashCS3的基本木既念75 .場景 場景是指在當前動畫編輯窗口中，編輯動畫內容的整個區域。 動畫是在場景中制作完成的，而場景又包括舞臺和工作區。 在Flash中，初始狀態的場景只有一個，默認名稱為“場景1”，通常稱它為主場景。選擇“插入”場景”命令，即可插入一個新場景。6 .舞臺舞臺就是創作影片中各個幀的區域。舞臺在回放過程中顯示圖形、視頻、按鈕等內容的位置。.2 Flash繪圖基4出矢量圖矢量圖形是由一個個單獨的點構成的

5、，每一個點都有其各自的屬性，如位置、顏色等。矢量圖與分辨率無關位圖圖像是由像素點構成的，像素點的多少將決定位圖圖像的顯示質量和文件大小，位圖圖像的分辨率越高，其顯示越清晰，文件所占的空間也就越大。位圖圖像的清晰度與分辨率有關8.2.1繪制和處理線條： 單擊“線條工具”，移動鼠標指針到舞臺上，在希望直線開始的地方按住鼠標拖動，到結束點松開鼠標，一條直線就畫好了。 “線條工具”能畫出許多風格各異的線條來。打開“屬性”面板，在其中，用戶可以定義直線的顏色、粗細和樣式。通埃xTlgpBiq-MTrrrmMF,二、宜蛾/.I|v|實儂)自定義崗點：®®工亙口電I銳示維就K二尖曲；一接

6、告會【例8-1】繪制一片樹葉 新建圖形元件 繪制樹葉圖形 編輯和修改樹葉 給樹葉上色 “顏料桶工具”選項822“刷子工具”的用法“刷子工具”可以隨意地繪制色塊。當用戶單擊工具箱中的“刷子工具”后，工具箱下邊就會顯示它的“選項”。填充模式 標準繪畫 顏料填充 后面繪畫 顏料選擇 內部繪畫【例8-2】繪制一個樹枝。 旋轉樹葉 復制樹葉 變形樹葉 創建“三片樹葉”圖形元件 繪制樹枝 組合樹葉和樹枝.3動畫制作 8.3.1逐幀動畫的制作 8.3.2運動漸變動畫的制作 8.3.3形狀漸變動畫的制作 8.3.4引導層運動動畫的制作 8.3.5遮罩動畫的制作8.3.1 逐幀動畫的制作:逐幀動畫是一種常見的動

7、畫手法，其原理是在“連續的關鍵幀”中分解動畫動作，也就是每一幀中的內容不同，連續播放而成動畫。 1.逐幀動畫在時間軸上的表現形式 2.創建逐幀動畫的幾種方法 (1)用導入的靜態圖片建立逐幀動畫 (2)繪制矢量逐幀動畫 (3)文字逐幀動畫 (4)導入序列圖像【例8-3】雪地中奔跑的豹子新建影片文檔，設置相關參數 創建背景圖層 導入gif動畫 調整對象的位置 添加標題文字 測試存盤.3.2運動漸變動畫的制作1 .動作漸變動畫的概念在Flash的“時間軸”面板上，在一個時間點（關鍵幀）放置一個元件，然后在另一個時間點（關鍵幀）改變這個元件的大小、顏色、位L透明度等，Flash根據二者之間的幀值創建的

8、動畫稱為動作漸變動畫。8.3.2運動漸變動畫的制作2.構成動作漸變動畫的元素 構成動作補間動畫的元素是元件，包括影片剪輯、圖形元件、按鈕等 除工元件，其他元素包括文本都不能創建補間動畫 其他的位圖、文本等都必須要轉換成元件才行,只有把形狀“組合”或者轉換成“元件”后才可以做“動作補間動畫”。8.3.2運動漸變動畫的制作:3 .動作漸變動畫在時間軸面板上的表現動作補間動畫建立后，“時間幀”面板的背景色變為淡藍色，在起始幀和結束幀之間有一個長長的箭頭。8.3.2運動漸變動畫的制作:4 .正確運用運動漸變需要滿足的條件運動漸變只能用于元件實例。若要對形狀、組合、位圖或文本對象應用運動漸變，必須先將這

9、些對象轉換成元件。 運動漸變中的元件只能是一對一的漸變，對多一或一對多均會導致漸變失敗。 運動漸變中的對象只能在同一圖層【例8-4】笑臉球的運動 創建影片文檔 繪制笑臉和哭臉元件 制作地面 制作運動漸變 測試影片并保存第廂第4謝第20«第2球ee第b幀6e、JmiiaiiiiiaumaiBininiiiBiHMiiuiuraiBianHiHiiianiiiiaiiiiiiiHaiBiBUHriiiBianiiiniiiiiniwaii8.3.3形狀漸變動畫的制作:1 .形狀漸變動畫的概念在Flash的“時間軸”面板上，在一個時間點（關鍵幀）繪制一個形狀，然后在另一個時間點（關鍵幀）更

10、改該形狀或繪制另一個形狀，Flash根據二者之間的幀的值或形狀來創建的動畫被稱為“形狀漸變動畫”。8.3.3形狀漸變動畫的制作評2.構成形狀漸變動畫的元素形狀補間動畫可以實現兩個圖形之間顏色、形狀、大小、位置的相互變化，其變形的靈活性介于逐幀動畫和動作補間動畫二者之間，使用的元素多為用鼠標或壓感筆繪制出的形狀，如果使用圖形元件、按鈕、文字，則必先“打散”再變形。.3.3形狀漸變動畫的制作3.形狀漸變動畫在“時間軸”面板上的表現形狀漸變動畫建好后，“時間軸”面板的背景色變為淡綠色，在起始幀和結束幀之間有一個長長的箭頭。【例8-5】制作燈籠變字 創建新文檔 創建背景圖層 創建燈籠形狀 將燈籠導入場

11、景 把文字轉為形狀取代燈籠 創建形狀補間動畫 測試存盤8.3.4 引導層運動動畫的制作:將一個或多個層鏈接到一個運動引導層，使一個或多個對象沿同一條路徑運動的動畫形式被稱為“引導層路徑動畫”。這種動畫可以使一個或多個元件完成曲線或不規則運動。 1.創建引導路徑動畫的方法 2.應用引導路徑動畫的技巧8.3.5 遮罩動畫的制作: 1.遮罩動畫的概念 (1)什么是遮罩“遮罩”,顧名思義就是遮擋住下面的對象。在FlashCS3中，“遮罩動畫”是通過“遮罩層”實現有選擇地顯示位于其下方的“被遮罩層”中的內容，在一個遮罩動畫中，“遮罩層”只有一個，“被遮罩層”可以有任意多個。(2)遮罩的用途一個作用是用在

12、整個場景或一個特定區域，使場景外的對象或特定區域外的對象不可見另一個作用是用來遮罩住某一元件的一部分，從而實現一些特殊的效果。2.創建遮罩的方法:(1)創建遮罩在FlashCS3中沒有一個專門的按鈕來創建遮罩層，遮罩層其實是由普通圖層轉化的。(2)構成遮罩和被遮罩層的元素遮罩層中的圖形對象在播放時是看不到的，遮罩層中的內容可以是按鈕、影片剪輯、圖形、位圖、文字等，但不能使用線條。(3)遮罩中可以使用的動畫形式可以在遮罩層、被遮罩層中分別或同時使用形狀補間動畫、動作補間動畫、引導線動畫等動畫手段，從而使遮罩動畫變成一個可以施展無限想象力的創作空間。3.應用遮罩時的技巧：: 遮罩層的基本原理是：能

13、夠透過該圖層中的對象著到“被遮罩層”中的對象及其屬性(包括它們的或形效果)，但是遮罩層中的對象中的許多屬性如漸變色、透明度、顏色和線條樣式挈卻是被忽略的。 要在場景中顯示遮罩效果，可以鎖定遮罩層和被遮罩層。 奇以用AS語句建立遮罩，但這種情況下只能有一個“被遮罩層”，同時，不能設置_alpha屬性。 不能用一個遮罩層試圖遮蔽另一個遮罩層。 遮罩可以應用在gif動畫上。 在制作過程中，遮罩層經常擋住下層的元件，影響視線、無法編輯，可以單擊遮罩層“時間軸”面板的“顯示圖層輪廓”按鈕，使之變成狀態，使遮罩層只顯需舉普形狀，此時還可以拖動邊框調整遮罩圖形的外形 在被遮罩層中不能放置動態文本。【例8-7

14、】探照燈創建新文檔創建底層文字創建遮罩層測試存盤北京科技大學天津學院北京科技大學天津學院8.4Flash編程 8.4.1Flash編程的方法和過程 8.4.2Flash編程的術語 8.4.3程序基本結構 8.4.4ActionScript月卻本 8.4.5輸出窗口 8.4.6ActionScript基本語法 8.4.7調試腳本8.4.1Flash編程的方法和過程1.學習Flash編程的方法 拆分問題：將需要處理的問題拆分成可執彳丁的命令。 學會綜合使用Flash的功能：Flash有繪畫功能、動畫功能和編程功能，將它們綜合使用會令工作輕松很多。 命名：對編程中的對象采取一個唯一和有意義的名稱。

15、使用動作面板和行為面板中的提示。8.4.1Flash編程的方法和過程2.Flash編程的過程 確定需要完成的任務。 確定執行任務的對象。 將任務拆分成可執行的命令。 將命令賦予對象。 在動作面板中測試命令語句。 使用“測試場景”命令測試。 完成編程。8.4.2Flash編程的術語 1.動作 2.參數 3.類 4.常數 5.結構體 6.數據類型 7.事件 8.表達式 9.函數 10.事件處理程序 11.標識符 12.實例 13.實例名8,4.3程序基本結構 1.命令、函數和運算符 2.變量 3.條件 4.循環.4.4ActionScript腳本on(release)varmyNumber=7;v

16、armyString=MFlashMXActionScript*;for(vari=O;i<myNumber;i+)trace(i);if(i+3=8)trace(myString);)45輸出窗口輸出窗口是只在測試Flash影片時出現的一個編程工具，Flash用輸出窗口來顯示出錯信息或其他的一些重要信息。輸出窗口在測試程序時非常有用。可以使用trace命令在輸出窗口中顯示變量的值或者哪一部分ActionScript正在執行。輸出窗口還可以幫助學習ActionScript。可以編寫一些小程序，將信息發送到輸出窗口，這里將會看到程序的運行結果。 1. 2. 3. 4. 5. 6. 7. 8

17、.8.4.6 ActionScript基本語法變量比較博導條件循環函數點語法注釋8.4.7 調試腳本 1.邏輯推斷 2.輸出窗口 3.調試器【例8-8】下雨動畫的制作: 打開FlashCS3,新建文檔 繪制圖形元件“雨滴” 制作雨滴下落的影片剪輯 打開庫，選中剛建立的電影剪輯并右擊，選擇“鏈接”命令，在彈出的“鏈接屬性”對話框中將標識符設為drop,并選中“為動作腳本導出”和“在第一幀導出”復選框 返回主場景，選中圖層1的第1幀，輸入代碼 注解8.5在網頁中使用Flash 8.5.1添加內置的Flash對象 8.5.2插入Flash動畫8.5.1添加內置的Flash對象 1.使用Dreamweaver內置的Flash按鈕對象 2.使用Dreamweaver內