使用鋼筆工具繪圖

  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 中的「鋼筆」工具:

鋼筆工具繪製狀態

「鋼筆」工具會顯示不同的指標,以反應它目前的繪製狀態。各種不同繪製狀態會以下列指標表示:

初始錨點指標

選取「鋼筆」工具時第一個出現的指標。表示滑鼠在「舞台」上的下一個按鍵動作會建立一個初始錨點,也是新路徑的開頭 (所有新路徑都是以初始錨點當做開頭)。任何現有的繪圖路徑都會被終止。

連續錨點指標

表示滑鼠在「舞台」上的下一個按鍵動作會建立一個錨點和一條將它連接到上一個錨點的線段。在路徑上建立所有使用者定義的錨點 (初始錨點除外) 時,都會顯示這個指標。

增加錨點指標

表示滑鼠的下一個按鍵動作會在現有路徑上增加一個錨點。若要增加錨點,必須先選取路徑,而且「鋼筆」工具不可置於現有錨點上。現有的路徑會依據增加的錨點重新繪製。一次只能加入一個錨點。

刪除錨點指標

表示滑鼠在現有路徑上的下一個按鍵動作會移除一個錨點。若要移除錨點,必須先用「選取」工具選取路徑,而且指標必須置於現有錨點上。現有的路徑會依據錨點的移除重新繪製。一次只能移除一個錨點。

連續路徑指標

從現有的錨點延伸新路徑。如果要啟用這個指標,滑鼠必須置於路徑上的現有錨點上,而且您目前並未在繪製路徑,這個指標才會出現。這個錨點不必是路徑的其中一個終端錨點;任何錨點都可以是連續路徑的位置。

封閉路徑指標

在路徑的起點上封閉您正在繪製的路徑。您只能封閉目前正在繪製的路徑,而且現有的錨點必須是同一路徑的起始錨點。產生的路徑不會對此封閉形狀套用任何指定的填色設定;請另外套用填色。

結合路徑指標

類似於「封閉路徑工具」,唯一不同的是,滑鼠不可置於同一路徑的初始錨點上。這個指標必須置於某個唯一路徑的其中一個端點上。不一定能夠選取此線段。

注意:結合路徑不一定會產生封閉的形狀。

捲收貝茲控制點指標

當滑鼠置於已顯示貝茲控制點的錨點上時,就會出現這個指標。按下滑鼠便會捲收貝茲控制點,並且使跨越此錨點的彎曲路徑回復成直線線段。

轉換錨點指標

將無方向線的轉折點轉換成有獨立方向線的轉折點。若要啟用「轉換錨點」指標,請使用 Shift+C 輔助按鍵切換「鋼筆」工具。

如需關於「鋼筆」工具的視訊教學課程,請參閱 www.adobe.com/go/vid0120_tw

使用鋼筆工具繪製直線

使用「筆型」工具所能繪製的最簡單路徑就是一條直線,只要按一下「筆型」工具,建立兩個錨點,即可完成。繼續按滑鼠即可建立由多個轉折點連接之直線線段所構成的路徑。

  1. 選取「鋼筆」工具。
  2. 將「鋼筆」工具置於直線線段開始的位置,然後按一下滑鼠,定義第一個錨點。如果出現方向線,表示您無意間拖曳了「鋼筆」工具。請選擇「編輯 > 還原」,然後再按一次滑鼠。
    註解:

    第一個線段必須等到您按滑鼠建立第二個錨點時才會出現 (除非您已在「偏好設定」對話方塊的「繪圖」類別中指定了「顯示鋼筆預覽」)。

  3. 在您要結束線段的位置再按一次滑鼠 (按住 Shift 同時按一下滑鼠,可將線段的角度限制為 45 度的倍數)。
  4. 繼續按滑鼠可設定其他直線線段的錨點。
    按一下「筆型」工具可建立直線區段。

  5. 若要將路徑繪製成開放或封閉的形狀,請執行下列其中一項:
    • 若要完成開放路徑,請在最後一點上按兩下,然後按一下「工具」面板中的「鋼筆」工具,或是 Control+按一下 (Windows) 或 Command+按一下 (Macintosh) 路徑之外的任何地方。

    • 若要封閉路徑,請將「鋼筆」工具放置在第一個 (空心) 錨點上。若「鋼筆」 工具的位置正確,該工具的指標旁會出現一個小圓圈。按一下或開始拖曳,以封閉路徑。

    • 若要完成現有的形狀,選取「編輯 > 取消全選」,或是在「工具」面板中選取另一個工具。

使用鋼筆工具繪製曲線

若要建立曲線,請在曲線改變方向的地方增加錨點,然後拖曳控制曲線形狀的方向線。方向線的長度和斜度會決定曲線的形狀。

若您儘可能地使用較少的錨點來繪製曲線,則其會較容易編輯,且您的系統也能較快地顯示或列印這類曲線。使用太多的控制點,也會在曲線中產生不必要的隆起部份。反而應該是繪製間隔更大的錨點,然後練習調整方向控制把手的長度和角度,以形成所需的曲線。

  1. 選取「鋼筆」工具。
  2. 將「鋼筆」工具置於曲線開始的位置,然後按住滑鼠按鍵。

    這時會出現第一個錨點,「鋼筆」工具也會變成箭頭符號 (在 Photoshop 中,在您開始拖曳後才會改變指標)。

  3. 用拖曳方式針對您要建立的曲線線段設定斜度,然後放開滑鼠按鍵。

    一般而言,可將方向線延伸到距離您要繪製的下一個錨點大約三分之一的長度 (您可以在稍後調整方向線的一邊,或同時調整兩邊)。

    按住 Shift 鍵可將此工具限制為 45 度的倍數。

    繪製曲線的第一個點

    A. 定位「鋼筆」工具 B. 開始拖曳 (按住滑鼠按鍵) C. 以拖曳方式延伸方向線. 

  4. 將「鋼筆」工具置於曲線線段的結束位置,然後執行下列其中一項:
    • 若要建立 C 形曲線,請朝上一個方向線的反方向拖曳,然後放開滑鼠按鍵。

    繪製曲線上的第二個點

    • 若要建立 S 形曲線,請朝上一個方向線的同方向拖曳,然後放開滑鼠按鍵。

    繪製 S 形曲線

  5. 若要建立一系列的平滑曲線,請從不同位置繼續拖曳「鋼筆」工具。將錨點置於每一曲線的開頭和結束位置,而不是置於曲線的頂端。
    註解:

    如果要中斷錨點的方向線,請按住 Alt 鍵 (Windows) 或 Option 鍵 (Macintosh),並拖曳方向線。

  6. 若要完成這個路徑,請執行下列其中一項:
    • 若要封閉路徑,請將「鋼筆」工具放置在第一個 (空心) 錨點上。如果位置正確,「鋼筆」工具指標 旁邊會出現一個小圈。按一下或開始拖曳,以封閉路徑。

    • 若要讓路徑保持開放,請按住 Ctrl 鍵 (Windows) 或 Command 鍵 (Macintosh),再按一下所有物件以外的任何地方,並選取另一個工具,或選擇「編輯 > 取消全選」。

增加或刪除錨點

增加錨點可以更精確地控制路徑,也可以延伸開放的路徑; 但是,請不要增加太多不必要的點。錨點較少的路徑會比較容易編輯、顯示和列印。若要降低路徑的複雜性,請刪除一些不必要的點。

工具列包含三種工具可用來新增或刪除錨點:「筆型」工具 、「增加錨點」工具 ,以及「刪除錨點」工具

根據預設,如果將「鋼筆」工具置於選取的路徑上,它就會變成「增加錨點」工具;將它置於某一錨點上,則會變成「刪除錨點」工具。

註解:

請勿使用 Delete、Backspace 和 Clear 鍵或是「編輯 > 剪下」或「編輯 > 清除」命令來刪除錨點;這些按鍵和命令會刪除連接到該點的錨點和線段。

  1. 選取要修改的路徑。
  2. 在「鋼筆」工具 上按住滑鼠鈕,然後選取「鋼筆」工具 、「增加錨點」工具 或「刪除錨點」工具
  3. 若要增加錨點,請將指標置於路徑線段上,然後按一下滑鼠按鍵。若要刪除錨點,請將指標置於錨點上,然後按一下滑鼠按鍵。

調整路徑上的錨點

使用「鋼筆」工具繪製曲線時,您會建立一些平滑點,也就是在連續曲線路徑上的錨點。繪製直線線段或連接到曲線線段的直線時,您會建立一些轉折點,也就是位於直線路徑上或位於直線與曲線路徑接合處的錨點。

在預設情況下,選取的平滑點會顯示成空心圓,而選取的轉折點則會顯示成空心方形。

將方向點拖離轉折點可建立平滑點。

移動或新增錨點

  • 若要移動錨點,請用「選取細部」工具 拖曳這個點。

  • 若要輕推錨點,請用「選取細部」工具選取相關的點,然後使用方向鍵加以移動。按住 Shift 並同時按一下滑鼠,可以選取多個點。

  • 若要增加錨點,請用「鋼筆」工具按一下線段。如果選取的線段上可以增加錨點,「鋼筆」工具 旁邊就會出現一個加號 (+)。如果尚未選取此線段,請用「鋼筆」工具選取它,然後增加錨點。

刪除錨點

刪除曲線路徑上多餘的錨點,將曲線最佳化並減少產生的 SWF 檔大小。

  • 若要刪除轉折點,請使用「鋼筆」工具按一下該點。如果可以從選取的線段中刪除錨點,「鋼筆」工具旁邊就會出現一個減號 (-)。如果尚未選取此線段,請用「鋼筆」工具選取它,然後刪除此錨點。

  • 若要刪除平滑點,請使用「鋼筆」工具按一下該點。如果可以從選取的線段中刪除錨點,「鋼筆」工具旁邊就會出現一個減號 (-)。如果尚未選取此線段,請用「鋼筆」工具選取它,然後刪除此轉折點 (按一下會將該點轉換成轉折點,再按一下就會刪除這個點)。

將線段轉換成直線或曲線

若要將線段上的某些部分從直線線段轉換成曲線線段,請將轉折點轉換成平滑點 (反之亦然)。

  • 若要將轉折點轉換成平滑點,請使用「選取細部」工具選取該點,然後按住 Alt 鍵 (Windows) 或 Option 鍵 (Macintosh) 同時拖曳該點,即可放置正切控制點。

  • 若要將平滑點轉換成轉折點,請使用「鋼筆」工具按一下該點。指標 旁邊出現 ^ 符號時,表示它是位於平滑點上。

調整線段

若要更改線段的角度或長度,或是調整曲線線段來更改曲線的斜度或方向,請調整直線線段。

移動平滑點上的正切控制點時,會對該平滑點兩邊的曲線進行調整。移動轉折點上的正切控制點時,只會針對與正切控制點位於同一邊的曲線進行調整。

  • 若要調整直線線段,請選取「選取細部」工具 ,然後選取直線線段。使用「選取細部」工具,將線段上的錨點拖曳到新位置。

  • 若要調整曲線線段,請選取「選取細部」工具,然後拖曳該線段。

    注意:當您按一下路徑時,Animate 便會顯示錨點。使用「選取細部」工具調整線段時,可能會在路徑上增加錨點。

  • 若要調整曲線上的錨點或正切控制點,請選取「選取細部」工具,然後選取曲線線段上的錨點。

  • 若要調整錨點兩邊的曲線形狀,請拖曳錨點或正切控制點。若要將曲線限制為 45 度的倍數。請按住 Shift 拖曳。若要個別拖曳正切控制點,請按住 Alt 鍵 (Windows) 或 Option 鍵 (Macintosh) 同時拖曳。

 

拖曳錨點,或拖曳方向點。

鋼筆工具偏好設定

指定下列偏好設定:「鋼筆」工具指標的外觀、繪圖時預覽線段,以及選定錨點的外觀。選取的線段和錨點會使用這些線段和點所在圖層的外框顏色。

  1. 選取「鋼筆」工具 ,然後選取「編輯 > 偏好設定」(Windows) 或「Animate > 偏好設定」(Macintosh)。

  2. 在「類別」清單中,選取「繪圖」。
  3. 設定「鋼筆」工具的下列選項:

    顯示鋼筆預覽

    繪製線段時可同時預覽線段。當您在「舞台」周圍移動指標 (尚未按下滑鼠來建立線段端點) 時,會出現線段的預覽。如果不選取這個選項,則必須等到建立端點後,才會出現線段。

    顯示實心點

    將選取的錨點顯示成空心點,並將未選取的錨點顯示成實心點。若不選取這個選項,選取的錨點會顯示成實心點,而未選取的錨點會顯示成空心點。

    顯示精確游標

    指定「鋼筆」工具指標顯示成十字準線指標,而不是預設的「鋼筆」工具圖示,以便更精確地放置線段。若要顯示「鋼筆」工具的預設「鋼筆」工具圖示,請取消選取這個選項。

    注意:若要在十字準線指標與預設「鋼筆」工具圖示之間切換,請按 Caps Lock 鍵。

  4. 按一下「確定」。
Adobe 標誌

登入您的帳戶