WPF 設計工具概觀

更新：2007 年 11 月

本主題將說明 Windows Presentation Foundation (WPF) Designer for Visual Studio。WPF 是 Windows Vista 的使用者介面技術，與先前的檢視技術 (如 Windows Form) 不同。

WPF 設計工具提供類似於 Windows Form 設計工具的視覺化設計支援。您可以從 [工具箱] 拖曳控制項並在 [屬性] 視窗中設定屬性，藉此建立應用程式的使用者介面。您也可以在 XAML 編輯器中直接編輯 XAML。

WPF 設計工具視窗

WPF 設計工具有幾個視窗可供顯示和編輯 XAML 文件。下圖顯示 WPF 設計工具中的部分視窗。

設計檢視

[設計] 檢視提供視覺化設計介面來建置 WPF 控制項和應用程式，而且會顯示目前在 [XAML] 檢視中的 XAML 的呈現表示。

您可以從 [工具箱] 拖曳控制項到設計介面上，也可以藉由拖曳來擺放控制項的位置。有幾項設計輔助工具可協助您將控制項放在所需的位置上。當您在設計介面上變更控制項時，[XAML] 檢視會更新來反映變更。如需詳細資訊，請參閱 HOW TO：將控制項加入至 WPF 視窗和 HOW TO：在設計介面上選取並移動項目。

XAML 檢視

[XAML] 檢視提供編輯 XAML 文件的完整功能，包括 IntelliSense、自動格式化、語法反白顯示和標記巡覽。當您編輯 XAML 時，[設計] 檢視會更新來反映變更。

如需詳細資訊，請參閱逐步解說：在 WPF 設計工具中編輯 XAML。

屬性視窗

您可以使用 [屬性] 視窗，針對 [設計] 檢視中的控制項設定屬性值。

存取 [屬性] 視窗的方法是開啟 [檢視] 功能表，然後選取 [屬性視窗]，或是按 CTRL+W、P 或 F4。您也能以滑鼠右鍵按一下 [設計] 檢視中的控制項，然後選取快速鍵功能表上的 [屬性]。[屬性] 視窗會顯示目前所選控制項的縮圖預覽。

若要搜尋屬性，請先在 [屬性] 視窗頂端的 [搜尋] 方塊中輸入屬性的名稱。在您輸入文字時，[屬性] 視窗中便會顯示符合搜尋的屬性。按一下 [清除] 即可移除搜尋，並顯示選取之物件的所有屬性。

從 Visual Studio 2008 Service Pack 1 開始，您可以按字母順序或依分類排序屬性。若要按字母順序排序屬性，請按一下 [屬性] 視窗頂端的 [字母順序] 按鈕。若要依分類排序屬性，請按一下 [屬性] 視窗頂端的 [分類] 按鈕。

文件大綱視窗

[文件大綱] 視窗提供 XAML 文件的階層式檢視。您可以使用 [文件大綱] 視窗來預覽、選取或刪除 XAML 項目。要存取 [文件大綱] 視窗，請開啟 [檢視] 功能表，指向 [其他視窗]，然後選取 [文件大綱]，或按 CTRL+ALT+T。如需詳細資訊，請參閱巡覽 WPF 文件的項目階層架構。

工具箱

[工具箱] 存放有可拖曳到設計介面的控制項。要存取 [工具箱] 視窗，請開啟 [檢視] 功能表，然後選取 [工具箱]，或按 CTRL+ALT+X。

設計檢視功能

[設計] 檢視提供許多功能，可用來排列 WPF 應用程式視窗或頁面中的控制項。下圖顯示 [設計] 檢視的部分功能。

縮放控制

使用 [縮放控制] 可控制設計介面的大小。您可以從 [10%] 縮放到 [20x]。

最適檢視

使用 [最適檢視] 按鈕可將設計介面的大小調整為 [設計] 檢視中的可用螢幕大小，這個功能適用於過度縮放大小時。

方格滑軌

使用方格滑軌可管理 Grid 控制項中的資料列和資料行。您可以建立和刪除資料行和資料列，以及調整其相對寬度和高度。如需詳細資訊，請參閱 HOW TO：在方格中加入資料列和資料行。

格線

使用格線可控制 Grid 資料行和資料列的寬度和高度。您可以按一下 Grid 上面和左側的滑軌，以加入新的資料行或資料列。如需詳細資訊，請參閱 HOW TO：在方格中加入資料列和資料行。

格線指示區

格線指示區會以三角形出現在方格滑軌中。當您拖曳格線指示區或格線本身，相鄰資料行或資料列的寬度或高度就會隨著滑鼠移動更新。如需詳細資訊，請參閱 HOW TO：在方格中加入資料列和資料行。

移動控點

移動控點會出現在所選面板控制項的左上角。按一下移動控點，然後將控制項拖曳到設計介面上所需的位置。如需詳細資訊，請參閱 HOW TO：在設計介面上選取並移動項目。

調整大小控點

調整大小控點會出現在選取的控制項上。按一下並拖曳調整大小控點可變更所選項目的大小。當您調整控制項的大小時，通常會出現寬度和高度值，以協助精確調整控制項的大小。

邊界線

邊界代表控制項邊緣及其容器邊緣之間的固定空間量。按一下控制項的邊界線可設定其邊界。如需詳細資訊，請參閱 HOW TO：在 WPF 設計工具中設定控制項的邊界。

邊界 Stub

當所選控制項的邊界設為 0 時，其上會出現邊界 Stub。按一下邊界 Stub 可設定邊界與容器對應邊緣的距離。如需詳細資訊，請參閱 HOW TO：在 WPF 設計工具中設定控制項的邊界。

對齊線

使用對齊線可對齊控制項彼此。如果啟用對齊線，當您將控制項拖曳到其他控制項的相對位置，而部分控制項的邊緣和文字水平或垂直對齊時，對齊線就會出現。如需詳細資訊，請參閱 HOW TO：同時對齊文字基線和邊界。

XAML 檢視功能

Extensible Application Markup Language (XAML) 提供宣告式的 XML 架構詞彙來指定應用程式的使用者介面。WPF 設計工具提供獨特的分割檢視，其中包含 [XAML] 檢視和同步處理的 [設計] 檢視來顯示應用程式的呈現 XAML 標記。下圖顯示部分 XAML 功能。

如需詳細資訊，請參閱分割檢視：同時檢視 WPF 設計介面和 XAML。

分割檢視列

使用分割檢視列可控制 [設計] 檢視和 [XAML] 檢視的相對大小。您可以將分割檢視設成水平或垂直，而且可以摺疊任一檢視。如需詳細資訊，請參閱分割檢視：同時檢視 WPF 設計介面和 XAML。

標記導覽

您可以使用標記導覽，移至 [XAML] 檢視中目前所選標記的父標記。當您停留在標記導覽中的標記時，會顯示該項目的縮圖預覽。逐步解說：在 WPF 設計工具中編輯 XAML.

建置豐富、互動式的使用者介面

在 WPF 中，Window 和 Page 類別是您向使用者顯示資訊的視覺化介面。建置 WPF 應用程式的方式一般是在 Window 加入控制項，並建立對按一下滑鼠或按鍵盤等使用者動作的回應。「控制項」是一種獨立的使用者介面 (UI) 元素，可以顯示資料或接受輸入的資料。

當使用者對 Window 或其中一個控制項進行某個動作時，那個動作就會產生事件。應用程式會回應這些事件，並在事件發生時加以處理。如需詳細資訊，請參閱 HOW TO：建立簡單的事件處理常式。

WPF 包含各式各樣可以加入至視窗的控制項，例如會顯示文字方塊、按鈕、下拉式清單、選項按鈕，甚至是 Web 網頁的控制項。如需可以在視窗中使用之所有控制項的清單，請參閱控制項程式庫。如果現有控制項不符合您的需要，WPF 也支援您使用 UserControl 和 Control 類別建立自訂控制項。

使用拖放式 WPF 設計工具，您就可以輕鬆建立 WPF 應用程式。只要用滑鼠指標選取控制項，然後將控制項加入至視窗中的所需位置即可。這個設計工具提供對齊線和連續縮放等工具，使排列控制項更容易。

最後，如果您要建立個人自訂 UI 項目，System.Windows.Media 和 System.Windows.Shapes 命名空間 (Namespace) 中有大量類別可以直接在視窗中呈現線條、圓圈和其他形狀。

有關建立視窗和控制項的說明

如需如何使用這些功能的逐步資訊，請參閱下列說明主題。

透過 Expression Blend 共同作業

WPF 將內容與展示的部分完全分開處理，可讓軟體開發人員和圖形設計人員合作開發應用程式的外觀和行為。Windows Presentation Foundation (WPF) Designer for Visual Studio 專為軟體開發人員最佳化，而 Expression Blend 則專為圖形設計人員最佳化。如需詳細資訊，請參閱與 Expression Blend 共同作業。

將應用程式部署至用戶端電腦

撰寫完應用程式之後，您必須將應用程式傳送給使用者，讓使用者能夠自行在用戶端電腦上安裝和執行。使用 ClickOnce 技術時，只需按幾下滑鼠按鍵就可以從 Visual Studio 內部署應用程式，並提供使用者指向 Web 或檔案共用上應用程式的 URL。ClickOnce 會管理應用程式中所有的項目和相依性，並確保應用程式能夠正確地安裝在用戶端電腦上。

ClickOnce 應用程式可以設定成只在使用者連線到網路時才執行，或者是設定成連線和離線時都可以執行。如果指定應用程式要支援離線作業，ClickOnce 會在使用者的 [開始] 功能表中加入應用程式的連結。以後使用者不必使用 URL 就可以開啟應用程式。

當您更新應用程式時，要將新的部署資訊清單以及新的應用程式複本發行至 Web 伺服器或檔案共用。ClickOnce 會偵測到可用的更新程式，並升級使用者的安裝；更新舊的組件並不需要自訂程式設計。如需詳細資訊，請參閱 WPF 應用程式部署。

部署 ClickOnce 應用程式

如需 ClickOnce 的完整介紹，請參閱 ClickOnce 部署概觀。如需如何使用這些功能的逐步資訊，請參閱下列說明主題。

請參閱

概念

給 Windows Form 開發人員的 WPF 設計工具注意事項

ClickOnce 部署概觀

應用程式設定概觀

與 Expression Blend 共同作業

其他資源

WPF 設計工具

控制項程式庫

XAML