文、蘇芳玲老師

images.jpg 萬丈高樓平地起,繼上一篇「Flash動畫觀念與基本環境介紹」,本篇要教大家認識flash動畫基礎功能。

一、認識元件(Symbol)、實體(Instance)與元件庫(Library)

1.元件(Symbol)

Flash動畫的檔案體積,是讓它能夠在網際網路中迅速竄紅的原因之ㄧ,因為除了應用向量格式的圖檔繪圖特性外,在Flash動畫中如果有大量要重複使用的圖形,可以將它轉成『元件(Symbol)』,重複使用元件是不會增加檔案大小的,如此便可以有效地減少檔案的大小。

2.實體(Instance)

在Flash中可以將所需要用到的物件存放在『元件庫(Library)』中,例如匯入的聲音、影片、文字物件或其他繪製完成的圖形等,並將其製作成元件,當需要使用到該元件時,便可以從元件庫中將元件拖曳至場景中(或其他元件中)使用,此被拖曳至場景中的物件就是元件的分身,稱之為『實體(Instance)』

由於每一個實體都是獨立的個體,所以在場景中任意編輯或更改實體的屬性時,都不會影響到其他的實體,也不會對該元件本尊造成任何影響。但是如果編輯該實體來源的元件,那麼該元件所有的實體都會跟著同步更新(本尊影響分身,分身不影響本尊)。此外,Flash在儲存檔案時,並不會將所有的實體都儲存起來,而是只會儲存元件庫的元件,因此整個Flash動畫的檔案就會變得很小了。

3.元件庫(Library)

所謂的元件庫就是用來存放各種所需的元件、點陣圖、聲音、視訊等等的地方,可以將之想成是演員休息室(放置在元件庫中的物件想成是演員),所有的元件被建立以後,都會被存放在元件庫當中,而從外面匯入的圖檔、聲音、視訊等物件,也會被存放在元件庫中,方便往後的可以使用。

元件庫分為兩種:一種為每個動畫自己專屬的元件庫,另一種則是Flash內建的元件庫(Common Libraries),這兩種元件庫都可以透過執行功能表中的「視窗/元件庫」或「視窗/內建元件庫」來開啟。

二、元件的類型

在Flash中可以將元件分成三種類型:圖像元件(Graphic Symbol)影片片段元件(MovieClip Symbol)按鈕元件(Button Symbol),茲分別說明如下:

1.圖像元件(Graphic Symbol)

除了一般的靜態圖檔可以建立成圖像元件外,一段動畫也可以建立成圖像元件。而圖像元件最大的特色就是必須隨著動畫的主時間軸來播放,也就是說當建立了一個具有10個影格的圖像元件時,主動畫至少也要有10個影格的時間軸,這樣才可以將此具有10個影格的圖像元件完整地播放1次;若主動畫具有20個影格,則主動畫將會播放2次圖像元件。另外,圖像元件是所有元件中唯一無法使用ActionScript與支援聲音的元件(在應用上較沒有彈性)。

2.影片片段元件(Movie Clip Symbol)

影片片段元件本身就是一段獨立的動畫,當然它可以包含一般靜態的圖片、聲音、甚至是另一個元件,而它和圖像元件最大的不同點在於它可以支援ActionScript與聲音,且影片片段元件的時間軸是獨立於主動畫之外的,也就是說影片片段元件擁有自己的時間軸,不受主動畫的影格數影響,只要影片片段元件存在於場景中,它就可以繼續不停的播放,即使主動畫時間軸已經停止。但影片片段元件無法在編輯環境下播放,必須在發佈成SWF影片檔,或是執行『控制/測試影片(Ctrl+Enter)』測試動畫的狀態下,才可以看得到影片片段的動畫效果。

3.按鈕元件(Button Symbol)

按鈕元件主要功能就是製作按鈕類的動畫,並透過ActionScript與瀏覽者的滑鼠或鍵盤事件產生互動效果。每個按鈕元件都是由4個影格所組成的,這4個影格分別代表按鈕的4種不同狀態。另外,按鈕元件內也可以包含其他的影片片段元件或圖像元件。關於按鈕元件的四種影格狀態分別說明如下:

A. 一般(Up)影格:代表按鈕元件尚未偵測到滑鼠游標動作的一般初始狀態。

B. 滑入(Over)影格:代表滑鼠游標碰到按鈕元件時的狀態。

C. 按下(Down) 影格:代表滑鼠游標在按鈕元件上按下左鍵不放時的狀態。

D. 感應區(Hit) 影格:此影格是用來偵測感應滑鼠事件的感應區(範圍)。

感應區影格的作用是偵測滑鼠動作,當滑鼠游標進入感應區時,按鈕元件就會由一般狀態變成滑入狀態;如果在感應區內按下滑鼠左鍵,則按鈕元件就會變成按下的影格狀態。

另外,按鈕元件對滑鼠事件的追蹤方式有「按鈕形式」與「選單項目形式」兩種;若將按鈕元件設定為前者的追蹤方式,則按鈕元件不會接收到在別的按鈕元件上按下滑鼠左鍵的滑鼠事件;若將按鈕元件設定為後者的追蹤方式,則按鈕元件就可以接收到其他也是設定為選單項目形式的按鈕元件上按下滑鼠左鍵的滑鼠事件。

其實按鈕元件可以不用製作感應區的狀態,按鈕元件還是會對滑鼠事件產生反應,因為沒有製作感應區的按鈕元件會依照按下影格滑入影格一般影格的順序,來尋找其影格中的物件做為感應區的範圍,例如按下影格中有內容,就以按下影格中的物件當做感應區的範圍;如果按下影格中沒有內容時,就會以滑入影格中的物件來當做感應區,以此類推。因此,凡是當做感應區的影格,該影格中的所有物件就都會變成感應區。

必須特別注意的是,若不打算製作感應區影格的內容時,絕不可以將其設定為空白關鍵影格,因為內容空白的感應區影格是表示不要設置感應區,此時按鈕元件也就失去了功用。

 Flash元件介紹與編輯001

圖一:元件庫中,三種元件的圖示

 三、元件的特性比較

到底在製作動畫時,該選擇哪一種類型的元件比較適合?茲將元件的特性比較如下:


圖像元件
影片片段元件 按鈕元件
動 態

可以,在編輯區可以預覽動畫效果,但受到主動畫影格數的限制。

可以,在編輯區無法預覽動畫效果,但不 受到主動畫影格數的限制。

可以,在編輯區可以預覽動畫效果,但不受到主動畫影格數的限制。

ActionScript  不支援  支援 支援
聲 音  不支援 支援 支援

由於影片片段元件的支援度最高最具彈性,故一般都建議使用片片段元件類型,這樣可以大幅增加動畫的修改彈性。

在建立元件之前仔細地分析對物件的需求,例如是否要加入某些特殊效果,或需要互動功能及定位,再來選擇適合的元件類型,經由正確的設計,元件的使用一定可以在創作Flash動畫時更加輕鬆及快速。

四、建立元件的方法

建立元件的步驟,通常是先替元件命名,接著決定元件的類型(圖像元件、影片片段元件或按鈕元件)。使用以下兩種方式建立元件的不同點在於,如果是直接選取現成的物件轉成元件的方式,Flash會自動將原來在場景中的物件變成實體,若是一開始先建立一個新元件的話,則此元件並不會出現在場景上,而是直接被儲存在元件庫中。但不論使用哪一種方式建立元件,該元件最後都會被存放在該檔案的元件庫中。

建立元件的方式有兩種,一種是在Flash中建立新的元件,另一種則是選取場景中現成的物件或形狀(Shape)將其轉成元件,方法說明如下:

1.在Flash中建立新的元件

(1)點選功能表中的「插入/新增元件」

(2)按下「Ctrl+F8」

(3)將元件庫呼叫出來,按元件庫下方的「+」符號。

 2.選取現成的物件轉換成元件

(1)點選功能表中的「修改/轉換成元件」

(2)按下「F8」將其轉換成元件。

(3)直接以滑鼠拖曳的方式將欲轉成元件的圖形拖曳至元件庫中。

 Flash元件介紹與編輯002

圖二:點選功能表「插入/新增元件」即可新增元件

 Flash元件介紹與編輯003  

圖三:替元件命名及選擇元件類型

五、元件的編輯環境(編輯元件)

若要編輯元件的內容,必須切換到該元件的編輯模式下才能進行,而當該元件被更改後,該元件在場景中的所有實體(分身),也會全部跟著更新其內容。元件的編輯模式可以分為三種,分別說明如下:

1.一般編輯環境

這是最常使用的編輯方式,使用此模式的優點是可以開啟元件專屬的編輯環境,不受場景中其他物件的影響。要開啟元件的一般編輯環境有以下幾種方法:

(1)直接按下Flash動畫文件視窗右上角的「編輯元件按鈕」,選擇要編輯的元件。

(2)在元件庫面板中,選取欲編輯的元件,雙按元件名稱前的圖示,或雙按元件庫上方的預覽窗格。

(3)在場景中的實體上按右鍵,點選快顯功能表的「編輯」命令。

(4)選取場景中的實體,執行功能表的「編輯/編輯元件」

2.在實體位置上編輯

此方式最大的好處是在於可以直接在場景中編輯該元件,方便和在場景中的其他物件進行比對。其方法有兩種:一是直接在實體上雙按滑鼠左鍵,另一個方法則是按下滑鼠右鍵,點選「在原地編輯」,就可以進入此編輯狀態了。

3.在新視窗中編輯

此方式是開啟另一個獨立的文件視窗來編輯元件,可以省去在場景和元件間切換的手續。選取場景中的實體,按下滑鼠右鍵,點選「在新視窗中編輯」,即可以進入此模式編輯元件了。

 Flash元件介紹與編輯004

圖四:在實體上按右鍵所出現的快顯功能表中,可以選擇的三種編輯元件的方式

 

 

lccnetvip 發表在 痞客邦 PIXNET 留言(0) 人氣()