如何在 PlantUML 中應用主題

應用一個 PlantUML 主題是將純文字程式碼快速轉換為精緻專業的軟體文件的最佳方式。預設情況下,標準的 PlantUML 圖表使用基本的灰色形狀和簡單的線條。應用主題讓您能立即透過預先設計的色彩方案和版面配置,轉換整個圖表的整體視覺風格,而無需撰寫自訂樣式程式碼。

第一部分:PlantUML 主題的工作原理(一般指南)

理解標準語法

在標準的 PlantUML 中,您可使用 !theme 指令來自訂圖表樣式。您應將這一行放置在程式碼片段的上方附近,緊接在 @startuml.

程式碼片段

Diagram using Cerulean theme
使用 Cerulean 主題的圖表
Diagram using Hacker theme
使用 Hacker 主題的圖表

在任何編輯器中使用主題的關鍵技巧

  1. 內建主題:PlantUML內建了一套內建樣式,例如materia, cerulean,以及crt-amber.

  2. 外部主題程式庫:您可以使用以下指令,從GitHub或本機伺服器載入自訂主題!theme <主題名稱> from <url>指令。

    PlantUML code snippet showing !theme cerulean directive applied after @startuml

  3. 全域一致性:不必為每個類別或元件逐一加入內嵌CSS樣式,套用主題即可一次設定統一的視覺風格所有元素的視覺風格。

第二部分:簡單方法——在VPasCode中套用主題

雖然手動語法運作良好,但記住正確的主題名稱或處理語法錯誤可能會拖慢您的工作流程。使用像VPasCode這樣的現代文字轉圖表編輯器可完全簡化此過程。

1. 視覺主題選擇功能表

Select Theme in VPasCode to apply different themes.
在VPasCode中選擇主題以套用不同主題。
Materia theme Selected in VPasCode.
在VPasCode中已選擇Materia主題。

停止在文件中搜尋主題名稱。內建的主題下拉功能表會直接在您的編輯器工具列中顯示精心挑選的流行樣式清單。

2. 自動程式碼注入

選擇樣式時,會自動加入正確的!theme 將此行插入您的 PlantUML 程式碼中。您不需要記住精確的指令格式,也不需手動輸入程式碼區塊。

3. 即時即時預覽

Live preview right when you select a theme.
選擇主題後立即預覽效果。

即時預覽您的視覺變更。在淺色、深色、復古或現代風格之間切換,以立即查看您的圖表在最終定稿文件前的呈現效果。

4. 獨家自訂主題

Visual Paradigm theme being uses in VPasCode
Visual Paradigm 主題在 VPasCode 中的使用
Rose theme being uses in VPasCode
Rose 主題在 VPasCode 中的使用

存取獨特選項,例如 visual-paradigm 主題(具有乾淨、現代的藍色標題)以及 rose 主題(呈現 IBM Rational Rose 的經典黃紅配色)。

探索新主題功能:

• 閱讀我們的 New PlantUML 主題選擇介面

• 了解更多關於 Visual Paradigm 與 Rose 自訂主題

結論

無論您是手動編輯程式碼,還是使用互動式編輯器,使用 PlantUML 主題都能在數秒內建立清晰且專業的文件。

立即嘗試在 VPasCode 編輯器中測試您的程式碼,今日即體驗快速、下拉式主題樣式。

返回頂端