逐步解說:在 WPF 設計工具中編輯 XAML
更新:2007 年 11 月
Windows Presentation Foundation (WPF) Designer for Visual Studio 提供許多和 Visual Studio 其他語言編輯器中的相同功能給 XAML 編輯器。本主題說明如何使用例如 IntelliSense 和大綱等功能。
在這個逐步解說中,您會執行下列工作:
建立 WPF 專案。
建立資源。
檢視語法反白顯示。
使用標記巡覽。
使用大綱。
使用 IntelliSense。
使用括號對稱。
使用自動格式化。
注意事項: |
---|
根據您目前使用的設定或版本,您所看到的對話方塊與功能表命令可能會與 [說明] 中描述的不同。若要變更設定,請從 [工具] 功能表中選擇 [匯入和匯出設定]。如需詳細資訊,請參閱 Visual Studio 設定。 |
必要條件
您需要下列元件才能完成此逐步解說:
- Visual Studio 2008。
建立專案
第一步是建立主應用程式的專案。
若要建立專案
在 Visual Basic 或 Visual C# 中,建立名為 XamlEditing 的新 WPF 應用程式專案。如需詳細資訊,請參閱 HOW TO:建立新的 WPF 應用程式專案。
Window1.xaml 會在 WPF 設計工具中開啟。
建立資源
在 WPF 應用程式中您會經常使用資源。WPF 設計工具讓使用者可在 [文件大綱] 視窗中巡覽資源區段,資源區段具有可摺疊式大綱功能。
若要建立資源
Open Window1.xaml in the WPF 設計工具.
在 [XAML] 檢視中,將下列 XAML 插入至 Window1 的開頭標記之後。
這個 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 設計工具會讓 XAML 程式碼易於閱讀,方法是根據其語法來設定顏色。
若要檢視語法反白顯示
在 [XAML] 檢視中,以下列文字取代預設的 <Grid> 項目。
<Grid Name="grid1" Background="{StaticResource backgroundBrush1}"> </Grid>
項目、屬性和屬性值都有唯一的色彩。此外,標記延伸繫結至 Background 屬性。而且,[設計] 檢視中的方格背景會更新。
您可以變更 XAML 項目和屬性的色彩。如需詳細資訊,請參閱 HOW TO:變更 XAML 檢視設定。
標記導覽
您可以使用標記導覽,在標記之間移動。也可以使用 [文件大綱] 檢視巡覽。如需詳細資訊,請參閱巡覽 WPF 文件的項目階層架構。
若要使用標記導覽
在 [XAML] 檢視中,按一下 <Grid> 項目的開頭標記。
在 WPF 設計工具最下方,找出標記導覽。它會顯示 [方格 (grid1) 視窗/方格]。
在標記導覽中,將滑鼠指標移至 [視窗] 項目上。
隨即出現 Window1 的呈現縮圖。
在標記導覽中,按一下 [視窗] 超連結。
Window1 的開頭標記就會在 [XAML] 檢視中反白顯示。
在 [XAML] 檢視中,按一下 <Window.Resources> 標記。
標記導覽將 XAML 樹狀目錄階層顯示至 <Window.Resources> 項目。
在標記導覽中,按一下 [資源] 左邊的 [下一個選取項目] 箭號。
<LinearGradientBrush> 項目已在 [XAML] 檢視中選取。
大綱
WPF 設計工具完全支援可摺疊式大綱功能。
若要使用大綱
在 [XAML] 檢視中,捲動至 <Window.Resources> 項目。
按一下開頭標記左邊的摺疊按鈕。
<Window.Resources> 項目會摺疊成一行。
按一下開頭標記左邊的展開按鈕。
<Window.Resources> 項目會展開成它原始的狀態。
IntelliSense
WPF 設計工具完全支援 IntelliSense.
若要使用 IntelliSense
在 grid1 項目中,輸入 <Gr。
IntelliSense 清單隨即出現,並已選取 Grid 類別。
按 TAB 完成開頭標記。
輸入 .c (確定包含句點)。
IntelliSense 清單隨即出現,並已選取 Children 屬性。
使用向下鍵捲動至 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] 屬性就不會變更位置。