關於傳統補間動畫

註解:

與 Animate 中的多數項目相同,動畫也不需要任何 ActionScript。不過,您可以選擇使用 ActionScript 來建立動畫。

「傳統補間動畫」是在 Animate 中建立動畫的較舊方式。這些補間動畫類似較新的「移動補間動畫」,但建立的方法較為複雜,且缺乏彈性。不過,傳統補間動畫在動畫的控制方面,確實提供了移動補間動畫所欠缺的幾種功能。大部分使用者會選擇使用較新的移動補間動畫,但部分使用者仍會想使用傳統補間動畫。如需這兩者之間差異的詳細資訊,請參閱移動補間動畫與傳統補間動畫的差別

開始之前:

使用傳統補間動畫之前,請記住下列要點:

  • 傳統補間動畫是在 Animate 中建立補間動畫的較舊方式。使用移動補間動畫是較新、較容易的方式。請參閱移動補間動畫

  • 您無法使用傳統補間動畫將 3D 屬性製成補間動畫。

如需傳統補間動畫的範例,請參閱 www.adobe.com/go/learn_fl_samples_tw 上的「Animate 範例」頁面。下列範例可供您參考:

  • 動畫投影:下載並解壓縮 Samples 這個壓縮檔,然後瀏覽至 Graphics\AnimatedDropShadow 資料夾以存取範例。

  • 動畫和漸層:下載並解壓縮 Samples 這個壓縮檔,然後瀏覽至 Graphics\AnimationAndGradients 資料夾以存取範例。

建立與編輯傳統補間動畫的關鍵影格

註解:

本主題是關於為較舊的傳統補間動畫建立關鍵影格。如需較新的移動補間動畫的屬性關鍵影格的說明,請參閱建立補間動畫

傳統補間動畫的變更是在關鍵影格中定義。在補間動畫中,只要在動畫的重要點上定義關鍵影格,Animate 便會建立影格之間的內容。補間動畫的漸變影格會顯示為淺藍色或淺綠色,並在關鍵影格之間繪製一個箭頭。因為 Animate 會在每個關鍵影格中儲存形狀,所以只在圖案會有所變更的影格上建立關鍵影格。

在「時間軸」中會指出關鍵影格:實心圓表示關鍵影格有內容,而影格前面的空心圓則表示關鍵影格為空白。隨後加入同一個圖層的影格都與關鍵影格的內容相同。

傳統補間動畫可供編輯的項目僅限於關鍵影格。您可以檢視補間影格,但無法直接加以編輯。若要編輯補間影格,可以變更其中一個決定性的關鍵影格,或者在開頭和結尾關鍵影格之間插入新關鍵影格。從「元件庫」面板將項目拖曳到「舞台」上,以便將項目加入目前的關鍵影格。

若要同時顯示並編輯一個以上的影格,請參閱使用描圖紙

建立關鍵影格

  • 請執行下列其中一項:
    • 在「時間軸」中選取一個影格,然後選取「插入 > 時間軸 > 關鍵影格」。

    • 在「時間軸」中的任一影格上按一下右鍵 (Windows) 或 Control + 按一下 (Macintosh),然後選取「插入關鍵影格」。

將影格插入時間軸

  • 若要插入新影格,可以選取「插入 > 時間軸 > 影格」。

  • 若要建立新關鍵影格,可以選取「插入 > 時間軸 > 關鍵影格」,或者在要放置關鍵影格的影格上按一下右鍵 (Windows) 或 Control + 按一下 (Macintosh),然後選取「插入關鍵影格」。

  • 若要建立新空白關鍵影格,可以選取「插入 > 時間軸 > 關鍵影格」,或者在要放置關鍵影格的影格上按一下右鍵 (Windows) 或 Control + 按一下 (Macintosh),然後選取「插入空白關鍵影格」。

刪除或修改影格或關鍵影格

  • 若要刪除影格、關鍵影格或連續影格,可以選取影格並按一下右鍵 (Windows) 或 Control + 按一下 (Macintosh),然後選取「移除影格」。周圍的影格仍會保持不變。

  • 若要移動關鍵影格或連續影格及其內容,可以選取影格並拖曳到所要的位置。

  • 若要延長關鍵影格的持續時間,可以按住 Alt (Windows) 或 Option (Macintosh) 鍵,並將關鍵影格拖曳到新連續影格的最後一個影格。

  • 若要複製並貼上影格或連續影格,可以選取影格,然後選取「編輯 > 時間軸 > 複製影格」。選取要取代的影格或連續影格,然後選取「編輯 > 時間軸 > 貼上影格」。若要貼上並取代目標時間軸上所複製影格的確實數目,請使用「貼上並覆寫影格」選項。

  • 若要將關鍵影格轉換為影格,可以選取關鍵影格,然後選取「修改 > 時間軸 > 清除影格」,或者在關鍵影格上按一下右鍵 (Windows) 或 Control + 按一下 (Macintosh),然後選取「清除關鍵影格」。清除的關鍵影格和介於它與下一個關鍵影格之間的所有影格,都會由清除的關鍵影格前面的影格內容所取代。

  • 若要以拖曳方式複製關鍵影格或連續影格,可以選取影格,然後按住 Alt (Windows) 或 Option (Macintosh) 鍵,並拖曳到新位置。

  • 若要變更連續補間動畫的長度,可以將開頭或結尾關鍵影格向左或向右拖曳。

  • 若要將元件庫項目加入目前的關鍵影格,可以將此項目從「元件庫」面板拖曳到「舞台」上。

  • 若要反轉連續動畫,可以在一個或多個圖層中選取適合的影格,然後選取「修改 > 時間軸 > 反轉影格」。連續動畫的開頭或結尾必須要有關鍵影格。

將傳統補間動畫新增至實體、群組或文字

註解:

本主題是關於建立較舊的傳統補間動畫。如需建立較新的移動補間動畫的說明,請參閱建立補間動畫

若要將實體、群組及類型的屬性變更製成補間動畫,可使用傳統補間動畫。Animate 可將實體、群組和類型的位置、大小、旋轉及傾斜製作成補間動畫。此外,Animate 也能將實體和類型的顏色製作成補間動畫,建立顏色漸變或讓實體淡入、淡出的效果。

群組或文字的顏色要製作成補間動畫之前,必須先轉換成元件。若要將文字區塊中的個別字元分別製作成動畫,請將每個字元放在不同的文字區塊中。

如果您在套用傳統補間動畫之後,接著更改了兩個關鍵影格之間的影格數目,或是移動了任一關鍵影格中的群組或元件,Animate 將會自動為這些影格重新建立補間動畫。

 

建立傳統補間動畫

  1. 按一下圖層名稱,使其成為作用中的圖層,然後在圖層中選取要開始播放動畫的空白關鍵影格。此影格將成為傳統補間動畫的第一個影格。
  2. 執行下列其中一項,為傳統補間動畫的第一個影格加入內容:
    • 使用「鋼筆」、「橢圓形」、「矩形」、「鉛筆」或「筆刷」工具建立圖像物件,然後將其轉換為元件。

    • 在「舞台」上建立實體、群組或文字區塊。

    • 從「元件庫」面板中將元件實體拖曳出來。

    註解:

    若要建立補間動畫,圖層上只能有一個項目。

  3. 在您要結束動畫的位置建立另一個關鍵影格,並使新的關鍵影格保持在選取狀態。
  4. 執行下列任何一項,修改結尾影格中的項目:
    • 將項目移動到新位置。

    • 修改項目的大小,或是將它旋轉或傾斜。

    • 修改項目的顏色 (僅適用於實體或文字區塊)。如果要將實體或文字區塊除外的其他元素的顏色製成補間動畫,請使用形狀補間動畫。

  5. 執行下列其中一項,建立傳統補間動畫:
    • 按一下補間動畫影格範圍內的任一影格,然後選取「插入 > 傳統補間動畫」。

    • 用滑鼠右鍵按一下 (Windows) 或 Control+按一下 (Macintosh) 補間動畫影格範圍內的任一影格,再從快顯選單中選取「建立傳統補間動畫」。

    如果您在步驟 2 建立了圖像物件,Animate 會自動將該物件轉換為元件,並將其命名為 tween1

  6. 如果您在步驟 4 修改了項目的大小,請在「屬性」檢測器的「補間動畫」區段中,選取「縮放」以將選取項目的大小製成補間動畫。
  7. 如需產生更真實的移動感,則可對傳統補間動畫套用加/減速。若要對傳統補間動畫套用加/減速,請在「屬性」檢測器的「補間動畫」區段中,使用「加/減速」欄位為您建立的每個傳統補間動畫指定加/減速值。利用「自訂加/減速度」對話方塊,甚至還能更精確地控制傳統補間動畫的速度。

    拖曳「加/減速」欄位內的值或者輸入值,以調整補間動畫影格之間的變動速率:

    • 若要在開始時慢慢地播放傳統補間動畫,並在動畫即將結束時加速播放補間動畫,請輸入介於 -1 到 -100 之間的負值。

    • 若要在開始時快速地播放傳統補間動畫,並在動畫即將結束時減速播放補間動畫,請輸入介於 1 到 100 之間的正值。

    • 若要使補間動畫的影格範圍產生更複雜的速率變動,請按一下「加/減速」欄位旁的「編輯」按鈕,開啟「自訂加/減速度」對話方塊。

      根據預設,補間動畫影格之間的變動速率是不變的。加/減速度能逐漸調整變動速率,以產生更逼真的加速或減速現象。

  8. 如需在補間動畫期間旋轉選取的項目,請從「屬性」檢測器的「旋轉」選單中選取任一選項:
    • 若要避免旋轉,可以選取「無」(預設設定)。

    • 若要將物件朝著移動需求最小的方向旋轉一次,可以選取「自動」。

    • 若要依指示旋轉物件,然後再輸入要指定旋轉次數的數字,可以選取「順時針 (CW)」或「逆時針 (CCW)」。

    註解:

    步驟 8 的旋轉是步驟 4 (套用到結尾影格上的任何旋轉) 所另外增加的步驟。

  9. 如果您是使用移動路徑,請在「屬性」檢測器中選取「沿向路徑」,讓補間動畫元素的基線以移動路徑為方向。
  10. 若要讓圖像元件實體的動畫和主要「時間軸」同步進行,可以在「屬性」檢測器中選取「同步」選項。

    註解:

    「修改 > 時間軸 > 同步化元件」和「同步」選項都會重新計算補間動畫中的影格數目,以符合時間軸內配置給補間動畫的影格數目。如果元件內的連續動畫影格數不是文件中圖像實體影格數目的偶數倍數,請使用「同步」選項。

  11. 如果使用的是移動路徑,請選取「貼齊」,將補間動畫元素的註冊點附加到移動路徑上。

使用儲存為 XML 檔案的傳統補間動畫

Animate 可讓您以 XML 檔案形式使用傳統補間動畫。本質上,Animate 可讓您在任何傳統補間動畫上套用下列命令:

  • 將移動複製為 XML

  • 將移動匯出為 XML

  • 將移動匯入為 XML

 

將移動複製為 XML

讓您可以在上述影格中,複製套用到「舞台」上任何物件的移動屬性。

  1. 建立傳統補間動畫。

  2. 選取「時間軸」上的任何關鍵影格。

  3. 前往「命令 > 將移動複製為 XML」。

移動屬性隨即會以 XML 資料形式複製到剪貼簿,然後,您可以使用任何文字編輯器來處理 XML 檔案。

將移動匯出為 XML

讓您可以將套用到舞台上任何物件的移動屬性匯出到可以儲存的 XML 檔案。

  1. 建立傳統補間動畫。

  2. 前往「命令 > 將移動匯出為 XML」。

  3. 瀏覽到您要儲存檔案的適當位置。

  4. 為 XML 檔案提供名稱,並按一下「儲存」。

傳統補間動畫隨即會在指定的位置匯出為 XML 檔案。

將移動匯入為 XML

讓您可以匯入已定義移動屬性的現有 XML 檔案。

  1. 選取「舞台」上的任何物件。

  2. 前往「命令 > 將移動匯入為 XML」。

  3. 瀏覽至位置,並選取 XML 檔案。按一下「確定」。

  4. 在「選擇性貼上移動」對話方塊中,選取您要在選取的物件上套用的屬性。

  5. 按一下「確定」。

建立移動導引線圖層

若要控制物件在「傳統補間動畫」中的移動,請建立移動導引線圖層

您無法將「移動補間動畫」圖層或反向運動「姿勢圖層」拖曳至導引線圖層上。

  • 將一般圖層拖曳至導引線圖層上。這會將導引線圖層轉換為移動導引線圖層,並且將一般圖層連結至這個新的移動導引線圖層。

    註解:

    若要避免無意間轉換導引線圖層,請將所有的導引線圖層放在圖層順序的底部。

沿著路徑建立傳統補間動畫

註解:

本主題是關於使用較舊的傳統補間動畫。如需使用具有移動路徑的較新的移動補間動畫的說明,請參閱編輯補間動畫的移動路徑

移動導引線圖層能讓您製作出可以沿著導引線移動的實體、群組或文字區塊。您可以將多個圖層連結至一個移動導引線圖層上,讓多個物件沿著相同的路徑進行。連結至移動導引線圖層的一般圖層將會成為已導引的圖層。

移動路徑
在這個範例中,我們會將位於不同圖層上的兩個物件附加到相同的移動路徑上。

為傳統補間動畫建立移動路徑

  1. 建立傳統補間動畫序列。

    如果您在「屬性」檢測器中選取了「沿向路徑」,補間動畫元素的基線會以移動路徑為方向。如果選取了「貼齊」,補間動畫元素的註冊點將會貼齊到移動路徑上。

  2. 用滑鼠右鍵按一下 (Windows) 或 Control+按一下 (Macintosh) 傳統補間動畫所在圖層的圖層名稱,然後選擇「增加移動導引線」。

    Animate 會在傳統補間動畫圖層上面加入移動導引線圖層,並將傳統補間動畫圖層的名稱縮排,表示此圖層已繫結至移動導引線圖層。

    註解:

    如果「時間軸」內已有導引線圖層,您可以將包含傳統補間動畫的圖層拖曳到導引線圖層下面,而使導引線圖層轉換為移動導引線並讓傳統補間動畫與之繫結。

    移動導引線圖層
    包含傳統補間動畫的圖層上面加入了移動導引線圖層。

  3. 若要在移動導引線圖層上加入路徑用來導引傳統補間動畫,請先選取移動導引線圖層,然後使用「鋼筆」、「鉛筆」、「線段」、「圓形」、「矩形」或「筆刷」工具,繪製您想要的路徑。

    您也可以將筆畫貼入移動導引線圖層。

  4. 拖曳您要製作補間動畫的物件,使之貼齊到導引線在第一個影格中的起始處,並貼齊到導引線在最後一個影格中的結束位置。
    已與導引筆畫起始處貼齊的圖像
    已與導引筆畫起始處貼齊的汽車圖像。

    註解:

    若需要最好的貼齊結果,請直接拖曳元件的變形點。

  5. 若要隱藏移動導引線圖層和路徑,以便在工作時只看到物件的移動效果,請按一下移動導引線圖層上的「顯示」欄。

    播放動畫時,群組或元件會沿著移動路徑前進。

若要深入了解以變數寬度筆畫和變數筆畫顏色為主的動畫導引線,請參閱動畫導引線

  • 請執行下列其中一項:
    • 對移動導引線圖層下方的現有圖層進行拖曳。圖層會在移動導引線圖層之下縮排。這個圖層上的所有物件都會被自動貼齊到移動路徑上。

    • 在移動導引線圖層下面建立一個新圖層。您在這個圖層上製作成補間動畫的物件,都會自動沿著移動路徑前進。

    • 選取移動導引線圖層下面的圖層。選取「修改 > 時間軸 > 圖層屬性」,然後選取「導引圖層」。

  • 選取要中斷連結的圖層,並執行下列其中一項:
    • 對移動導引線圖層上面的圖層進行拖曳。

    • 選取「修改 > 時間軸 > 圖層屬性」,然後選取「一般」做為圖層類型。

貼上傳統補間動畫屬性

註解:

本主題是關於貼上較舊的傳統補間動畫的屬性。如需貼上較新的移動補間動畫屬性的說明,請參閱複製與貼上移動補間動畫屬性

「貼上移動」命令可讓您複製傳統補間動畫,並只貼上要套用到另一個物件的特定屬性。

  1. 在「時間軸」中,選取含有要複製之傳統補間動畫的影格。選取的影格必須是在同一個圖層上,但不需跨越單一傳統補間動畫。選取範圍可跨越補間動畫、空白影格或兩個以上的補間動畫。
  2. 選取「編輯 > 時間軸 > 複製移動」。
  3. 選取要接收複製之傳統補間動畫的元件實體。
  4. 選取「編輯 > 時間軸 > 選擇性貼上移動」。選取要貼到元件實體的傳統補間動畫特定屬性。這類傳統補間動畫屬性包括:

    X 座標

    物件可在 X 軸方向移動的距離。

    Y 座標

    物件可在 Y 軸方向移動的距離。

    水平縮放

    在水平方向 (X 軸) 上,物件的目前大小與「原始大小」之間的比例。

    垂直縮放

    指定在垂直方向 (Y 軸) 上,物件的目前大小與「原始大小」之間的比例。

    旋轉和傾斜

    物件的旋轉和傾斜特效。這些屬性必須一起套用到物件上。傾斜為旋轉度數的測量,而在進行旋轉和傾斜時,每一個屬性都會彼此相互影響。

    顏色

    所有顏色值 (如色調、亮度和 Alpha) 都會套用到物件上。

    濾鏡

    選定範圍的所有濾鏡值和變更。如果要將濾鏡套用到物件上,而且要以完整的所有值來貼上濾鏡,也會將濾鏡的狀態 (啟用或停用) 一併套用到新物件上。

    混合模式

    套用物件的混合模式。

    覆寫目標縮放屬性

    取消選取時,這個選項會指定要貼上與目標物件相關的所有屬性。當選取時,這個選項會覆寫目標物件的縮放屬性。

    覆寫目標旋轉和傾斜屬性

    取消選取時,這個選項會指定要貼上與目標物件相關的所有屬性。當選取時,貼上的屬性會覆寫物件的現有旋轉和縮放屬性。

    即會插入必要的影格、補間動畫和元件資訊,以符合原始複製的補間動畫。

    若要將元件的傳統補間動畫複製到「動作」面板,或者供其他專案做為 ActionScript 使用,請使用「將移動複製為 ActionScript 3.0」命令。

將自訂加/減速套用至傳統補間動畫

註解:

本主題是關於新增加/減速至較舊的傳統補間動畫。如需新增加減速至較新的移動補間動畫的說明,請參閱加/減速補間動畫

「自訂加/減速度」對話方塊會以圖表,顯示動作隨時間移動的程度。水平軸是影格,而垂直軸則代表變化百分比。第一個關鍵影格會以 0% 表示,最後一個關鍵影格則為 100%。

圖表曲線的傾斜度代表物件的變動速率。當曲線為水平 (沒有傾斜) 時,表示速度為零;當曲線為垂直時,則表示有瞬間的變動速率。

自訂加/減速度圖表
顯示等速的自訂加/減速度圖表。在傳統補間動畫中選取影格,然後在「屬性」檢測器的「加/減速」區段中按一下「編輯」按鈕以開啟此對話方塊。

自訂加/減速度對話方塊的其他控制項

全部屬性使用單一設定核取方塊

預設為選取;全部屬性都會使用所顯示的曲線,而「屬性」彈出式選單則為停用狀態。如果沒有選取這個核取方塊,則會啟用「屬性」彈出式選單,同時每個屬性各自都有定義其速度的曲線。

屬性彈出式選單

只有未選取「全部屬性使用單一設定」核取方塊時,才會啟用這個選單。啟用選單後,程式會為選單中的五個屬性,分別維持各自的曲線。在選單中選取某一項屬性,會顯示該屬性的曲線。這些屬性為:

位置

針對動畫物件在舞台上的位置,指定自訂加/減速設定。

旋轉

針對動畫物件的旋轉,指定自訂加/減速設定。例如,您可以針對舞台上的動畫字元,微調它們面對使用者時的轉動速度。

縮放

針對動畫物件的縮放,指定自訂加/減速設定。例如,您可以更輕鬆地自訂物件的縮放,讓物件看起來像是先遠離檢視者,接著又逼近,然後再遠離。

顏色

針對套用至動畫物件的顏色轉場效果,指定自訂加/減速設定。

濾鏡

針對套用至動畫物件的濾鏡,指定自訂加/減速設定。例如,您可以控制投影的加/減速設定,以模擬光源方向的變動。

播放與停止按鈕

這些按鈕能讓您使用目前「自訂加/減速度」對話方塊中定義的所有速率曲線,預覽舞台上的動畫。

重設按鈕

讓您將速率曲線重設為預設狀態,也就是線性狀態。

選取的控制點位置

在對話方塊的右下角,會有一個數值,用來表示選取的控制點之關鍵影格及位置。如果沒有選取控制點,就不會看見任何數值。

若要在線段上新增控制點,請在對角線上按一下。若要精確地控制物件的移動,可以拖曳控制點的位置。

要使用影格指示器 (由方形控制點表示),按一下要物件加速或減速的地方。按一下控制點 (方形控制點) 上的控制點,便會選取該控制點,每一邊上也都會顯示正切點。空心圓表示正切點。您可以用滑鼠拖曳控制點或正切點,或使用鍵盤方向鍵來定位。

秘訣:根據預設,控制點會貼齊格線。您可以在拖曳控制點時按住 X 鍵,關閉貼齊功能。

在任何不含控制點的曲線區域上按一下,會在該曲線上增加一個新的控制點,而不會改變曲線的形狀。按一下離開該曲線與控制點,會取消選取目前已選取的控制點。

新增自訂加/減速

  1. 在「時間軸」中,選取已套用傳統補間動畫的圖層。

  2. 在影格的「屬性」檢測器中,按一下「加/減速」滑桿旁邊的「編輯」按鈕。
  3. (選擇性) 若要顯示單一補間屬性的曲線,請取消選取「全部屬性使用單一設定」,然後在選單中選取一種屬性。
  4. 若要新增控制點,按 Control + 按一下 (Windows) 或按 Command + 按一下 (Macintosh) 對角線。
  5. 若要增加物件的速度,請向上拖曳控制點;或向下拖曳以減緩物件的速度。
  6. 若要進一步調整加/減速曲線,並微調補間動畫的加/減速值,請拖曳頂點控制點。
  7. 若要檢視舞台上的動畫,請按一下左下角的播放按鈕。
  8. 調整控制項,直到您達到想要的效果為止。

註解:

如果您使用「自訂加/減速度」對話方塊,在影格上套用了自訂的加/減速功能,則顯示加/減速值的編輯文字方塊會顯示「--」。若是使用「編輯」文字方塊或彈出式滑動軸將加/減速值套用至影格,「自訂加/減速」圖表便會設定為相對應的曲線,並且選取「全部屬性使用單一設定」核取方塊。

複製並貼上加/減速曲線

  • 若要複製目前的加/減速曲線,按 Control + C 鍵 (Windows) 或 Command + C 鍵 (Macintosh)。

  • 若要將複製的曲線貼入其他加/減速曲線中,按 Control + V 鍵 (Windows) 或 Command + V 鍵 (Macintosh)。

    您可以複製並貼上加/減速曲線。複製的曲線隨時可供使用,直到您結束 Animate 應用程式為止。

不支援的加/減速曲線

不支援某些加/減速曲線類型。圖表中沒有任何部分可以代表非線性曲線 (如圓形)。

「自訂加/減速度」對話方塊會自動避免控制點或正切控制點,移動到可能產生無效曲線的位置:

  • 所有的點都必須位於圖表內,控制點無法移動到圖表邊界以外的地方。

  • 曲線的所有線段都必須位於圖表內,曲線的形狀會平面化,避免它延伸超出圖表邊界。

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策