逐步解說：在 WPF 設計工具中編輯 XAML

發行項
05/28/2012

WPF Designer for Visual Studio 提供許多和 Visual Studio 其他語言編輯器中的相同功能給 XAML 編輯器。本主題說明如何使用例如 IntelliSense 和大綱等功能。

在這個逐步解說中，您會執行下列工作：

建立 WPF 專案。
建立資源。
檢視語法反白顯示。
使用標記巡覽。
使用大綱。
使用 IntelliSense。
使用括號對稱。
使用自動格式化。

注意

根據您目前使用的設定或版本，您所看到的對話方塊與功能表指令可能會與 [說明] 中描述的不同。若要變更設定，請從 [工具] 功能表中選擇 [匯入和匯出設定]。如需詳細資訊，請參閱 Visual Studio 設定。

必要條件

您需要下列元件才能完成此逐步解說：

Visual Studio 2012 RC.

建立專案

第一步是建立主應用程式的專案。

若要建立專案

在 Visual Basic 或 Visual C# 中，建立名為 XamlEditing 的新 WPF 應用程式專案。如需詳細資訊，請參閱 HOW TO：建立新的 WPF 應用程式專案。

MainWindow.xaml 隨即在 WPF Designer中開啟。

建立資源

在 WPF 應用程式中您會經常使用資源。 WPF Designer讓使用者可在 [文件大綱] 視窗中巡覽資源區段，資源區段具有可摺疊式大綱功能。

若要建立資源

在 WPF Designer中開啟 MainWindow.xaml。

在 [XAML] 檢視中，將下列 XAML 插入至 MainWindow 的開頭標記之後。

這個 XAML 會建立一個線性的漸層筆刷，包含了色彩頻譜。

<Window.Resources>
    <LinearGradientBrush x:Key="backgroundBrush1" StartPoint="0,0" EndPoint="1,1">
        <GradientStop Color="Yellow" Offset="0.0" />
        <GradientStop Color="Red" Offset="0.25" />
        <GradientStop Color="Blue" Offset="0.75" />
        <GradientStop Color="LimeGreen" Offset="1.0" />
    </LinearGradientBrush>
</Window.Resources>

語法反白顯示

The WPF Designer會讓 XAML 程式碼易於閱讀，方法是根據其語法來設定顏色。

若要檢視語法反白顯示

在 [XAML] 檢視中，以下列標記取代預設的 <Grid> 項目。
```
<Grid Name="grid1" Background="{StaticResource backgroundBrush1}">

</Grid>
```
項目、屬性和屬性值都有唯一的色彩。

標記延伸會繫結至 Background 屬性。而且，[設計] 檢視中的方格背景會更新。

您可以變更 XAML 項目和屬性的色彩。如需詳細資訊，請參閱 HOW TO：變更 XAML 檢視設定。

標記導覽

您可以使用標記導覽，在標記之間移動。也可以使用 [文件大綱] 檢視巡覽。如需詳細資訊，請參閱巡覽 WPF 文件的項目階層架構。

若要使用標記導覽

在 [XAML] 檢視中，按一下 <Grid> 項目的開頭標記。
在 WPF Designer最下方，找出標記導覽。它會顯示 [方格 (grid1) 視窗/方格]。
在標記導覽中，將滑鼠指標移至 [視窗] 項目上。

隨即出現 MainWindow 的呈現縮圖。
在標記導覽中，按一下 [視窗] 超連結。

MainWindow 的開頭標記就會在 [XAML] 檢視中反白顯示。
在 [XAML] 檢視中，按一下 <Window.Resources> 標記。

標記導覽將 XAML 樹狀目錄階層顯示至 <Window.Resources> 項目。
在標記導覽中，按一下 [資源] 右邊的 [選取下層標籤] 箭號。

子項目隨即出現在快顯功能表中。
按一下 [LinearGradientBrush (backgroundBrush1)]。

<LinearGradientBrush> 項目已在 [XAML] 檢視中選取。

大綱

WPF Designer完全支援可摺疊式大綱功能。

若要使用大綱

在 [XAML] 檢視中，捲動至 <Window.Resources> 項目。
按一下開頭標記左邊的摺疊按鈕。

<Window.Resources> 項目會摺疊成一行。
按一下開頭標記左邊的展開按鈕。

<Window.Resources> 項目會展開成它原始的狀態。

IntelliSense

WPF Designer完全支援 IntelliSense.

若要使用 IntelliSense

在 grid1 項目中，輸入 <Gr。

IntelliSense 清單隨即出現，並已選取 Grid 類別。
按 TAB 完成開頭標記。
輸入 .c (確定包含句點)。

IntelliSense 清單隨即出現，並已選取以字母 C 開頭的第一個屬性。
使用向下鍵捲動至 ColumnDefinitions 屬性。
按 TAB 完成標記。

如需使用自訂型別之 IntelliSense 的詳細資訊，請參閱 HOW TO：將命名空間匯入 XAML。

括號對稱

您可以使用括號對稱功能，在項目中巡覽。

若要使用括號對稱

在 [XAML] 檢視中，在 <LinearGradientBrush> 開頭標記中按一下。
按下 CTRL+]。

游標會移至開頭標記的末端。
再次按下 CTRL+]。

游標會移至結尾標記的開頭。
刪除 <LinearGradientBrush> 項目結尾標記中的結尾角括弧 '>'。
輸入 '>' 完成結尾標記。

[XAML] 檢視會將開頭和結尾標記反白顯示。

自動格式化

您可以按下 CTRL+KD 將 XAML 格式化，然後指定自動格式化設定。如需詳細資訊，請參閱 HOW TO：變更 XAML 檢視設定。

若要使用自動格式化

在 [XAML] 檢視中，選取四個 <GradientStop> 項目。
按下 SHIFT+TAB。

四個項目宣告會移動至左邊。
按下 CTRL+KD。

四個項目宣告就會縮排。您可能會發現 XAML 還有其他的變更。
在第一個 <GradientStop> 標記中，按一下 [Color] 屬性前的空白。
按下 ENTER 鍵開始新行。
按一下 [Offset] 屬性前的空白，然後按下 ENTER 鍵開始新行。
按下 CTRL+KD。

屬性保留在新行中。
在 [Color] 屬性前插入四格空白，然後按下 CTRL+KD。

[Color] 屬性就不會變更位置。

請參閱

共用方式為