UX 準則
這些準則涵蓋了建立能與 VS Code 原生介面和模式無縫整合的擴充功能的最佳實務。在這些準則中，您可以找到
- VS Code 整體 UI 架構和元素的概要
- 擴充功能貢獻的 UI 建議和範例
- 相關指南和範例的連結
在深入細節之前，務必先了解 VS Code 各個架構 UI 部分如何組合在一起，以及您的擴充功能可以在何處貢獻。
容器
VS Code 介面大致可以分為兩個主要概念：容器和項目。一般來說，容器可以被認為是 VS Code 介面中較大的區塊，用於呈現一個或多個項目
活動列
活動列是 VS Code 中的核心導覽介面。擴充功能可以將項目貢獻到活動列，作為 檢視容器，在主要側邊欄中呈現 檢視。
主要側邊欄
主要側邊欄呈現一個或多個 檢視。活動列和主要側邊欄緊密耦合。點擊貢獻的活動列項目（即：檢視容器）會開啟主要側邊欄，其中將呈現與該檢視容器關聯的一個或多個檢視。一個具體的例子是檔案總管。點擊檔案總管項目將開啟主要側邊欄，其中可見資料夾、時間軸和大綱檢視。
次要側邊欄
次要側邊欄也作為呈現包含檢視的檢視容器的介面。使用者可以將終端機或問題檢視等檢視拖曳到次要側邊欄，以自訂其版面配置。
編輯器
編輯器區域包含一個或多個編輯器群組。擴充功能可以貢獻 自訂編輯器 或 Webview 以在編輯器區域中開啟。它們也可以貢獻 編輯器動作，以在編輯器工具列中公開其他圖示按鈕。
面板
面板是另一個用於公開檢視容器的區域。預設情況下，終端機、問題和輸出等檢視可以在面板中的單一索引標籤中一次檢視。使用者也可以像在編輯器中一樣，將檢視拖曳到分割版面配置中。此外，擴充功能可以選擇將檢視容器專門新增到面板，而不是活動列/主要側邊欄。
狀態列
狀態列提供關於工作區和目前活動檔案的上下文資訊。它呈現兩組 狀態列項目。
項目
擴充功能可以將項目新增到上面列出的各種容器。
檢視
檢視可以以 樹狀檢視、歡迎檢視 或 Webview 檢視 的形式貢獻，並且可以拖曳到介面的其他區域。
檢視工具列
擴充功能可以公開檢視特定的 動作，這些動作會顯示為檢視工具列上的按鈕。
側邊欄工具列
範圍限定於整個檢視容器的動作也可以在 側邊欄工具列 中公開。
編輯器工具列
擴充功能可以直接在編輯器工具列中貢獻範圍限定於編輯器的 編輯器動作。
面板工具列
面板工具列可以公開範圍限定於目前所選檢視的選項。例如，終端機檢視公開了新增終端機、分割檢視版面配置等動作。切換到問題檢視會公開一組不同的動作。
狀態列項目
在左側，狀態列項目的範圍限定於整個工作區。在右側，項目的範圍限定於活動檔案。
常見 UI 元素
命令面板
擴充功能可以貢獻出現在 命令面板 中的命令，以快速執行某些功能。
快速選擇
快速選擇以幾種不同的方式擷取使用者的輸入。它們可以要求單一選擇、多重選擇，甚至自由格式文字輸入。
通知
通知用於向使用者傳達資訊、警告和錯誤訊息。它們也可以用於指示進度。
Webview
Webview 可以用於顯示自訂內容和功能，以用於超出 VS Code「原生」API 範圍的使用案例。
內容選單
與命令面板的一致位置相反，內容選單讓使用者能夠從特定位置執行動作或設定某些內容。
導覽
導覽為透過包含豐富內容的多步驟檢查清單將使用者引導至擴充功能提供一致的體驗。
設定
設定讓使用者能夠設定與擴充功能相關的選項。
