面向 Windows 的 XAML UI 框架提供丰富的控件库，这些控件可支持 UI 开发。这些控件中的一部分具有直观的表示；其他功能作为其他控件或内容（如图像和媒体）的容器。你可以通过下载控件和布局库示例以及 XAML 基本控件示例在操作中查看许多 Windows UI 控件。
下面是可在应用中使用的常见 XAML 控件的列表，按字母排序。要查看按功能分组的控件，请参阅按功能列出控件。
你可以将应用 UI 中的大部分控件用于手机和电脑。这些控件通常有相似的外观，但在某些情况下，它们在手机和电脑上的外观不同。其他控件仅适用于手机应用，或仅适用于电脑应用。
<Page.BottomAppBar>
<AppBar x:Name="bottomAppBar" Padding="10,0,10,0">
<Grid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<Button Style="{StaticResource EditAppBarButtonStyle}" Click="Button_Click"/>
<Button Style="{StaticResource RemoveAppBarButtonStyle}" Click="Button_Click"/>
<Button Style="{StaticResource AddAppBarButtonStyle}" Click="Button_Click"/>
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button Style="{StaticResource RefreshAppBarButtonStyle}" Click="Button_Click"/>
<Button Style="{StaticResource HelpAppBarButtonStyle}" Click="Button_Click"/>
</StackPanel>
</Grid>
</AppBar>
</Page.BottomAppBar>
-
参考：AppBar方法：添加应用栏
设计：顶部应用栏、底部应用栏
示例代码：XAML AppBar 控件示例、控件和布局库示例
- 应用栏按钮
-
使用应用栏样式显示命令的按钮。参考：AppBarButton
- 应用栏分隔符（仅限 Windows）
-
在视觉上分隔应用栏中的命令组。 - 应用栏切换按钮
-
使用应用栏样式的切换命令的按钮。 - 音频
-
请参阅媒体元素 - 自动建议框（仅限 Windows Phone）
-
在用户键入时提供建议文本的文本输入框。
B
- 边框
-
绘制另一对象周围的边框、背景或二者的容器控件。
<Border BorderBrush="Gray" BorderThickness="4" Height="108" Width="64"> <StackPanel> <Rectangle Fill="Yellow"/> <Rectangle Fill="Green"/> </StackPanel> </Border>参考：Border
示例代码：控件和布局库示例
- 按钮
-
响应用户输入和引发 Click 事件的控件。
<Button x:Name="button1" Content="Button" Click="Button_Click" />参考：Button
方法：添加按钮
设计：按钮
示例代码：XAML 基本控件示例、控件和布局库示例
C
- 画布
-
支持相对于画布左上角的子元素的绝对位置的布局面板。
<Canvas Width="120" Height="120"> <Rectangle Fill="Red"/> <Rectangle Fill="Blue" Canvas.Left="20" Canvas.Top="20"/> <Rectangle Fill="Green" Canvas.Left="40" Canvas.Top="40"/> <Rectangle Fill="Yellow" Canvas.Left="60" Canvas.Top="60"/> </Canvas>参考：Canvas
方法：快速入门：添加布局控件
示例代码：控件和布局库示例
- 复选框
-
用户可以选中或清除的一种控件。
<CheckBox x:Name="checkbox1" Content="CheckBox" Checked="CheckBox_Checked"/>参考：CheckBox
方法：添加复选框
设计：复选框
示例代码：XAML 基本控件示例、控件和布局库示例
- 组合框
-
用户可以从中进行选择的项目下拉列表。
<ComboBox x:Name="comboBox1" SelectionChanged="ComboBox_SelectionChanged" Width="100"> <x:String>Item 1</x:String> <x:String>Item 2</x:String> <x:String>Item 3</x:String> </ComboBox>参考：ComboBox
方法：添加组合框和列表框
设计：下拉列表
示例代码：XAML 基本控件示例、控件和布局库示例
- 命令栏
-
一个特殊的应用栏，用于调整应用栏按钮元素的大小。<CommandBar> <AppBarButton Icon="Back" Label="Back" Click="AppBarButton_Click"/> <AppBarButton Icon="Stop" Label="Stop" Click="AppBarButton_Click"/> <AppBarButton Icon="Play" Label="Play" Click="AppBarButton_Click"/> </CommandBar>参考：CommandBar
方法：添加应用栏
设计：底部应用栏
示例代码：XAML AppBar 控件示例、控件和布局库示例
- 内容对话（仅限 Windows Phone）
-
可自定义以包含任何 XAML 内容的对话框。 - 上下文菜单
-
请参阅弹出菜单
D
- 日期选取器
-
使用户可以选择日期的控件。
<DatePicker Header="Arrival Date"/>
参考：DatePicker
设计：日期选取器
- 日期选取器浮出控件（仅限 Windows Phone）
-
使用户可以选择日期的浮出控件。
F
- 弹性框
-
请参阅堆叠面板 - 翻转视图
-
显示用户可逐一浏览的项目集合的控件。
<FlipView x:Name="flipView1" SelectionChanged="FlipView_SelectionChanged"> <Image Source="Assets/Logo.png" /> <Image Source="Assets/SplashScreen.png" /> <Image Source="Assets/SmallLogo.png" /> </FlipView>参考：FlipView
设计：翻转视图
- 浮出控件
-
显示要求用户交互的消息。（与对话框不同，浮出控件不创建一个单独的窗口，而且不阻止其他用户交互。）
<Flyout> <StackPanel> <TextBlock>All items will be permanently removed from your cart.</TextBlock> <Button Click="DeleteConfirmation_Click">Empty my cart</Button> </StackPanel> </Flyout>参考：Flyout
方法：快速入门：添加浮出控件
设计：浮出控件
G
- 网格
-
支持以行和列排列子元素的布局面板。
<Grid> <Grid.RowDefinitions> <RowDefinition Height="50"/> <RowDefinition Height="50"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="50"/> <ColumnDefinition Width="50"/> </Grid.ColumnDefinitions> <Rectangle Fill="Red"/> <Rectangle Fill="Blue" Grid.Row="1"/> <Rectangle Fill="Green" Grid.Column="1"/> <Rectangle Fill="Yellow" Grid.Row="1" Grid.Column="1"/> </Grid>参考：Grid
方法：快速入门：添加布局控件
示例代码：控件和布局库示例
- 网格视图
-
显示可在行和列中水平滚动的项目集合的控件。
<GridView x:Name="gridView1" SelectionChanged="GridView_SelectionChanged"> <x:String>Item 1</x:String> <x:String>Item 2</x:String> </GridView>参考：GridView
设计：网格视图和列表视图
示例代码：XAML ListView 和 GridView 基本示例、XAML ListView 和 GridView 自定义交互性示例、XAML GridView 分组和 SemanticZoom 示例、控件和布局库示例
H
- 集线器
-
一个容器控件，使用户可以查看并导航至内容的不同部分。<Hub> <HubSection> <!--- hub section content --> </HubSection> <HubSection> <!--- hub section content --> </HubSection> </Hub>参考：Hub
方法：快速入门：使用中心
设计：中心
示例代码：XAML Hub 控件示例、控件和布局库示例
- 超链接
-
请参阅“超链接按钮” - “超链接”按钮
-
类似于标记文本的按钮，通常嵌入在文本块中使用。
<HyperlinkButton Content="www.microsoft.com" NavigateUri="http://www.microsoft.com"/>
方法：添加按钮
设计：超链接
示例代码：XAML 基本控件示例、控件和布局库示例
I
- 图像
-
显示图像的控件。
<Image Source="Assets/Logo.png" />
参考：Image
示例代码：XAML 图像示例、XAML 基本控件示例、控件和布局库示例
- 项目控件
-
显示数据模板所指定 UI 中项目集合的控件。<ItemsControl/>
参考：ItemsControl
L
- 列表框
-
显示用户可以从中进行选择的嵌入式项列表的控件。
<ListBox x:Name="listBox1" SelectionChanged="ListBox_SelectionChanged" Width="100"> <x:String>Item 1</x:String> <x:String>Item 2</x:String> <x:String>Item 3</x:String> </ListBox>参考：ListBox
方法：添加组合框和列表框
设计：列表框
示例代码：XAML 基本控件示例、控件和布局库示例
- 列表选取器浮出控件（仅限 Windows Phone）
-
显示用户可以从中进行选择的项目列表的浮出控件。 - 列表视图
-
显示可在列表中垂直滚动的项目集合的控件。
<ListView x:Name="listView1" SelectionChanged="ListView_SelectionChanged"> <x:String>Item 1</x:String> <x:String>Item 2</x:String> </ListView>参考：ListView
设计：网格视图和列表视图
示例代码：XAML ListView 和 GridView 基本示例、XAML ListView 和 GridView 自定义交互性示例、控件和布局库示例
M
- 地图控件（仅限 Windows Phone）
-
显示地图的控件。参考：MapControl
设计：地图
- 媒体元素
-
可播放音频和视频内容的控件。<MediaElement/>
参考：MediaElement
设计：音频感知应用
示例代码：XAML 媒体播放示例
- 菜单浮出控件
-
临时显示与用户当前正在执行的操作相关的命令或选项的列表。
<MenuFlyout> <MenuFlyoutItem Text="Reset" Click="Reset_Click"/> <MenuFlyoutSeparator/> <ToggleMenuFlyoutItem Text="Shuffle" IsChecked="{Binding IsShuffleEnabled, Mode=TwoWay}"/> <ToggleMenuFlyoutItem Text="Repeat" IsChecked="{Binding IsRepeatEnabled, Mode=TwoWay}"/> </MenuFlyout>参考：MenuFlyout、MenuFlyoutItem、MenuFlyoutSeparator、ToggleMenuFlyoutItem
- 多行文本框
-
请参阅文本框。
P
- 平移滚动查看器
-
请参阅滚动查看器 - “密码”框
-
用于输入密码的一种控件。
<PasswordBox x:Name="passwordBox1" IsPasswordRevealButtonEnabled="True" PasswordChanged="PasswordBox_PasswordChanged" />参考：PasswordBox
设计：密码框
- 选取器浮出控件（仅限 Windows Phone）
-
可用于创建自定义选取器的控件。参考：PickerFlyout
- 透视（仅限 Windows Phone）
-
全屏的容器和导航模型，它还提供在不同的透视之间快速移动的方法（视图或筛选器），这些透视通常在同一组数据中。参考：Pivot
设计：透视
- 弹出菜单
-
提供你指定的命令的自定义菜单。参考：PopupMenu
设计：上下文菜单
示例代码：XAML 基本控件示例
- 进度条
-
通过显示一个长条来指示进度的控件。
显示特定值的进度条。
<ProgressBar x:Name="progressBar1" Value="50" Width="100"/>
显示不确定进度的进度条。
<ProgressBar x:Name="indeterminateProgressBar1" IsIndeterminate="True" Width="100"/>
参考：ProgressBar
方法：添加进度控件
设计：进度栏和进度环
示例代码：XAML 基本控件示例、控件和布局库示例
- 进度环
-
通过显示一个 环来指示不确定进度的控件。
<ProgressRing x:Name="progressRing1" IsActive="True"/>
参考：ProgressRing
方法：添加进度控件
设计：进度栏和进度环
示例代码：XAML 基本控件示例、控件和布局库示例
- “推送”按钮
-
请参阅按钮
R
- 单选按钮
-
允许用户从一组选项中选择单个选项的控件。将单选按钮分组到一起时，它们互相排斥。
<RadioButton x:Name="radioButton1" Content="RadioButton 1" GroupName="Group1" Checked="RadioButton_Checked"/> <RadioButton x:Name="radioButton2" Content="RadioButton 2" GroupName="Group1" Checked="RadioButton_Checked" IsChecked="True"/> <RadioButton x:Name="radioButton3" Content="RadioButton 3" GroupName="Group1" Checked="RadioButton_Checked"/>参考：RadioButton
方法：添加单选按钮
设计：单选按钮
示例代码：XAML 基本控件示例、控件和布局库示例
- 重复按钮
-
从按下到释放为止重复引发 Click 事件的一种按钮。
<RepeatButton x:Name="repeatButton1" Content="Repeat Button" Click="RepeatButton_Click" />参考：RepeatButton
方法：添加按钮
示例代码：控件和布局库示例
- 可编辑对话框
-
使用户可以编辑带有格式化文本、超链接和图像等内容的富文本文档的控件。<RichEditBox />
参考：RichEditBox
设计：文本输入拼写检查
S
- 滚动条
-
提供具有滑动的 Thumb（其位置对应于一个值）的滚动条的一种控件。<ScrollBar/>
参考：ScrollBar
- 滚动查看器
-
可让用户平移和缩放其内容的容器控件。
<ScrollViewer ZoomMode="Enabled" MaxZoomFactor="10" HorizontalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" Height="200" Width="200"> <Image Source="Assets/Logo.png" Height="400" Width="400"/> </ScrollViewer>参考：ScrollViewer
设计：滚动查看器
示例代码：XAML 滚动、平移以及缩放示例、控件和布局库示例
- 搜索框（仅限 Windows）
-
使用户可以输入搜索查询的控件。
<SearchBox />
参考：SearchBox
方法：添加搜索
设计：搜索框
示例代码：SearchBox 控件示例、控件和布局库示例
- 语义缩放
-
让用户在项目集合的两个视图之间缩放的容器控件。
<SemanticZoom> <ZoomedInView> <GridView></GridView> </ZoomedInView> <ZoomedOutView> <GridView></GridView> </ZoomedOutView> </SemanticZoom>参考：SemanticZoom
方法：添加语义式缩放控件
- 形状
-
可以显示的各种保留模式图形对象，例如椭圆、矩形、直线、贝塞尔曲线等。
<Ellipse/> <Path/> <Rectangle/>
参考：Shapes
方法：快速入门：绘制形状
示例代码：基于 XAML 矢量的绘图示例
- 单行文本框
-
一个单行纯文本字段。请参阅文本框。 - 滑块
-
一种可让用户通过沿轨迹移动 Thumb 控件从一个值范围中进行选择的控件。
<Slider x:Name="slider1" Width="100" ValueChanged="Slider_ValueChanged" />
参考：Slider
方法：添加滑块
设计：滑块
示例代码：XAML 基本控件示例
- 堆叠面板
-
可以将子元素按水平或垂直方向排列到单行中的布局面板。
<StackPanel> <Rectangle Fill="Red"/> <Rectangle Fill="Blue"/> <Rectangle Fill="Green"/> <Rectangle Fill="Yellow"/> </StackPanel>参考：StackPanel
方法：快速入门：添加布局控件
示例代码：控件和布局库示例
- 静态文本/段落
-
请参阅文本块。
T
- 文本块
-
显示文本的控件。
<TextBlock x:Name="textBlock1" Text="I am a TextBlock" />
方法：快速入门：显示文本
设计：键入
- 文本框
-
单行或多行纯文本字段。
<TextBox x:Name="textBox1" Text="I am a TextBox" TextChanged="TextBox_TextChanged" />参考：TextBox
- 时间选取器
-
使用户可以设置时间值的控件。
<TimePicker Header="Arrival Time"/>
参考：TimePicker
设计：时间选取器
- 时间选取器浮出控件（仅限 Windows Phone）
-
使用户可以设置时间值的浮出控件。 - 切换按钮
-
可以在 2 个状态之间进行切换的一种按钮。<ToggleButton x:Name="toggleButton1" Content="Button" Checked="ToggleButton_Checked"/>参考：ToggleButton
方法：添加按钮
- 切换开关
-
可以在 2 种状态之间进行切换的一种开关。
<ToggleSwitch x:Name="toggleSwitch1" Header="ToggleSwitch" OnContent="On" OffContent="Off" Toggled="ToggleSwitch_Toggled"/>参考：ToggleSwitch
方法：添加切换开关
设计：切换开关
示例代码：XAML 基本控件示例、控件和布局库示例
- 工具提示
-
显示元素信息的一种弹出窗口。
<Button Content="Button" Click="Button_Click" ToolTipService.ToolTip="Click to perform action" />方法：添加工具提示
设计：工具提示
示例代码：XAML 基本控件示例、控件和布局库示例
V
- VariableSizedWrapGrid
-
支持以行和列排列子元素的布局面板。每个子元素都可以跨越多行和多列。
<VariableSizedWrapGrid MaximumRowsOrColumns="3" ItemHeight="44" ItemWidth="44"> <Rectangle Fill="Red"/> <Rectangle Fill="Blue" Height="80" VariableSizedWrapGrid.RowSpan="2"/> <Rectangle Fill="Green" Width="80" VariableSizedWrapGrid.ColumnSpan="2"/> <Rectangle Fill="Yellow" Height="80" Width="80" VariableSizedWrapGrid.RowSpan="2" VariableSizedWrapGrid.ColumnSpan="2"/> </VariableSizedWrapGrid>方法：快速入门：添加布局控件
示例代码：控件和布局库示例
- 视频
-
请参阅媒体元素 - Viewbox
-
可以将其内容缩放至指定大小的容器控件。
<Viewbox MaxWidth="25" MaxHeight="25"> <Image Source="Assets/Logo.png"/> </Viewbox> <Viewbox MaxWidth="75" MaxHeight="75"> <Image Source="Assets/Logo.png"/> </Viewbox> <Viewbox MaxWidth="150" MaxHeight="150"> <Image Source="Assets/Logo.png"/> </Viewbox>参考：Viewbox
示例代码：控件和布局库示例
W
- Web 视图
-
可托管 Web 内容的容器控件。<WebView x:Name="webView1" Source="http://dev.windows.com" Height="400" Width="800" />
<Rectangle Height="400" Width="800"> <Rectangle.Fill> <WebViewBrush SourceName="webView1"/> </Rectangle.Fill> </Rectangle>
控件列表 (XAML)