December 30, 2007
Page 65 December 30, 2007
本章提要
•
8-1 認識時間軸面板、圖層與影格•
8-2 圖層的操作與管理•
8-3 影格的類型及相關操作•
8-4 複製、搬移與反轉影格•
8-5 影格速率與時間軸刻度比例•
8-6 描圖紙功能8-1 認識時間軸、圖層與影格
•
何謂時間軸•
何謂圖層•
何謂影格Page 67 December 30, 2007
何謂時間軸
•
動畫檔案視窗中的時間軸面板（Timeline，以下簡稱時間 軸），主要顯示出圖層（Layer，以下簡稱圖層）以及影 格（Frame，以下簡稱影格）中的所有內容。•
時間軸面板的各項元件說明如下：何謂時間軸
•
時間軸中若有未能顯示的圖層，可用滑鼠拉曳右 側的捲軸來顯示其它圖層。Page 69 December 30, 2007
何謂圖層
•
製作傳統動畫的時候，為了製作上的方便，常會 將畫面中的背景與角色分別製作，例如將人物、背景分別繪製在不同的透明賽璐璐片上，當背景 與人物交疊時便成為完整的畫面；若要呈現人物 原地跳躍的動作時，只要更換人物的賽璐璐片即 可。此觀念運用在 Flash 動畫中，就是圖層。
何謂圖層
•
Flash 動畫可以將背景、物件分別放置在不同的 圖層上：Page 71 December 30, 2007
何謂影格
•
我們利用傳統動畫與 Flash 動畫的製作過程，來 對照說明影格的觀念，可以比較容易了解影格的 作用。•
傳統動畫是先在賽璐璐片上繪製圖形，然後將其 掃描成單格畫面，剪輯成為具有連貫性的影片。Flash 時間軸上一格格的影格，就如同動畫影片 的單格畫面一樣，而影格順序則代表 Flash 動畫 行進的程序，我們必須根據演出順序製作影格內 容。不過，影格內容並非放置在時間軸內，而是 顯示在舞台之中。
何謂影格
•
一般我們觀賞的卡通影片就是將多個連貫的單格畫面連續 播放，而連續播放Flash 時間軸上的影格，即形成 Flash 動畫。一部 Flash 動畫的演出全看如何在時間軸上設計與 安排影格。Page 73 December 30, 2007
在 Flash 製作動畫的注意事項
•
多運用補間動畫（Tweened）來設計動畫效果，並減少 動畫中關鍵影格的數量。•
多利用元件（Symbol），少用匯入點陣圖的方式來製作 動畫。•
動畫中的靜態、動態部分，及 ActionScript 程式、聲音、視訊，儘量都分開在不同圖層中製作較好。
•
匯出含有聲音的 Flash 影片時，利用 MP3 格式來壓縮聲 音可有效降低檔案大小。•
注意使用的字型。使用裝置字體可有效降低檔案大小，若 是不想使用裝置字型，則不要使用太多種字型以免增加檔 案體積。8-2 圖層的操作與管理
•
圖層的作用就如同一張張透明的賽璐璐片，你可 以將動畫中的每項物件，放置在不同圖層中，圖 層交疊就形成完整的畫面。在各圖層中的物件，做任何的移動或變化，都不會相互干擾，所以當 你編輯一個物件時，只要在物件所在的圖層進行 操作，將可大幅降低製作過程的複雜度與難度。
Page 75 December 30, 2007
新增與刪除圖層
•
新增圖層▫
開啟一份新的動畫檔時預設只有一個圖層，新增 圖層的方式如下：•
刪除圖層▫
若是有不需要使用的圖層，可先按一下圖層名稱，再按下刪除圖層鈕或是該圖層拉曳至刪除圖層鈕 上，皆可刪除圖層。
將圖層重新命名
•
Flash 會自動將圖層依序命名為圖層＊（＊為 1 、 2 、3... 等依序編號），為了方便日後的編輯工作，建議您為圖層重新更改為容易辨識的名稱。
為圖層重新命名時，請雙按圖層名稱，即可輸入 新的圖層名稱。
Page 77 December 30, 2007
•
當你想要對圖層進行任何編輯動作時，必須先選取圖層，而選取的方式有如右 2 種：
•
此外，想要選取多個圖層時，可按住 [Shift] 鍵不放，再 接續按下其它圖層名稱。選取圖層
改變圖層順序
•
圖層的上下位置代表圖層中物件在編輯區域的前後關係。在愈上方的圖層，就位於編輯區域愈上層，而背景則是放 置在最底層的圖層。想要變更圖層的順序，請如下進行：
Page 79 December 30, 2007
實做練習
•
圖層的使用（exercise/airplane.fla）▫
製作飛機與汽車同時橫越舞臺之動畫▫
調整使飛機與汽車之速度不同使用圖層資料夾管理圖層
•
在製作大型動畫的時候，圖層太多可能造成操作、尋找上的不方便，這時候就可以利用圖層資料夾
（Layer Folder ），將相關的圖層放在同一圖層 資料夾下，管理起來就會方便許多。
Page 81 December 30, 2007
使用圖層資料夾管理圖層
使用圖層資料夾管理圖層
•
圖層資料夾關閉時會隱藏其下的所有圖層，以 精簡時間軸的空間，再按一下圖層資料夾前方 小三角形，可再次開啟圖層資料夾：Page 83 December 30, 2007
圖層的 4 種狀態
•
在圖層名稱右方有圖層狀態欄，以圖示來顯示該 圖層的圖層狀態，一共有 4 種圖層狀態，其代表 的意義如下：•
作用中的圖層：目前正在進行編輯的圖層。•
不論有幾個圖層，都只會有 1 個作用圖層。•
作用中圖層除了圖層名稱右方會顯示 圖示外，圖層也會呈現被選取的狀態。
•
當你要在圖層中繪製新的圖形、插入實體或是執 行『貼上』命令時，該圖層都必須是在作用狀態 下才行。圖層的 4 種狀態
Page 85 December 30, 2007
圖層的 4 種狀態
•
隱藏的圖層：表示該圖層的物件不會顯示出來，也不能進行編輯的工作。當你正在編輯某一個圖 層時，可以將其它圖層設定為隱藏，以便在不受 干擾的環境下順利進行編輯動作。
•
鎖定的圖層：表示該圖層無法執行任何編輯動作，但圖層中的物件仍可正常顯示。當你正在編輯某 一圖層時，可以將其它圖層設為鎖定，避免不小 心更動到其它圖層的內容。
圖層的 4 種狀態
•
將圖層中的物件顯示成外框：表示該圖層中的所 有物件都會以外框線條來顯示。當動畫的內容複 雜，需要隨時參考其它圖層的內容，可將圖層設 定為此狀態，就不用擔心編輯的物件會被上面圖 層遮住，並可了解各圖層物件的相對位置，兼顧 編輯時的方便性。Page 87 December 30, 2007
圖層的 4 種狀態
切換圖層狀態
•
若要將圖層切換成作用中的圖層，只要選取該 圖層即可。•
接下來為您說明其餘圖層狀態的切換方法，我 們以切換成隱藏的圖層來做示範，而鎖定、顯 示成外框的操作也都相同。Page 89 December 30, 2007
切換圖層狀態
•
隱藏單一圖層：按一下圖層名稱右方的隱藏圖 層狀態欄，可以切換圖層的隱藏或顯示狀態：切換圖層狀態
•
隱藏或顯示所有圖層：按下圖層狀態欄的 圖示，可同時隱藏或顯示所有的圖層。
Page 91 December 30, 2007
切換圖層狀態
•
隱藏或顯示其它圖層：按住 [Alt] 鍵，再按一下 圖層名稱右方的隱藏圖層狀態欄，可以切換其 他圖層的隱藏或顯示狀態：8-3 影格的類型及相關操作
•
新增影格•
播放磁頭與影格的關係•
選取影格•
移除影格•
影格的類型•
設定關鍵影格•
設定空白關鍵影格•
清除關鍵影格Page 93 December 30, 2007
新增影格
•
在 Flash 中開啟一個新檔案時，其時間軸刻度表 上只有 1 格影格，我們可透過以下的方法來新增影格，假設我們要新增影格至影格 15 的位置：
新增影格
•
新增的影格會延續前一關鍵影格（影格類型將 在稍後說明）的內容，以本例而言，就是影格 1 與影格 2 ~ 14 中的內容都一樣。•
往後若是新增圖層，將會自動建立好相同數目 的影格，但在新增的圖層中，影格內容是空白 的，並不會加入任何內容：Page 95 December 30, 2007
在現有影格範圍內插入影格
•
若要在現有影格範圍內插入新影格，只要先選取想要插入 的影格數量，再按下 [F5] 鍵即可新增影格。播放磁頭與影格的關係
•
在時間軸上方有時間軸刻度表，其刻度數就代表影格編號，而播放磁頭會指出目前編輯區顯示的是哪一格影格的內容。
播放動畫時，播放磁頭會在時間軸刻度表上由左向右移動，
讓我們檢視動畫的播放效果：
Page 97 December 30, 2007
播放磁頭與影格的關係
•
亦可直接拉曳播放磁頭到想要顯示的影格，編輯 區會顯示該影格內容（或者直接按下時間軸刻度 表上的影格刻度）。此外，播放磁頭只限在動畫 長度的範圍內移動。選取影格
•
在編輯影格之前，首先要學會如何選取影格，下 面我們示範幾種常用的選取方法：•
在既有的影格中用滑鼠拉曳選取，指標經過的影 格都會被選取，此方式只能選取相鄰且連續的影 格。Page 99 December 30, 2007
選取影格
•
按住 [Shift] 鍵，然後再分別按下欲選取影格的頭尾影格，即使不同圖層也可以一併選取：
•
按一下圖層名稱選取圖層，可將圖層中所有的影格一次 選取：選取影格
•
選取物件時，所有包含該物件的影格都會自動選 取：•
移除影格▫
選取要移除的影格，按右鈕執行『移除影格』命Page 101 December 30, 2007
影格的類型
•
Flash 一共有3 種影格類型，分別為關鍵影格（key frame）、空白關鍵影格（Blank key frame）與影格（Frame ）。
•
當我們對動畫中的影格進行編輯，會發現這些 影格在時間軸上的圖示將顯示成 ，這類的影 格我們稱之為關鍵影格（key frame）。•
一般而言，關鍵影格多用在動畫過程中產生變 化的影格，可說是動畫的重心。我們可以在關 鍵影格加入物件（包括聲音檔）或特效、編輯 圖像、編輯元件，或是加入ActionScript 。
關鍵影格
Page 103 December 30, 2007
空白關鍵影格
•
空白關鍵影格（Blank key frame）是一種特殊 的關鍵影格，表示此關鍵影格中沒有任何物件，其作用是清空前一關鍵影格中的物件，所以多半 用在關鍵影格之後；或使用在影格中沒有物件，
但必須加入 ActionScript 或聲音檔的情況中。
影格
•
關鍵影格和空白關鍵影格之外的影格，都屬於一 般的影格（Frame），一般影格的作用在於延續 前一個關鍵影格或空白關鍵影格的內容。•
當影格之前有個關鍵影格時，影格會呈現灰色，表示延續前面關鍵影格的內容；若影格之前有個 空白關鍵影格，影格呈現白色，表示延續前面空 白關鍵影格的內容，也就是一片空白。