• 先決條件
• 添加控件
• 設置控件的名稱
• 設置控件屬性
• 創建事件處理程序
• 新控件
• 總結
• 相關主題

通過使用如按鈕、文本框和組合框等控件，你可以創建應用的 UI。 下面將顯示如何將控件添加到應用。處理控件時，你通常會使用此模式：

• 將控件添加到應用 UI。
• 設置控件的屬性，如寬度、高度或前景色。
• 將代碼連接到控件，從而使控制執行任務。

路線圖：?本主題與其他主題有何關聯？請參閱：

• 使用 C# 或 Visual Basic 的 Windows 運行時應用的路線圖
• 使用 C++ 的 Windows 運行時應用的路線圖
• 應用功能大全系列中突出顯示的用戶交互：觸摸輸入和更多方式
• 應用功能大全系列中突出顯示的?Windows 應用商店應用 UI 詳細信息

?

先決條件

我們假定你可以使用 Microsoft Visual Basic、C# 或 C++ 以及 Extensible Application Markup Language (XAML) 創建基本的應用。有關創建第一個應用的說明，請參閱創建你的第一個使用 C# 或 Visual Basic 的 Windows 應用商店應用或創建你的第一個使用 C++ 的 Windows 應用商店應用。

添加控件

你可以通過多種方式將控件添加到應用：

• 使用諸如 Blend for Visual Studio 或 Microsoft Visual Studio XAML 設計器的設計工具。
• 在 Visual Studio XAML 編輯器中將控件添加到 XAML 標記中。
• 在代碼中添加控件。 當應用運行時會看到你在代碼中添加的控件，但在 Visual Studio XAML 設計器中看不到。

每個控件的文檔都包含解釋如何在 XAML 中、在代碼中或使用設計工具添加控件的“操作方式”主題。例如，若要添加?Button?控件，請參閱如何添加按鈕。

此處，我們使用 Visual Studio 作為我們的設計工具，但你可以在 Blend for Visual Studio 中進行該任務并且可以執行更多任務。有關詳細信息，請參閱通過使用 XAML 設計器創建 UI。

在 Visual Studio 中，當你在應用中添加和操縱控件時，你可以使用許多程序功能，包括“工具箱”、XAML 設計器、XAML 編輯器以及“屬性”窗口。

Visual Studio“工具箱”中會顯示可在應用中使用的許多控件。要將控件添加到應用，請在“工具箱”中雙擊該控件。例如，如果雙擊?TextBox?控件，則會將此 XAML 添加到?XAML?視圖中。

XAML <TextBox HorizontalAlignment="Left" Text="TextBox" VerticalAlignment="Top"/>

還可以將控件從“工具箱”拖動到 XAML 設計器。

?設置控件的名稱

若要在代碼中使用某個控件，你可以設置該控件的?x:Name?特性并在代碼中通過名稱來引用該控件。你可以在 Visual Studio“屬性”窗口或 XAML 中設置名稱。下面是通過使用“屬性”窗口頂部的“名稱”文本框來更改當前選定控件名稱的方法。

命名控件的步驟

選擇要命名的元素。

在“屬性”面板中，在“名稱”文本框中鍵入名稱。

按 Enter 提交名稱。

下面是在 XAML 編輯中通過更改?x:Name?特性來更改控件名稱的方法。

XAML <Button x:Name="Button1" Content="Button"/>

?設置控件屬性

你使用屬性來指定控件的外觀、內容以及其他屬性。使用設計工具添加控件時， Visual Studio 可能會為你設置某些控制大小、位置和內容的屬性。通過設置和操縱“設計”視圖中的控件，你可以更改某些屬性，如Width、Height?或?Margin。下圖顯示了“設計”視圖中提供的某些大小調整工具。

你可能希望讓控件自動調整大小和位置。這種情況下，你可以重置 Visual Studio 為你設置的大小和位置屬性。

重置屬性的步驟

在“屬性”面板中，單擊屬性值旁邊的屬性標記。此時將打開“屬性”菜單。

在“屬性”菜單中，單擊“重置”。

在 XAML 或代碼中，你可以通過“屬性”窗口設置控件屬性。例如，要更改?Button?的前景色，你可以設置控件的Foreground?屬性。下圖顯示了如何通過使用“屬性”窗口中的“顏色選取器”來設置?Foreground?屬性。

下面是在“XAML”編輯器中設置?Foreground?屬性的方法。注意打開的 Visual Studio IntelliSense 窗口，該窗口可以幫助你處理語法。

下面是設置?Foreground?屬性后的 XAML 結果。

XAML <Button x:Name="Button1" Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top"Foreground="Beige"/>

下面是在代碼中設置?Foreground?屬性的方法。

C# C++ VB Button1.Foreground = new SolidColorBrush(Windows.UI.Colors.Beige);

?創建事件處理程序

每個控件都包含事件，從而使你可以對用戶的操作或應用中的其他更改做出響應。例如，Button?控件包含用戶單擊?Button?時引發的?Click?事件。你可以創建一個調用事件處理程序的方法來處理事件。你可以在 XAML 中或在代碼中，將控件的事件與“屬性”窗口中的事件處理程序方法相關聯。有關事件的詳細信息，請參閱事件和路由事件概述。

要創建事件處理程序，請選擇控件，然后在“屬性”窗口的頂部單擊“事件”選項卡。“屬性”窗口會列出可供該控件使用的所有事件。下面是?Button?的一些事件。

要使用默認名稱創建事件處理程序，請在“屬性”窗口中雙擊事件名稱胖的文本框。若要使用自定義名稱創建事件處理程序，請將你選擇的名稱輸入到文本框中并按 Enter。隨即會創建事件處理程序并在代碼編輯器中打開代碼隱藏文件。該事件處理程序方法具有 2 個參數。第一個參數是?sender，它是對處理程序所附加到的對象的引用。sender?參數為?Object?類型。如果你想在?sender?自身上檢查或更改狀態，通常需要將?sender?強制轉換為更精確的類型。基于你自己的應用設計，你想要一種可將?sender?安全地轉換到的類型（基于處理程序附加在何處）。第二個值是事件數據，它通常在簽名中顯示為?e?參數。

以下代碼處理名為?Button1?的?Button?的?Click?事件。當你單擊該按鈕時，你單擊的?Button?的?Foreground?屬性將設置為 blue。

C# C++ VB private void Button_Click(object sender, RoutedEventArgs e) {Button b = (Button)sender;b.Foreground = new SolidColorBrush(Windows.UI.Colors.Blue); }

你也可以在 XAML 中關聯事件處理程序。在 XAML 編輯器中，你可以輸入要處理的事件名稱。當你開始輸入時，Visual Studio 會顯示 IntelliSense 窗口。指定事件后，你可以在 IntelliSense 窗口中雙擊?<New Event Handler>，從而使用默認名稱創建新的事件處理程序，或者從列表中選擇一個現有的事件處理程序。下面顯示的 IntelliSense 窗口可幫助你創建新的事件處理程序。

該示例顯示如何在 XAML 中將?Click?事件與名為?Button_Click?的事件處理程序相關聯。

XAML <Button Name="Button1" Content="Button" Click="Button_Click"/>

你也可以將事件與實際代碼中的事件處理程序相關聯。下面是在代碼中關聯事件處理程序的方法。

C# C++ VB Button1.Click += new RoutedEventHandler(Button_Click);

新控件

如果你使用其他 XAML 平臺，你可能會對 Windows?8 的新控件感興趣。

• AppBar
• CaptureElement
• FlipView
• GridView
• SemanticZoom
• ProgressRing
• ToggleSwitch
• VariableSizedWrapGrid

你可以通過控件列表了解這些新控件和其他控件。

?總結

你現在知道了將控件添加到應用、設置控件屬性和創建事件處理程序的基礎知識。接下來，你將會了解哪些控件可用的更多信息：控件列表或按功能分組控件。 通過下載基本控件示例，還可以查看許多 Windows UI 控件。

總結

以上是生活随笔為你收集整理的WP8.1学习系列(第二十章)——添加控件和处理事件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。