使用 Animate CC 中的筆畫、填色和漸層

  1. Adobe Animate 使用手冊
  2. Animate 簡介
    1. Animate 的新功能
    2. 視覺詞彙
    3. Animate 系統需求
    4. Animate 鍵盤快速鍵
    5. 在 Animate 中使用多個檔案類型
  3. 動畫
    1. Animate 中的動畫基本概念
    2. 如何在 Animate 中使用影格及關鍵影格
    3. Animate 中的逐格動畫
    4. 如何在 Animate 中使用傳統補間動畫
    5. 筆刷工具
    6. 移動導引線
    7. 移動補間動畫與 ActionScript 3.0
    8. 關於移動補間動畫
    9. 移動補間動畫
    10. 建立移動補間動畫
    11. 使用屬性關鍵影格
    12. 使用補間動畫將位置製成動畫
    13. 如何使用移動編輯器編輯移動補間動畫
    14. 編輯補間動畫的移動路徑
    15. 操作移動補間動畫
    16. 新增自訂加/減速
    17. 建立和套用移動預設效果
    18. 設定動畫補間動畫範圍
    19. 使用儲存為 XML 檔案的移動補間動畫
    20. 移動補間動畫與傳統補間動畫
    21. 形狀補間動畫
    22. 在 Animate 中使用骨塊工具動畫
    23. 在 Animate 進行角色製作
    24. 如何在 Adobe Animate 中使用遮色片圖層
    25. 如何在 Animate 中使用場景
  4. 互動
    1. 如何使用 Animate 建立按鈕
    2. 將 Animate 專案轉換成其他文件類型格式
    3. 在 Animate 中建立及發佈 HTML5 Canvas 文件
    4. 在 Animate 中使用程式碼片段增加互動功能
    5. 建立自訂 HTML5 組件
    6. 在 HTML5 Canvas 中使用組件
    7. 建立自訂組件:範例
    8. 自訂組件的程式碼片段
    9. 最佳作法 - 使用 Animate 做廣告
    10. 虛擬實境編寫和發佈
  5. 工作區和工作流程
    1. 建立和管理繪圖筆刷
    2. 在 HTML5 Canvas 文件中使用 Google 字體
    3. 使用 Creative Cloud Libraries 和 Adobe Animate
    4. 使用 Animate 的舞台和工具面板
    5. Animate 工作流程和工作區
    6. 在 HTML5 Canvas 文件中使用網頁字體
    7. 時間軸與 ActionScript
    8. 使用多重時間軸
    9. 設定偏好設定
    10. 使用 Animate 編寫面板
    11. 使用 Animate 建立時間軸圖層
    12. 匯出適用於行動裝置應用程式和遊戲引擎的動畫
    13. 移動和複製物件
    14. 範本
    15. Animate 中的尋找和取代
    16. 還原、重做和操作記錄面板
    17. 鍵盤快速鍵
    18. 如何在 Animate 中使用時間軸
    19. 建立 HTML 擴充功能
    20. 影像和 GIF 動畫的最佳化選項
    21. 匯出影像和 GIF 的設定
    22. Animate 中的資源面板
  6. 多媒體和視訊
    1. 在 Animate 中變形及結合圖像物件
    2. 在 Animate 中建立並使用元件實體
    3. 影像描圖
    4. 如何在 Adobe Animate 中使用聲音
    5. 匯出 SVG 檔案
    6. 建立要在 Animate 中使用的視訊檔案
    7. 如何在 Animate 增加視訊
    8. 使用視訊提示點
    9. 使用 Animate 繪製及建立物件
    10. 調整線條和形狀
    11. 使用 Animate CC 中的筆畫、填色和漸層
    12. 使用 Adobe Premiere Pro 和 After Effects
    13. Animate CC 中的色彩面板
    14. 使用 Animate 開啟 Flash CS6 檔案
    15. 在 Animate 中使用傳統文字
    16. 將圖案放入 Animate 中
    17. Animate 中匯入的點陣圖
    18. 3D 圖像
    19. 在 Animate 中使用元件
    20. 使用 Adobe Animate 繪製線條和形狀
    21. 使用 Animate 中的元件庫
    22. 匯出聲音
    23. 在 Animate CC 中選取物件
    24. 在 Animate 中使用 Illustrator AI 檔案
    25. 使用噴刷工具套用圖樣
    26. 套用混合模式
    27. 排列物件
    28. 使用命令選單自動執行工作
    29. 多國語言文字
    30. 使用 Animate 中的攝影機
    31. 搭配使用 Animate 與 Adobe Scout
    32. 使用 Fireworks 檔案
    33. 圖像濾鏡
    34. 聲音和 ActionScript
    35. 繪圖偏好設定
    36. 使用鋼筆工具繪圖
  7. 平台
    1. 將 Animate 專案轉換成其他文件類型格式
    2. 自訂平台支援
    3. 在 Animate 中建立及發佈 HTML5 Canvas 文件
    4. 建立並發佈 WebGL 文件
    5. 如何封裝 AIR for iOS 的應用程式
    6. 發佈 AIR for Android 應用程式
    7. Adobe AIR for Desktop 的發佈功能
    8. ActionScript 發佈設定
    9. 最佳作法 - 在應用程式中組織 ActionScript
    10. 如何搭配使用 ActionScript 與 Animate
    11. 最佳作法 - 輔助功能原則
    12. Animate 工作區中的輔助功能
    13. 撰寫和管理指令碼
    14. 啟用自訂平台的支援
    15. 自訂平台支援概觀
    16. 建立輔助功能內容
    17. 使用自訂平台支援外掛程式
    18. ActionScript 3.0 的除錯
    19. 啟用自訂平台的支援
  8. 匯出與發佈
    1. 如何從 Animate CC 匯出檔案
    2. OAM 發佈
    3. 匯出 SVG 檔案
    4. 使用 Animate 匯出圖像和視訊
    5. 發佈 AS3 文件
    6. 匯出適用於行動裝置應用程式和遊戲引擎的動畫
    7. 匯出聲音
    8. 匯出 QuickTime 視訊檔
    9. 使用 ActionScript 控制外部視訊播放
    10. 最佳作法 - 建立行動裝置內容的秘訣
    11. 最佳作法 - 視訊慣例
    12. 最佳作法 - SWF 應用程式編寫原則
    13. 最佳作法 - 建構 FLA 檔
    14. 最佳化 Animate 的 FLA 檔案的最佳作法
    15. ActionScript 發佈設定
    16. 指定 Animate 的發佈設定
    17. 匯出放映檔
    18. 匯出影像和 GIF 動畫
    19. HTML 發佈範本
    20. 使用 Adobe Premiere Pro 和 After Effects
    21. 快速分享和發佈您的動畫

建立或編輯漸層填色

漸層是多重色彩的填色,會讓顏色漸漸改變成其他顏色。Animate CC (先前稱為 Flash Professional CC) 可讓您在漸層中套用多達 15 種顏色轉換。建立漸層是為一個或多個物件建立平順色彩漸層的好方法。您可以將漸層另存為色票,以方便將來為多個物件套用這個漸層。Animate 可以建立兩種漸層:

線性漸層是沿著單一方向軸 (垂直或水平) 來改變顏色。

放射狀漸層是從中央焦點開始向外改變顏色。您可以調整漸層的方向、顏色、焦點位置,以及許多其他的漸層屬性。

Animate CC 提供額外的線性及放射性漸層控制項,可與 Flash Player 搭配使用。這些控制項稱為溢出模式,可讓您指定將顏色套用到漸層以外的方式。

  1. 若要將漸層填色套用到現有的圖案上,請在舞台上選取一個或多個物件。

  2. 如果沒有看到「顏色」面板,請選取「視窗 > 顏色」。

  3. 若要選取一種顏色顯示模式,可以從面板選單選取 RGB (預設設定) 或 HSB。

  4. 從「類型」選單中選取漸層類型:

    線性

    會從開始點以直線向結束點方向延伸,建立逐漸變淡的漸層效果。

    放射狀

    產生從中央焦點以環形路徑向外呈現混和效果的漸層。

    注意:如果您是針對 Flash Player 8 或更新版本進行發佈,在選取線性或放射性漸層時,「顏色」面板還會提供其他兩個選項。第一個是出現在「類型」選單下的「溢出」選單。您可以使用「溢出」選單來控制套用至超出漸層範圍的顏色。第二個是漸層定義列,同時該列下方的指標也會指出漸層的顏色。

  5. (選擇性) 從「溢出」選單選取溢出模式來套用漸層:延伸 (預設模式)、反射或重複。

  6. (選用) 若要建立相容於 SVG (可縮放向量圖像) 的線性或放射性漸層,請選取「線性 RGB」核取方塊。在第一次套用漸層之後,當縮放為不同的尺寸時,這可使其看起來較為平順。

  7. 若要變更漸層中的顏色,請選取漸層定義列下方的顏色指標 (所選顏色指標上方的三角形將會變成黑色)。然後,在漸層列上方的顏色空間窗格中按一下。拖曳「亮度」滑動軸,調整該顏色的亮度。

  8. 若要在漸層中加入指標,請按一下漸層定義列或其下方。請依照上一個步驟中的敘述,為新的指標選取一種顏色。

    您可以加入最多 15 種顏色指標,建立最多具 15 種顏色轉換效果的漸層。

  9. 若要改變指標在漸層中的位置,請沿著漸層定義列拖曳指標。若要移除指標,請將指標向下拖曳,拖離漸層定義列。

  10. 若要儲存漸層,請按一下「顏色」面板右上角的三角形,然後在選單中選取「增加色票」。

    這個漸層就會加進目前文件的「色票」面板中。

  11. 若要變形漸層 (例如,製作垂直漸層而非水平漸層),請使用「漸層變形」工具。如需詳細資訊,請參閱變形漸層和點陣圖填色

調整筆畫和填色的顏色

您可以使用「工具」面板中的「筆畫顏色」和「填色顏色」控制項,或者使用「屬性」檢測器中的「筆畫顏色」和「填色顏色」控制項,指定圖像物件與形狀的筆畫和填色顏色。

「工具」面板中的「筆畫顏色」和「填色顏色」區域包含數個控制項,可以用來啟動「筆畫顏色」和「填色顏色」方塊,進而決定選擇的顏色是否會影響選定物件的筆畫或填色。此外,「顏色」區域也包含數個控制項,可以用來快速將顏色重設為預設設定、將筆畫和填色顏色設定設定為「無」,以及替換筆畫和填色顏色。

除了可以讓您為圖像物件或形狀選取筆畫和填色顏色以外,「屬性」檢測器也提供了用來指定筆畫寬度與樣式的控制項。

若要使用這些控制項來變更現有物件的繪製特質,必須先在「舞台」上選取這些物件。

請參閱:顏色的即時預覽

使用工具面板調整筆畫和填色的顏色

使用繪圖工具及填色工具所建立的新物件繪製特質可以透過「工具」面板的「筆畫顏色」和「填色顏色」控制項進行設定。若要使用這些控制項來變更現有物件的繪製特質,必須先在「舞台」上選取這些物件。

  • 按一下「筆畫顏色」或「填色顏色」控制項,並選取色票。

  • 按一下彈出式視窗中的「系統顏色挑選器」按鈕,然後選取某一顏色。您也可以將游標停留在不同顏色上,預覽形狀上的顏色效果。

  • 在方塊中輸入某一顏色的十六進位值。

  • 若要回復為預設的顏色設定 (白色填色及黑色筆畫),請按一下「工具」面板中的「黑白」按鈕。

  • 若要移除任何筆畫或填色,請按一下「無色」按鈕。

    注意:只有在建立橢圓形或矩形時,「無色」按鈕才會出現。您可以建立沒有筆畫或填色的物件,但不能在現有的物件上使用「無色」按鈕。您只能選取現有的筆畫或填色,然後刪除它。

  • 若要在填色及筆畫間替換顏色,請按一下「工具」面板中的「替換顏色」按鈕。

Animate CC 可讓您在從「色票」變更「筆畫」或「填色」顏色時,即時進行預覽。如需詳細資訊,請參閱顏色的即時預覽

使用屬性檢測器套用純色填色

  1. 在「舞台」上選取一個或多個關閉的物件。
  2. 選取「視窗 > 屬性」。
  3. 若要選取顏色,請按一下「填色顏色」控制項,然後執行下列其中一個步驟:

    • 從色盤中選取一個色票。
    • 在方塊中輸入某一顏色的十六進位值。

使用屬性檢測器選取筆畫的顏色、樣式和粗細

若要變更選取物件的筆畫顏色、樣式及寬度,可以使用「屬性」檢測器中的「筆畫顏色」控制項。針對筆畫樣式,請從與 Animate 一併預先載入的樣式中選取,或建立自訂的樣式。若要選取純色填色,請使用「屬性」檢測器中的「填色顏色」控制項。

  1. 在「舞台」上選取一個或多個物件 (如果是元件,請先按兩下進入元件編輯模式)。
  2. 選取「視窗 > 屬性」。
  3. 若要選取筆畫樣式,請按一下「樣式」選單,然後選取其中的選項。若要建立自訂樣式,請在「屬性」檢測器中選取「自訂」,然後在「筆畫樣式」對話方塊中選取選項,最後按一下「確定」。
    註解:

    選取純色以外的筆畫樣式會增加檔案大小。

  4. 若要選取筆畫粗細,請設定「筆畫」滑動軸,或者在文字方塊中輸入值。
  5. 若要啟用筆畫提示,請選取「筆畫提示」核取方塊。筆畫提示以所有像素來調整線和曲線錨點,避免產生模糊的垂直或水平的線。
  6. 若要設定路徑尾端的樣式,請選取「端點」選項:

    與路徑尾端齊平。

    圓角

    新增以筆畫一半的寬度在路徑之上延展的圓形端點.

    方形

    新增以筆畫一半的寬度在路徑之上延展的方形端點.

  7. (選用) 如果您使用「鉛筆」或「筆刷」工具並將繪製模式設定為「平滑化」來繪製線條,請使用「平滑化」滑桿來指定 Animate 將您繪製之線條平滑化的程度。

    「平滑化」值預設設定為 50,但您可指定 0 到 100 的值。平滑值越大,產生的線段會越平滑。

    註解:

    當繪圖模式設定為「直線化」或「墨水」時,「平滑化」滑動軸會停用。

  8. 若要定義兩個路徑線段會合的方式,請選取「接合」選項。若要變更在開放或封閉路徑內的轉角,請選取路徑和其他轉角選項。
    尖角、圓角和斜角接合。

  9. 若要避免「尖角」接合在一起,請輸入「尖角」限制。

    長度超過這個值的線條會直角轉彎而不是成為尖角。舉例來說,對於粗細為 3 的筆畫,「尖角」限制 2 表示當點的長度是筆畫粗細的兩倍時,Animate 便會移除該限制點。

    套用尖角限制.

調整多個線條或形狀的筆畫

若要更改筆畫的顏色、寬度,以及一個或多個線條的樣式或形狀的外框,請使用「墨水瓶」工具。線段或形狀的外框線只能套用純色,不能套用漸層或點陣圖。

使用「墨水瓶」工具可以更輕鬆地一次更改多個物件的筆畫特質,不需選取個別的線段。

  1. 在「工具」面板中選取「墨水瓶」工具。
  2. 選取筆畫顏色。
  3. 在「屬性」檢測器中選取筆畫樣式和筆畫高度。
  4. 若要套用筆畫修改,請按一下「舞台」上的物件。

複製筆畫和填色

您可以使用「滴管」工具複製某一物件中填色和筆畫特質,然後立刻將它們套用到另一個物件。「滴管」工具也可以讓您取樣點陣圖中的影像,當作填色使用。

  1. 若要將筆畫或填色區域的特質套用到其他筆畫或填色區域中,請選取「滴管」工具並按一下要套用其特質的筆畫或填色區域。

    當您按一下筆畫時,原本的工具會自動變成「墨水瓶」工具。當您按一下填色區域時,原本的工具會自動變成「油漆桶」工具,並會開啟「鎖定填色」修改選項。

  2. 按一下另一個筆畫或填色區域,套用新的特質。

使用油漆桶工具修改已繪製的區域

「油漆桶」工具可將顏色填滿封閉區域。此工具可讓您執行下列動作:

  • 填滿空白區域及變更已塗滿之區域的顏色。

  • 使用純色、漸層填色和點陣圖填色繪圖。

  • 使用「油漆桶」工具填滿未全部封閉的區域。

  • 使用「油漆桶」工具時,讓 Animate 關閉形狀外框的空隙。

  1. 在「工具」面板中選取「油漆桶」工具。
  2. 選取填色顏色及樣式。
  3. 按一下「工具」面板底部的「空隙大小」修改選項,然後選取一個空隙大小選項:
    • 「不封閉空隙」:您必須在填滿形狀前,手動封閉空隙。繪圖很複雜的時候,手動封閉空隙的速度可能比較快。
    • 選取其中一種「封閉」選項,讓 Animate 將有空隙的形狀填滿顏色。
    註解:

    如果空隙太大,就需要手動封閉。

  4. 按一下形狀或封閉區域來填滿顏色。

油漆桶工具選項

您可以使用「油漆桶」工具來按一下並拖曳物件的輪廓,以填滿所選的顏色。在輪廓中以任何方向按一下並拖曳工具。「油漆桶」工具會在輪廓中擷取到的點填滿顏色。

油漆桶屬性
油漆桶屬性

當您選取「填滿所有區域」核取方塊時,選取範圍的所有區域會在拖曳時填滿顏色。

預設未核取「填滿所有區域」選項。在這個模式中,「油漆桶」工具只會填滿特定顏色。

未選取「填滿所有區域」時 (預設)

  • 在這個模式中,當使用者使用油漆桶按一下滑鼠時,您可以注意到顏色被取代。在這個情況中,讓我們試想現在以紅色取代綠色。
  • 隨著使用者在圖案內拖曳,這個選項只會取代填滿那個綠色的輪廓。
  • 如果使用者在空白的封閉輪廓內拖曳,則會填滿紅色。
  • 當按下滑鼠時,如果底層輪廓是空白的,則這個選項會在使用者拖曳油漆桶工具時填滿空白輪廓。

選取「填滿所有區域」時

所有區域都會填滿選取的顏色。以上述插圖為例,則是紅色。

變形漸層和點陣圖填色

您可以調整填色的大小、方向或中心點,變形漸層或點陣圖填色。

  1. 從「工具」面板選取「漸層變形」工具 。如果「工具」面板中未出現「漸層變形」工具,請按住「自由變形」工具,再從出現的選單中選取「漸層變形」工具。
  2. 按一下使用了「漸層填色」或「點陣圖填色」填滿顏色的區域。具有編輯控制點的範圍框便會出現。當游標位於任何一個控制點上方時,游標的外觀會產生變化,指出控制點的功能。

    中心點

    中心控制點的滑鼠變換圖示為四向箭頭。

    焦點

    只有當您選取放射狀漸層時,才會顯示焦點控制點。焦點控制點的滑鼠指向效果圖示為倒三角形。

    大小

    大小控制點的滑鼠指向效果圖示 (範圍框邊緣的中間控制點圖示) 會是裡面有箭號的圓形。

    旋轉

    可調整漸層的旋轉。旋轉控制點的滑鼠指向效果圖示 (範圍框邊緣的底部控制點圖示) 是形成一個圓的四個箭頭。

    寬度

    可調整漸層的寬度。寬度控制點的滑鼠指向效果圖示 (方形控制點) 是個雙向箭頭。

    按住 Shift 鍵,將線性漸層填色的方向限制為 45° 的倍數。

    放射性漸層控制項

    A. 中心點 B. 寬度 C. 旋轉 D. 大小 E. 焦點. 

  3. 使用下面的任何一種方法,調整漸層或填色的形狀:
    • 若要改變漸層填色或點陣圖填色的中心點位置,請拖曳中心點。

    • 若要更改漸層填色或點陣圖填色的寬度,請拖曳範圍框側邊的方形控制點 (這個選項只會調整填色的大小,不影響包含填色的物件)。

    • 若要更改漸層填色或點陣圖填色的高度,拖曳範圍框底部的方形控制點。

    • 若要旋轉漸層填色或點陣圖填色,拖曳角落上的圓形旋轉控制點。您也可以拖曳圓形漸層或填色範圍圓形內,最低的控制點。

    • 若要縮放線性漸層或填色,拖曳範圍框正中央的方形控制點。

    • 若要變更圓形漸層的焦點,請拖曳範圍圓形內的中間圓形控制點。

    • 若要斜切或傾斜形狀中的填色,拖曳範圍框頂端或右側的圓形控制點。

    • 若要在形狀內並排顯示點陣圖,請縮放填色範圍。

    註解:

    當您在處理大型填色或靠近舞台邊緣的填色時,如果想看到所有控制點,請選取「檢視 > 貼上板」。

鎖定漸層或點陣圖替舞台填色

您可以將某個漸層填色或點陣圖填色鎖定起來,讓填色看起來似乎延展到整個舞台上,而使用該填色繪製的遮色片物件則似乎可以透出下方的漸層或點陣圖。

當您使用「筆刷」或「油漆桶」工具來選取「鎖定填色」修改選項,並使用該工具進行繪圖時,點陣圖填色或漸層填色會延展到您在舞台上繪製的物件。

使用「鎖定填色」修改選項,可以製造出將單一漸層填色或單一點陣圖填色套用至舞台上的個別物件的效果。

使用鎖定的漸層填色

  1. 選取「筆刷」或「油漆桶」工具,然後選取漸層或點陣圖,做為填色。
  2. 在「顏色」面板的「類型」選單中,選取「線性」或「放射性」。
  3. 按一下「鎖定填色」修改選項 
  4. 請先繪製您要放置填色中心的區域,然後再移動到其他區域。

使用鎖定的點陣圖填色

  1. 選取要使用的點陣圖。
  2. 在「顏色」面板的「類型」選單中,選取「點陣圖」。
  3. 選取「筆刷」或「油漆桶」工具。
  4. 按一下「鎖定填色」修改選項 
  5. 請先繪製您要放置填色中心的區域,然後再移動到其他區域。
Adobe 標誌

登入您的帳戶