Flash動(dòng)畫制作教程

1、第 1 章flash 動(dòng)畫基礎(chǔ)知識(shí)動(dòng)畫作為一種老少皆宜的藝術(shù)形式，具有悠久的歷史，猶如民間的走馬燈和皮影戲等古老的動(dòng)畫形式。當(dāng)然，真正意義的動(dòng)畫是在攝影機(jī)出現(xiàn)以后才發(fā)展起來的，并且隨著科學(xué)技術(shù)的不斷發(fā)展，又注入許多新的活力。flash 動(dòng)畫是一種交互式動(dòng)畫格式，通過計(jì)算機(jī)與動(dòng)畫開發(fā)軟件相結(jié)合制作而成。它也是目前網(wǎng)絡(luò)上最流行的動(dòng)畫之一。本章將初步展開對(duì)動(dòng)畫概念以及flash 動(dòng)畫的應(yīng)用范圍的介紹，以便用戶對(duì)flash 動(dòng)畫進(jìn)行更深層的了解。1.1 flash 動(dòng)畫概述如今，計(jì)算機(jī)的加入使動(dòng)畫的制作變簡單了，好多人通過較流行的flash 軟件來制作一些短小的動(dòng)畫。為了讓用戶能夠了解一下正統(tǒng)的動(dòng)畫制

2、作，這里講述一下動(dòng)畫的基礎(chǔ)。1.1.1 什么是動(dòng)畫動(dòng)畫是利用人的“視覺暫留”特性，連續(xù)播放一系列畫面，給視覺造成連續(xù)變化的圖畫，如圖 1-1 所示。它的基本原理與電影、電視一樣，都是視覺原理。圖 1-1 連續(xù)畫面其中，“視覺暫留”特性是人的眼睛看到一幅畫或一個(gè)物體后，在1/24 秒內(nèi)不會(huì)消失。利用這一原理，在一幅畫還沒有消失前播放出下一幅畫，就會(huì)給人造成一種流暢的視覺變化效果。1傳統(tǒng)動(dòng)畫及制作過程傳統(tǒng)動(dòng)畫片是用畫筆畫出一張張圖像，并將不同圖像中細(xì)微的變化著的連續(xù)畫面，經(jīng)過攝影機(jī)或者攝像機(jī)進(jìn)行拍攝，然后以每秒鐘24 格的速度連續(xù)放映。這時(shí)， 所畫的不動(dòng)的畫面就在銀幕上或熒屏里活動(dòng)起來，這就是傳統(tǒng)

3、動(dòng)畫片。2 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析傳統(tǒng)動(dòng)畫的創(chuàng)作過程和方法可能因人各異，但其基本規(guī)律是一致的，有總體設(shè)計(jì)、設(shè)計(jì)制作、具體創(chuàng)作和拍攝制作等階段?？傮w設(shè)計(jì)階段動(dòng)畫與影片制作類同，都需要有一定的劇本，即故事的情節(jié)。然后，通過滑稽的動(dòng)作取得類似連環(huán)畫的故事草圖，將劇本描述的動(dòng)作表現(xiàn)出來，如圖1-2 所示。圖 1-2 繪制角色設(shè)計(jì)制作階段此時(shí)，在故事板的基礎(chǔ)上，確定背景、前景及道具的形式和形狀，完成場景環(huán)境和背景圖的設(shè)計(jì)，以及對(duì)人物或其他角色進(jìn)行造型設(shè)計(jì)，如圖1-3 所示。在動(dòng)畫制作時(shí)，由于動(dòng)作與音樂必須匹配，所以音響效果一般在動(dòng)畫制作之前完成。然后，再將聲音精確地分解到每

4、一幅畫面位置上。圖 1-3 完成場景環(huán)境和背景圖具體創(chuàng)作階段先由動(dòng)畫設(shè)計(jì)師繪制動(dòng)畫的一些關(guān)鍵畫面，也稱為原畫創(chuàng)作。并且在繪制過程中，由專人負(fù)責(zé)動(dòng)畫中固定人物角色。再由助理動(dòng)畫設(shè)計(jì)師完成兩幅圖畫之間的中間畫，并由其他美術(shù)人員繪制角色動(dòng)作的連接畫，并使其符合指定動(dòng)作時(shí)間，表現(xiàn)得接近自然動(dòng)作，如圖1-4所示。第1 章3 flash 動(dòng)畫基礎(chǔ)知識(shí)在整個(gè)創(chuàng)作階段，所有繪制的畫面均是以鉛筆繪制的草圖，然后再通過特制的靜電復(fù)印機(jī)將草圖譽(yù)印到醋酸膠片上，并通過手工對(duì)線條進(jìn)行描墨，對(duì)膠片進(jìn)行著色（上色）。拍攝制作階段拍攝之前，需要對(duì)每一場景中的各個(gè)動(dòng)作進(jìn)行詳細(xì)的檢查。然后，在頂部有一部攝像機(jī)的專用攝制臺(tái)，并通過

5、中間幾層玻璃層。其中，將背景放在最下一層，中間各層放置不同的角色或前景等。拍攝中通過移動(dòng)各層產(chǎn)生動(dòng)畫效果。拍攝完成后，可以對(duì)動(dòng)畫各片段進(jìn)行連接、排序、剪輯等操作，并進(jìn)行錄音。其中，錄音主要完成動(dòng)畫中主體對(duì)象的對(duì)話、音樂、音響等，并混合到一個(gè)聲道上。傳統(tǒng)的動(dòng)畫制作，尤其是大型動(dòng)畫片的創(chuàng)作，需要許多人來完成，是一項(xiàng)集體性勞動(dòng)。需要有導(dǎo)演、制片、動(dòng)畫設(shè)計(jì)人員和動(dòng)畫輔助制作人員等。2 flash 動(dòng)畫及特點(diǎn)flash 以流控制技術(shù)和矢量技術(shù)等為代表，能夠?qū)⑹噶繄D、位圖、音頻、動(dòng)畫和深一層交互動(dòng)作有機(jī)地、靈活地結(jié)合在一起，從而制作出美觀、新奇、交互性更強(qiáng)的動(dòng)畫效果。較傳統(tǒng)動(dòng)畫而言，flash 提供的物體

6、變形和透明技術(shù)，使得創(chuàng)建動(dòng)畫更加容易，并為動(dòng)畫設(shè)計(jì)者的豐富想象提供了實(shí)現(xiàn)手段；其交互設(shè)計(jì)讓用戶可以隨心所欲地控制動(dòng)畫，賦予用戶更多的主動(dòng)權(quán)。因此，flash 動(dòng)畫具有以下特點(diǎn)。動(dòng)畫短小flash 動(dòng)畫受網(wǎng)絡(luò)資源的制約一般比較短小，但繪制的畫面是矢量格式，無論把它放大多少倍都不會(huì)失真。交互性強(qiáng)flash 動(dòng)畫具有交互性優(yōu)勢，可以通過單擊、選擇等動(dòng)作決定動(dòng)畫的運(yùn)行過程和結(jié)果，是傳統(tǒng)動(dòng)畫所無法比擬的。具傳播性flash 動(dòng)畫由于文件小、傳輸速度快、播放采用流式技術(shù)的特點(diǎn)，所以在網(wǎng)上供人欣賞和下載，具較好的廣泛傳播性。輕便與靈巧flash 動(dòng)畫有嶄新的視覺效果，成為一種新時(shí)代的藝術(shù)表現(xiàn)形式。比傳統(tǒng)的動(dòng)

7、畫更加輕便與靈巧。人力少，成本低flash 動(dòng)畫制作的成本非常低，使用flash 制作的動(dòng)畫能夠大大地減少人力、物力資源的消耗。同時(shí)，在制作時(shí)間上也會(huì)大大減少。由于人類眼睛的“視覺暫留”特性，電影采用了每秒24 幅畫面的速度拍攝播放；電視采用了每秒 25 幅（pal 制） （中央電視臺(tái)的動(dòng)畫就是pal 制）或 30幅（ nstc 制）畫面的速度拍攝播放。如果以每秒低于24 幅畫面的速度拍攝播放，就會(huì)出現(xiàn)停頓現(xiàn)象。提 示圖 1-4原畫與連接畫4 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析1.1.2 flash 動(dòng)畫應(yīng)用范圍隨著網(wǎng)絡(luò)熱潮的不斷掀起，flash動(dòng)畫軟件版本也開始逐漸升級(jí)。強(qiáng)

8、大的動(dòng)畫編輯功能及操作平臺(tái)更深受用戶的喜愛，從而使得flash 動(dòng)畫的應(yīng)用范圍越來越廣泛，其主要體現(xiàn)在以下幾個(gè)方面。1網(wǎng)絡(luò)廣告網(wǎng)絡(luò)廣告主要體現(xiàn)在宣傳網(wǎng)站、企業(yè)和商品等方面。用flash 制作出來的廣告，要求主題色調(diào)要鮮明、文字要簡潔，較美觀的廣告能夠增添網(wǎng)站的可看性，并且容易引起客戶的注意力而不影響其需求，如圖1-5 所示。圖 1-5網(wǎng)絡(luò)廣告動(dòng)畫2網(wǎng)站建設(shè)flash 網(wǎng)站的優(yōu)勢在于其良好的交互性，能給用戶帶來全新的互動(dòng)體驗(yàn)和視覺享受。通常，很多網(wǎng)站都會(huì)引入flash 元素，以增加頁面的美觀性來提高網(wǎng)站的宣傳效果，比如網(wǎng)站中的導(dǎo)航菜單、banner、產(chǎn)品展示、引導(dǎo)頁等。有時(shí)也會(huì)通過flash 來

9、制作整個(gè)網(wǎng)站，如圖1-6所示。圖 1-6 flash 網(wǎng)站flash 導(dǎo)航菜單在網(wǎng)站中的應(yīng)用是十分廣泛的。通過它可以展現(xiàn)導(dǎo)航的活潑性，從而使得網(wǎng)站更加靈活。當(dāng)網(wǎng)站欄目較少時(shí)，可以制作簡單且美觀的菜單；當(dāng)網(wǎng)站欄目較多時(shí)，又可以制作活躍的二級(jí)菜單項(xiàng)目。圖1-7 展示了一個(gè)網(wǎng)站欄目較少的flash 導(dǎo)航條。第1 章5 flash 動(dòng)畫基礎(chǔ)知識(shí)圖 1-7 flash 導(dǎo)航條3交互游戲flash 交互游戲，其本身的內(nèi)容允許瀏覽者進(jìn)行直接參與，并提供互動(dòng)的條件。flash 游戲多種多樣，主要包括棋牌類、冒險(xiǎn)類、策略類和益智類等多種類型。其中主要體現(xiàn)在鼠標(biāo)和鍵盤上的操控。制作用鼠標(biāo)操控的互動(dòng)游戲，主要通過鼠

10、標(biāo)單擊事件來實(shí)現(xiàn)。圖 1-8 中展示的是一個(gè) “女孩”學(xué)化妝的flash 互動(dòng)游戲，它就是通過鼠標(biāo)單擊來完成的。圖 1-8 鼠標(biāo)互動(dòng)性游戲制作用鍵盤操控的互動(dòng)游戲，可以通過設(shè)置鍵盤的任意鍵來操作游戲。圖1-9 中展示的是一個(gè)空中接人的flash互動(dòng)游戲，它就是通過空格鍵來控制的。圖 1-9 鍵盤互動(dòng)性游戲4動(dòng)畫短片mtv 是動(dòng)畫短片的一種典型，用最好的歌曲配以最精美的畫面，將其變?yōu)橐曈X和聽覺相結(jié)合的一種嶄新的藝術(shù)形式。制作flash mtv ，要求開發(fā)人員有一定的繪畫技巧，以及豐富的想象力，如圖1-10 所示。6 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析圖 1-10 flash m

11、tv5教學(xué)課件教學(xué)課件是在計(jì)算機(jī)上運(yùn)行的教學(xué)輔助軟件，是集圖、文、聲為一體，通過直觀生動(dòng)的形象來提高課堂教學(xué)效率的一種輔助手段。而 flash 恰恰滿足了制作教學(xué)課件的需求。圖 1-11展示了一個(gè)幾何體的視圖flash 課件，通過單擊“上一步”和“下一步”按鈕來控制課件的播放過程。圖 1-11 flash 教學(xué)課件1.2 時(shí)間軸時(shí)間軸是flash 的一大特點(diǎn)，位于舞臺(tái)的上方。通過對(duì)時(shí)間軸上的關(guān)鍵幀的制作，flash會(huì)自動(dòng)生成運(yùn)動(dòng)中的動(dòng)畫幀，節(jié)省了制作人員的大部分時(shí)間，也提高了效率。在時(shí)間軸的上面有一個(gè)紅色的線，那是播放的定位磁頭，拖動(dòng)磁頭可以實(shí)現(xiàn)對(duì)動(dòng)畫的觀察，這在制作當(dāng)中是很重要的步驟。第1

12、章7 flash 動(dòng)畫基礎(chǔ)知識(shí)1.2.1 幀在時(shí)間軸中，使用幀來組織和控制文檔的內(nèi)容。不同的幀對(duì)應(yīng)不同的時(shí)刻，畫面隨著時(shí)間的推移逐個(gè)出現(xiàn)，就形成了動(dòng)畫。幀是制作動(dòng)畫的核心，它們控制著動(dòng)畫的時(shí)間和動(dòng)畫中各種動(dòng)作的發(fā)生。動(dòng)畫中幀的數(shù)量及播放速度決定了動(dòng)畫的長度。其中，最常用的幀類型有以下幾種。1關(guān)鍵幀制作動(dòng)畫過程中，在某一時(shí)刻需要定義對(duì)象的某種新狀態(tài)，這個(gè)時(shí)刻所對(duì)應(yīng)的幀稱為關(guān)鍵幀，如圖1-12 所示。關(guān)鍵幀是變化的關(guān)鍵點(diǎn)，如補(bǔ)間動(dòng)畫的起點(diǎn)和終點(diǎn)，以及逐幀動(dòng)畫的每一幀，都是關(guān)鍵幀。關(guān)鍵幀數(shù)目越多，文件體積就越大。所以，同樣內(nèi)容的動(dòng)畫，逐幀動(dòng)畫的體積比補(bǔ)間動(dòng)畫大得多。實(shí)心圓點(diǎn)是有內(nèi)容的關(guān)鍵幀，即實(shí)關(guān)鍵

13、幀。無內(nèi)容的關(guān)鍵幀，即空白關(guān)鍵幀，用空心圓點(diǎn)表示。每層的第1 幀被默認(rèn)為空白關(guān)鍵幀，可以在上面創(chuàng)建內(nèi)容，一旦創(chuàng)建了內(nèi)容，空白關(guān)鍵幀就變成了實(shí)關(guān)鍵幀。插入的關(guān)鍵幀的位置是否為實(shí)心圓點(diǎn)，需遵循以下約定：如果插入關(guān)鍵幀的位置左邊最近的幀是空白關(guān)鍵幀，插入的空白關(guān)鍵幀同樣顯示為空心圓點(diǎn)；如果插入關(guān)鍵幀的位置左邊最近的幀是以實(shí)心圓點(diǎn)顯示的實(shí)關(guān)鍵幀，則插入的關(guān)鍵幀以實(shí)心圓點(diǎn)顯示，插入的空白關(guān)鍵幀顯示為空心圓點(diǎn)；以上操作均在插入的幀和其左邊最近的幀之間插入了普通幀，如果在這些普通幀對(duì)應(yīng)的舞臺(tái)上添加了對(duì)象，則左邊最近的空白關(guān)鍵幀轉(zhuǎn)換為實(shí)關(guān)鍵幀。注 意2普通幀普通幀也稱為靜態(tài)幀，在時(shí)間軸中顯示為一個(gè)個(gè)矩形單元格

14、。無內(nèi)容的普通幀顯示為空白單元格，有內(nèi)容的普通幀顯示出一定的顏色。例如，靜止關(guān)鍵幀后面的普通幀顯示為灰色。關(guān)鍵幀后面的普通幀將繼承該關(guān)鍵幀的內(nèi)容。例如，制作動(dòng)畫背景，就是將一個(gè)含有背景圖案的關(guān)鍵幀的內(nèi)容沿用到后面的幀上。如圖 1-13 所示， 風(fēng)車所握的支桿可以通過普通幀來延續(xù)，一直顯示到結(jié)束。空白關(guān)鍵幀關(guān)鍵幀圖 1-12 關(guān)鍵幀8 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析3過渡幀過渡幀實(shí)際上也是普通幀。過渡幀中包括了許多幀，但其中至少要有兩個(gè)幀：起始關(guān)鍵幀和結(jié)束關(guān)鍵幀。起始關(guān)鍵幀用于決定動(dòng)畫主體在起始位置的狀態(tài)，而結(jié)束關(guān)鍵幀則決定動(dòng)畫主體在終點(diǎn)位置的狀態(tài)。在 flash 中，利用

15、過渡幀可以制作兩類過渡動(dòng)畫，即運(yùn)動(dòng)過渡和形狀過渡。不同顏色代表不同類型的動(dòng)畫，此外，還有一些箭頭、符號(hào)和文字等信息，用于識(shí)別各種幀的類別，可以通過表1-1 所示的方式區(qū)分時(shí)間軸上的動(dòng)畫類型。表 1-1過渡幀類型過渡幀形式說明補(bǔ)間動(dòng)畫用起始關(guān)鍵幀處的一個(gè)黑色圓點(diǎn)指示；中間的補(bǔ)間幀為淺藍(lán)色背景傳統(tǒng)補(bǔ)間動(dòng)畫用起始關(guān)鍵幀處的一個(gè)黑色圓點(diǎn)指示；中間的補(bǔ)間幀有一個(gè)淺紫色背景的黑色箭頭補(bǔ)間形狀用起始關(guān)鍵幀處的一個(gè)黑色圓點(diǎn)指示；中間的幀有一個(gè)淺綠色背景的黑色箭頭虛線表示傳統(tǒng)補(bǔ)間是斷開的或者是不完整的，例如丟失結(jié)束關(guān)鍵幀時(shí)單個(gè)關(guān)鍵幀用一個(gè)黑色圓點(diǎn)表示。單個(gè)關(guān)鍵幀后面的淺灰色幀包含無變化的相同內(nèi)容，沒有任何變化，

16、在整個(gè)范圍的最后一幀還有一個(gè)空心矩形出現(xiàn)一個(gè)小a 表明此幀已使用【動(dòng)作】面板分配了一個(gè)幀動(dòng)作紅色標(biāo)記表明該幀包含一個(gè)標(biāo)簽或者注釋金色的錨記表明該幀是一個(gè)命名錨記1.2.2 圖層圖層是flash 中一個(gè)非常重要的概念，靈活運(yùn)用圖層，可以幫助用戶制作出更多精彩效果的動(dòng)畫。圖層類似于一張透明的薄紙，每張紙上繪制著一些圖形或文字，而一幅作品就是由許多張這樣的薄紙疊合在一起形成的。它可以幫助用戶組織文檔中的插圖，可以在圖層上繪制和編輯對(duì)象，而不會(huì)影響其他圖層上的對(duì)象。圖 1-14 中有 3 個(gè)圖層，每一個(gè)圖層上都有一幅圖，每一個(gè)圖層的內(nèi)容互不影響。普通幀支桿圖 1-13 添加普通幀圖 1-14 圖層第1

17、 章9 flash 動(dòng)畫基礎(chǔ)知識(shí)圖層具有獨(dú)立性，當(dāng)改變其中的任意一個(gè)圖層的對(duì)象時(shí)，其他兩個(gè)圖層的對(duì)象保持不變。在操作過程中， 不僅可以加入多個(gè)層，并且可以通過圖層文件夾來更好地組織和管理這些層。如圖 1-15 所示，可以根據(jù)每個(gè)層的具體內(nèi)容，重新命名層的名稱。（a） “草地”層及對(duì)象內(nèi)容（b） “白云”層及對(duì)象內(nèi)容圖 1-15層命名在創(chuàng)建動(dòng)畫時(shí)，層的數(shù)目僅受計(jì)算機(jī)內(nèi)存的限制，增加層不會(huì)增加最終輸出動(dòng)畫文件的大小。另外，創(chuàng)建的層越多越便于管理及控制動(dòng)畫。flash 包括兩種特殊的圖層，分別是引導(dǎo)層與遮罩層。1.3 flash 元件元件是flash 中一種比較獨(dú)特的、可重復(fù)使用的對(duì)象。在創(chuàng)建動(dòng)畫時(shí)

18、，利用元件可以使創(chuàng)建復(fù)雜的交互變得更加容易。在flash中，元件分為3種形態(tài)：影片剪輯、圖形和按鈕。1.3.1 圖形元件圖形元件可用于靜態(tài)圖像，并可用來創(chuàng)建連接到主時(shí)間軸的可重用動(dòng)畫片段。圖形元件與主時(shí)間軸同步運(yùn)行。與影片剪輯和按鈕元件不同，用戶不能為圖形元件提供實(shí)例名稱，也不能在動(dòng)作腳本中引用圖形元件。圖形元件的對(duì)象可以是導(dǎo)入的位圖圖像、矢量圖像、文本對(duì)象以及用flash 工具創(chuàng)建的線條、色塊等。例如，用戶可以執(zhí)行【創(chuàng)建新元件】命令，打開【創(chuàng)建新元件】對(duì)話框。在【名稱】文本框中輸入元件名稱，在【類型】區(qū)域中選擇【圖形】單選按鈕，單擊【確定】按鈕。然后，進(jìn)入繪圖環(huán)境用工具箱中的工具來創(chuàng)建圖形，

19、如圖1-16 所示。10 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析（a）創(chuàng)建圖形元件（b）添加并在【屬性】面板顯示元件圖 1-16 添加圖形元件1.3.2 影片剪輯元件影片剪輯元件就是大家平時(shí)常說的mc（ movie clip ） ，是一種可重用的動(dòng)畫片段，擁有各自獨(dú)立于主時(shí)間軸的多幀時(shí)間軸。用戶可以把場景上任何看得到的對(duì)象，甚至整個(gè)時(shí)間軸內(nèi)容創(chuàng)建為一個(gè)mc ，而且可以將這個(gè)mc 放置到另一個(gè)mc 中，用戶還可以將一段動(dòng)畫（如逐幀動(dòng)畫）轉(zhuǎn)換成影片剪輯元件。例如，每看到時(shí)鐘時(shí)，其秒針、分針和時(shí)針一直以中心點(diǎn)不動(dòng)，按一定間隔旋轉(zhuǎn)。因此，在制作時(shí)鐘時(shí)，應(yīng)將這些針創(chuàng)建為影片剪輯元件，如圖1

20、-17 所示。圖 1-17 時(shí)鐘指針旋轉(zhuǎn)在 flash 中，創(chuàng)建影片剪輯元件的方法同圖形元件的創(chuàng)建方法相似，只需在【創(chuàng)建新元件】對(duì)話框中選擇【影片剪輯】類型。然后，將繪制好的影片剪輯元件拖至舞臺(tái)中即可。當(dāng)然，用戶也可以將所創(chuàng)建的圖形等元件，直接轉(zhuǎn)換成影片剪輯元件。雙擊影片剪輯元件，可以查看該影片剪輯內(nèi)包含的對(duì)象，如圖1-18 所示。用戶可以將多幀時(shí)間軸看作是嵌套在主時(shí)間軸內(nèi)，它們可以包含交互式控件、聲音甚至其他影片剪輯實(shí)例。也可以將影片剪輯實(shí)例放在按鈕元件的時(shí)間軸內(nèi)，以創(chuàng)建動(dòng)畫按鈕。此第1 章11 flash 動(dòng)畫基礎(chǔ)知識(shí)外，可以使用actionscript對(duì)影片剪輯進(jìn)行改編。（a）秒針為影片

21、剪輯元件（b）查看秒針影片剪輯中包含的圖形元件圖 1-18影片剪輯元件1.3.3 按鈕元件使用按鈕元件可以創(chuàng)建用于響應(yīng)鼠標(biāo)單擊、滑過或其他動(dòng)作的交互式按鈕。可以定義與各種按鈕狀態(tài)關(guān)聯(lián)的圖形，然后將動(dòng)作指定給按鈕實(shí)例。按鈕實(shí)際上是4 幀的交互影片剪輯。當(dāng)為元件選擇按鈕行為時(shí)，flash 會(huì)創(chuàng)建一個(gè)包含4幀的時(shí)間軸。 前 3 幀顯示按鈕的3 種可能狀態(tài)，第 4 幀定義按鈕的活動(dòng)區(qū)域。時(shí)間軸實(shí)際上并不播放，它只是對(duì)指針運(yùn)動(dòng)和動(dòng)作做出反應(yīng)，跳轉(zhuǎn)到相應(yīng)的幀，如圖1-19 所示。要制作一個(gè)交互式按鈕，可把該按鈕元件的一個(gè)實(shí)例放在舞臺(tái)上，然后給該實(shí)例指定動(dòng)作。必須將動(dòng)作分配給文檔中按鈕的實(shí)例，而不是分配給按

22、鈕時(shí)間軸中的幀，如圖 1-20 所示。按鈕元件的時(shí)間軸上的每一幀都有一個(gè)特定的功能。第一幀是彈起狀態(tài)，代表指針沒有經(jīng)過按鈕時(shí)該按鈕的狀態(tài)。第二幀是指針經(jīng)過狀態(tài)，代表指針滑過按鈕時(shí)該按鈕的外觀。第三幀是按下狀態(tài)，代表單擊按鈕時(shí)該按鈕的外觀。第 四 幀 是 點(diǎn) 擊 狀 態(tài) ， 定 義 響 應(yīng) 鼠 標(biāo) 單 擊 的 區(qū) 域 。 此 區(qū) 域 在swf文 件 中 是 不 可見的。圖 1-19 按鈕時(shí)間軸12 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析（a）鼠標(biāo)經(jīng)過第一個(gè)按鈕（b）鼠標(biāo)經(jīng)過最后一個(gè)按鈕圖 1-20 按鈕效果用戶可以使用影片剪輯元件或按鈕組件創(chuàng)建一個(gè)按鈕。其中， 使用影片剪輯創(chuàng)建按鈕

23、時(shí)，可以添加更多的幀到按鈕或添加更復(fù)雜的動(dòng)畫。但是，影片剪輯按鈕的文件大小要大于按鈕元件；使用按鈕組件允許將按鈕綁到其他組件上，在應(yīng)用程序中共享和顯示數(shù)據(jù)。使用字體元件可以導(dǎo)出字體并在其他flash 文檔中使用該字體。flash 提供了各種內(nèi)置組件（即帶有已定義參數(shù)的影片剪輯），可以使用這些組件將用戶界面元素（如按鈕、復(fù)選框或滾動(dòng)條）添加到文檔中。提 示1.4 動(dòng)畫類型與特效flash cs4 提供了多種方式用來在文檔中包含動(dòng)畫和特殊效果，如時(shí)間軸特效、補(bǔ)間動(dòng)畫、逐幀動(dòng)畫，以及通過actionscript 3.0編輯代碼所形成的動(dòng)畫。1.4.1 flash 動(dòng)畫類型動(dòng)畫是一個(gè)創(chuàng)建動(dòng)作或隨時(shí)間變

24、化的幻覺過程。動(dòng)畫可以是一個(gè)物體從一個(gè)地方到另一個(gè)地方的移動(dòng)，或者是經(jīng)過一段時(shí)間后顏色的改變（改變也可以是一個(gè)形態(tài)上的，或者形狀上的改變，從一個(gè)形狀變成另一個(gè)形狀）。1不同類型動(dòng)畫任何隨著時(shí)間而發(fā)生的位置或者形象上的改變都可以稱為動(dòng)畫。flash 動(dòng)畫的類型主要有以下幾種。逐幀動(dòng)畫逐幀動(dòng)畫是最基本的動(dòng)畫形式。它最適合于每一幀中的圖像都在更改，而并非僅僅簡單地在舞臺(tái)中移動(dòng)的動(dòng)畫，為此，逐幀動(dòng)畫增加文件大小的速度也比補(bǔ)間動(dòng)畫快得多。逐幀動(dòng)畫就是對(duì)每一幀的內(nèi)容逐個(gè)編輯，然后按一定的時(shí)間順序進(jìn)行播放而形成的動(dòng)畫，如圖 1-21 所示。第1 章13 flash 動(dòng)畫基礎(chǔ)知識(shí)逐幀逐幀（a）文字筆劃動(dòng)畫（b

25、）折扇的折疊動(dòng)畫圖 1-21逐幀動(dòng)畫補(bǔ)間動(dòng)畫flash cs4 支持兩種不同類型的補(bǔ)間以創(chuàng)建動(dòng)畫：一種是傳統(tǒng)補(bǔ)間（包括在早期版本中flash 創(chuàng)建的所有補(bǔ)間） ，其創(chuàng)建方法與原來相比沒有改變；另一種是補(bǔ)間動(dòng)畫，其功能強(qiáng)大且創(chuàng)建簡單，可以對(duì)補(bǔ)間的動(dòng)畫進(jìn)行最大程度的控制。補(bǔ)間動(dòng)畫是一個(gè)幀到另一個(gè)幀之間對(duì)象變化的一個(gè)過程。在創(chuàng)建補(bǔ)間動(dòng)畫時(shí)，可以在不同關(guān)鍵幀的位置設(shè)置對(duì)象的屬性，如位置、大小、顏色、角度、alpha透明度等。編輯補(bǔ)間動(dòng)畫后， flash 將會(huì)自動(dòng)計(jì)算這兩個(gè)關(guān)鍵幀之間屬性的變化值，并改變對(duì)象的外觀效果，使其形成連續(xù)運(yùn)動(dòng)或變形的動(dòng)畫效果。可補(bǔ)間的對(duì)象類型包括影片剪輯元件、圖形元件、按鈕元件

26、以及文本字段。例如，在已經(jīng)添加“背景”圖層的文檔中，將“猴子”元件從【庫】面板拖入到舞臺(tái)中。然后，將該元件放置到舞臺(tái)的左側(cè)，為補(bǔ)間動(dòng)畫的起始位置，而該幀為補(bǔ)間動(dòng)畫的起始關(guān)鍵幀，如圖1-22所示。右擊第一幀，在彈出的菜單中執(zhí)行【創(chuàng)建補(bǔ)間動(dòng)畫】命令。此時(shí)，flash 將包含補(bǔ)間對(duì)象的圖層轉(zhuǎn)換為補(bǔ)間圖層，并在該圖層中創(chuàng)建補(bǔ)間范圍，如圖1-23 所示。圖 1-22補(bǔ)間動(dòng)畫起始關(guān)鍵幀圖 1-23創(chuàng)建補(bǔ)間動(dòng)畫14 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析如果對(duì)象僅駐留在一幀中，則補(bǔ)間范圍的長度等于一秒所播放的幀數(shù)。例如幀頻為24 幀/秒，則補(bǔ)間范圍的長度為24 幀。如果幀頻不足5 幀/秒，則補(bǔ)

27、間范圍的長度為5 幀。如果對(duì)象存在于多個(gè)連續(xù)的幀中，則補(bǔ)間范圍將包含該對(duì)象所占用的幀數(shù)。提 示右擊補(bǔ)間范圍內(nèi)的任意一幀（如最后一幀） ，執(zhí)行【插入關(guān)鍵幀】|【位置】命令，即會(huì)在補(bǔ)間范圍內(nèi)插入一個(gè)菱形的屬性關(guān)鍵幀。然后將對(duì)象拖動(dòng)至舞臺(tái)的右側(cè)，并顯示補(bǔ)間動(dòng)畫的運(yùn)動(dòng)路徑，如圖1-24 所示。引導(dǎo)動(dòng)畫為了在繪畫時(shí)幫助對(duì)象對(duì)齊，可以創(chuàng)建引導(dǎo)層，然后將其他層上的對(duì)象與引導(dǎo)層上的對(duì)象對(duì)齊。引導(dǎo)層中的內(nèi)容不會(huì)出現(xiàn)在發(fā)布的swf 動(dòng)畫中，可以將任何層用做引導(dǎo)層，它是用層名稱左側(cè)的輔助線圖標(biāo)表示的。還可以創(chuàng)建運(yùn)動(dòng)引導(dǎo)層，用來控制運(yùn)動(dòng)補(bǔ)間動(dòng)畫中對(duì)象的移動(dòng)情況。這樣用戶不僅僅可以制作沿直線移動(dòng)的動(dòng)畫，也能制作出沿曲線

28、移動(dòng)的動(dòng)畫，如圖1-25 所示。遮罩動(dòng)畫遮罩動(dòng)畫是flash 中的一個(gè)很重要的動(dòng)畫類型，很多效果豐富的動(dòng)畫都是通過遮罩動(dòng)畫來完成的。在flash 的圖層中有一個(gè)遮罩圖層類型， 為了得到特殊的顯示效果，可以在遮罩層上創(chuàng)建一個(gè)任意形狀的“視窗”，遮罩層下方的對(duì)象可以通過該“視窗”顯示出來， 而 “視窗”之外的對(duì)象將不會(huì)顯示。在 flash 動(dòng)畫中，“遮罩”主要有兩種用途：一個(gè)作用是用在整個(gè)場景或一個(gè)特定區(qū)域， 使場景外的對(duì)象或特定區(qū)域外的對(duì)象不可見；另一個(gè)作用是用來遮罩某一元件的一部分，從而實(shí)現(xiàn)一些特殊的效果。圖1-26所示為水波效果。2 flash 動(dòng)畫原理在 flash 動(dòng)畫中，最簡單并且與傳

29、統(tǒng)動(dòng)畫圖 1-24插入屬性關(guān)鍵幀引導(dǎo)層圖 1-25 引導(dǎo)動(dòng)畫圖 1-26遮罩動(dòng)畫第1 章15 flash 動(dòng)畫基礎(chǔ)知識(shí)相似的動(dòng)畫效果為逐幀動(dòng)畫。它意味著創(chuàng)建和存儲(chǔ)一組連續(xù)的位圖，每一幀都是一幅圖像，只需要進(jìn)行顯示即可，如圖1-27 所示。而使用元件時(shí)，所產(chǎn)生的動(dòng)畫與逐幀動(dòng)畫之間發(fā)生微妙的變化。這時(shí)， flash 不會(huì)為每一幀創(chuàng)建和存儲(chǔ)新的位圖。但是，每一幀都是舞臺(tái)上的一個(gè)對(duì)象的位置、大小、顏色等屬性。例如，小推車在屏幕上移動(dòng)時(shí)，每一幀只存儲(chǔ)小推車在該幀上的位置，以及小推車顏色和大小等。最后，在播放該動(dòng)畫時(shí)，則flash player 將讀取這些信息，再根據(jù)這些信息進(jìn)行渲染，顯示該幀，如圖1-2

30、8 所示。圖 1-27逐幀動(dòng)畫原理圖 1-28渲染并顯示幀而對(duì)于腳本動(dòng)畫來言，沒有第1 幀、第 2 幀的概念，通常只由一幀完成。例如，需要首先建立初始化，并在舞臺(tái)中放入一個(gè)影片剪輯，再創(chuàng)建補(bǔ)間動(dòng)畫，或使用代碼來描述整個(gè)場景。最后要對(duì)該幀進(jìn)行渲染及顯示。其中，渲染過程是通過代碼來完成的。用戶可以把這個(gè)渲染過程看作一個(gè)自定義的規(guī)則。而同一規(guī)則可以重復(fù)使用，并且每一幀都可以應(yīng)用不同規(guī)則，如圖1-29 所示。圖 1-29腳本動(dòng)畫1.4.2 flash 特效特效指特殊的效果，是由計(jì)算機(jī)制作出來的現(xiàn)實(shí)中不可能存在的效果；或者接近真實(shí)生活，但無法拍攝到的效果等。最先，特效通過計(jì)算機(jī)制作的圖像被運(yùn)用到了電影作

31、品的制作中。其視覺效果的魅力有時(shí)大大超過了電影故事的本身。而 flash 特效是在flash 動(dòng)畫過程中， 更多地表現(xiàn)動(dòng)態(tài)過程、闡明抽象原理的一種特殊的效果。例如，在課件設(shè)計(jì)中，合理的動(dòng)畫可以表達(dá)和傳播學(xué)科知識(shí)，而添加特效后更能提高學(xué)生學(xué)習(xí)興趣和教學(xué)效率，對(duì)于以抽象教學(xué)內(nèi)容為主的課程更具有特殊的應(yīng)用意義。1時(shí)間軸特效每種時(shí)間軸特效都以一種特定方式處理圖形或元件，并允許用戶更改所需特效的個(gè)別參16 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析數(shù)。表 1-2 列出了 flash cs4 中時(shí)間軸可以產(chǎn)生的一些特效效果。表 1-2時(shí)間軸特效內(nèi)容特效名稱說明復(fù)制到網(wǎng)格按列數(shù)直接復(fù)制選定對(duì)象，然

32、后乘以行數(shù)，以便創(chuàng)建元素的網(wǎng)格分布式直接復(fù)制直接復(fù)制選定對(duì)象在設(shè)置中輸入的次數(shù)。第一個(gè)元素是原始對(duì)象的副本。對(duì)象將按一定增量發(fā)生改變，直至最終對(duì)象反映設(shè)置中輸入的參數(shù)為止模糊通過更改對(duì)象在一段時(shí)間內(nèi)的alpha 值、位置或比例創(chuàng)建運(yùn)動(dòng)模糊特效投影在選定元素下方創(chuàng)建陰影擴(kuò)展在一段時(shí)間內(nèi)放大、縮小或者放大和縮小對(duì)象。此特效在組合在一起或在影片剪輯或圖形元件中組合的兩個(gè)或多個(gè)對(duì)象上使用效果最好。此特效在包含文本或字母的對(duì)象上使用效果很好爆炸產(chǎn)生對(duì)象發(fā)生爆炸的錯(cuò)覺。文本或復(fù)雜對(duì)象組（元件、形狀或視頻片斷）的元素裂開、自旋和向外彎曲變形調(diào)整選定元素的位置、縮放比例、旋轉(zhuǎn)、alpha 和色調(diào)。使用“變形”

33、可應(yīng)用單一特效或特效組合，從而產(chǎn)生淡入/淡出、放大 /縮小以及左旋/右旋特效轉(zhuǎn)變使用淡變、擦除或兩種特效的組合向內(nèi)擦除或向外擦除選定對(duì)象2 flash 濾鏡 /混合模式使用 flash 濾鏡（圖形效果） ，可以為文本、按鈕和影片剪輯增添有趣的視覺效果。flash所獨(dú)有的一個(gè)功能是可以使用補(bǔ)間動(dòng)畫讓應(yīng)用的濾鏡動(dòng)起來。表1-3 描述了flash 中濾鏡的一些特效及說明。表 1-3 flash 濾鏡濾鏡名稱說明投影濾鏡模擬對(duì)象投影到一個(gè)表面的效果。使投影濾鏡傾斜，可創(chuàng)建一個(gè)更逼真的陰影模糊濾鏡可以柔化對(duì)象的邊緣和細(xì)節(jié)。將模糊應(yīng)用于對(duì)象，可以讓它看起來好像位于其他對(duì)象的后面，或者使對(duì)象看起來好像是運(yùn)動(dòng)

34、的發(fā)光濾鏡可以為對(duì)象的周邊應(yīng)用顏色斜角濾鏡向?qū)ο髴?yīng)用加亮效果，使其看起來凸出于背景表面漸變發(fā)光濾鏡可以在發(fā)光表面產(chǎn)生帶漸變顏色的發(fā)光效果。漸變發(fā)光要求漸變開始處顏色的alpha 值為 0。不能移動(dòng)此顏色的位置，但可以改變?cè)擃伾珴u變斜角濾鏡可以產(chǎn)生一種凸起效果，使得對(duì)象看起來好像從背景上凸起，且斜角表面有漸變顏色。漸變斜角要求漸變的中間有一種顏色的alpha 值為 0 調(diào)整顏色濾鏡可以改變影片剪輯元件的亮度、對(duì)比度、飽和度、色相使用flash 混合模式，可以創(chuàng)建復(fù)合圖像。復(fù)合是改變兩個(gè)或兩個(gè)以上重疊對(duì)象的透明度或者顏色相互關(guān)系的過程?；旌夏Ｊ揭矠閷?duì)象和圖像的不透明度增添了控制尺度?？梢允褂胒la

35、sh 混合模式來創(chuàng)建用于透顯下層圖像細(xì)節(jié)的加亮效果或陰影，或者對(duì)不飽和的圖像第1 章17 flash 動(dòng)畫基礎(chǔ)知識(shí)涂色。使用混合模式，可以混合重疊影片剪輯中的顏色，從而創(chuàng)造獨(dú)特的效果?；旌夏Ｊ桨韵略?。混合顏色應(yīng)用于混合模式的顏色。不透明度應(yīng)用于混合模式的透明度?；鶞?zhǔn)顏色混合顏色下面的像素的顏色。結(jié)果顏色基準(zhǔn)顏色上混合效果的結(jié)果?；旌夏Ｊ讲粌H取決于要應(yīng)用混合的對(duì)象的顏色，還取決于基礎(chǔ)顏色。不同的混合模式，可以獲得不同的效果，如表1-4 所示。表 1-4混合模式模式名稱說明正常正常應(yīng)用顏色，不與基準(zhǔn)顏色發(fā)生交互圖層可以層疊各個(gè)影片剪輯，而不影響其顏色變暗只替換比混合顏色亮的區(qū)域。比混合顏色暗

36、的區(qū)域?qū)⒈３植蛔兩试鲋祵⒒鶞?zhǔn)顏色與混合顏色復(fù)合，從而產(chǎn)生較暗的顏色變亮只替換比混合顏色暗的區(qū)域。比混合顏色亮的區(qū)域?qū)⒈３植蛔優(yōu)V色將混合顏色的反色與基準(zhǔn)顏色復(fù)合，從而產(chǎn)生漂白效果疊加復(fù)合或過濾顏色，具體操作需取決于基準(zhǔn)顏色強(qiáng)光復(fù)合或過濾顏色，具體操作需取決于混合模式顏色。該效果類似于用點(diǎn)光源照射對(duì)象差異從基色減去混合色或從混合色減去基色，具體取決于哪一種的亮度值較大。該效果類似于彩色底片加色通常用于在兩個(gè)圖像之間創(chuàng)建動(dòng)畫的變亮分解效果減色通常用于在兩個(gè)圖像之間創(chuàng)建動(dòng)畫的變暗分解效果反色反轉(zhuǎn)基準(zhǔn)顏色alpha 應(yīng)用alpha 遮罩層擦除刪除所有基準(zhǔn)顏色像素，包括背景圖像中的基準(zhǔn)顏色像素3 act

37、ionscript 3.0特效actionscript的發(fā)展推動(dòng)著flash 不斷地進(jìn)步，也為flash 的發(fā)展提供了更廣闊的舞臺(tái)，如動(dòng)畫制作、交互設(shè)計(jì)、視頻點(diǎn)播、手持移動(dòng)設(shè)備、游戲制作等諸多領(lǐng)域。flash 的 actionscript 是一種腳本語言，它符合腳本語言的一般特性。其中，腳本語言是指在每次運(yùn)行時(shí)，進(jìn)行解釋和編譯的計(jì)算機(jī)程序語言。腳本語言一般都是根據(jù)腳本代碼分步解釋執(zhí)行的。actionscript 3.0 動(dòng)畫編程涉及數(shù)學(xué)、物理學(xué)等方面的內(nèi)容非常多，也比較復(fù)雜。動(dòng)畫編程主要關(guān)注兩方面：一是通過改變顯示對(duì)象的屬性創(chuàng)建動(dòng)畫效果；二是利用shape類的繪制類進(jìn)行代碼繪制，渲染效果。其中，在特效方面，actionscript 3.0 除了完成上述所介紹的時(shí)間軸特效、濾鏡和混合模18 actionscript 3.0編程特效實(shí)戰(zhàn)案例解析式外，還可以直接通過代碼完成顏色矩陣濾鏡、卷積（回旋）濾鏡和置換圖濾鏡，以及用戶自己所定義的多種效果。1.5 實(shí)戰(zhàn)項(xiàng)目：海上升明月flash 軟件可以制作各種簡單補(bǔ)間動(dòng)作的影片。例如，制作海上升明月的flash 影片，其中制作月亮升起可以