通过


Windows应用的控件

控件是构成Windows应用的 UI 元素—按钮、文本字段、列表、选取器等。 控件显示内容或允许用户与应用交互。 模式将多个控件结合为一种可重用的解决方案,适用于常见场景,例如表单或列表-详细布局。

Windows提供超过 45 个现成的控件,所有控件都基于 Fluent Design System。 从简单的切换到网格和列表等丰富的数据视图,这些控件可帮助你生成跨设备直观优化、可访问和响应的接口。

浏览本部分中的文章,了解每个控件和模式的设计指南、代码示例和最佳做法。

入门指南

若要了解如何向应用添加控件并连接事件处理程序,请参阅 “添加控件并处理事件”。 若要使用可重用的 XAML 样式自定义控件外观,请参阅 “设置控件样式”。

控件

下表列出了 WinUI 中可用的Windows应用控件,并提供了指向其文档的链接。

基本输入

图像 控制 说明
按钮 按钮 响应用户输入并引发 Click 事件的控件。 包括按钮、下拉按钮、拆分按钮、切换按钮等。
复选框 复选框 用户可以选择或清除的控件。
组合框 组合框 用户可以选择的下拉列表。
链接 Hyperlinks 显示为超链接文本的按钮,可以导航到 URI 或处理 Click 事件。
单选按钮 单选按钮 允许用户从一组选项中选择单个选项的控件。
分级控件 分级控件 从 1 到 5 星进行评分。
滑块 滑块 允许用户通过沿着轨道移动 Thumb 控件从一系列值中进行选择的控件。
切换开关 切换开关 可在 2 种状态之间切换的开关。

Collections

图像 控制 说明
项目视图 项目视图 使用各种布局呈现项目集合的控件。
列表视图和网格视图 列表视图和网格视图 在垂直列表中或行和列中显示项集合的控件。
翻转视图 翻转视图 显示一个用户可以逐个翻动查看的项目集合。
Pips 寻呼器 Pips 寻呼器 当用户不需要直观地知道页码时,允许用户在分页集合中导航的控件。
树视图 树视图 一种具有展开和折叠功能节点、并包含嵌套项的分层列表模式。
项目重复器 项目重复器 数据驱动布局的灵活基元控件。
轻扫 滑动 用于在项目上执行快速菜单操作的触摸手势。
下拉刷新 下拉刷新 提供拉取列表/网格中的项集合以刷新集合的内容的功能。

对话框和弹出窗口

图像 控制 说明
对话 框 对话 框 可以自定义以包含任何 XAML 内容的对话框。
浮出控件 弹出控件 显示上下文信息并启用用户交互。
教学提示 教学提示 一个内容丰富的弹出窗口,用于指导用户并提供教学契机。

表单

图像 控制 说明
表单 使用输入控件和标签的组合收集和提交用户输入的模式。

媒体、图形和形状

图像 控制 说明
图标 图标 表示将不同图像类型用作内容的图标控件。
动画图标 动画图标 一个元素,它显示并控制当用户与控件交互时动画的图标。
图像和图像画笔 图像和图像画笔 用于显示图像内容的控件。
墨迹 用于数字墨迹书写的控件,包括墨迹画布和墨迹工具栏。
媒体播放 媒体播放 用于显示视频和图像内容的控件。
形状 形状 绘制椭圆、矩形和多边形等形状。
图像 控制 说明
菜单和上下文菜单 菜单和上下文菜单 显示简单命令或选项的上下文列表。
命令栏 命令栏 用于显示应用程序特定的命令的工具栏,用于处理其内容的布局和大小调整。
命令栏弹出控件 命令栏浮出控件 显示主动命令的迷你工具栏和命令的可选菜单。
菜单浮出控件和菜单栏 菜单浮出控件和菜单栏 经典菜单,允许显示包含菜单飞出项的菜单项。
图像 控制 说明
痕迹栏 面包屑导航栏 显示到达当前位置的导航路径。
列表/细节 一种模式,显示项列表和当前所选项的详细信息。
导航视图 导航视图 使用可折叠导航菜单为应用的顶级区域实现常见垂直布局。
透视控件的屏幕截图 透视 在选项卡式视图中显示来自不同源的信息。
选择器栏 选择器栏 显示来自少数不同来源的信息。 用户可以选取其中一个。
选项卡视图 选项卡视图 显示可用于显示多个文档的选项卡集合的控件。

People

图像 控制 说明
个人照片 个人照片 显示人员/联系人的图片。

Pickers

图像 控制 说明
颜色选取器 颜色选取器 显示可选择的光谱的控件。
日历日期选取器 日历日期选取器 允许用户使用日历选取日期值的控件。
日历视图 日历视图 一个控件,用于向用户显示日历,以便从中选择日期。
日期选取器 日期选取器 允许用户选取日期值的控件。
时间选取器 时间选取器 允许用户选取时间值的可配置控件。

滚动和布局

图像 控制 说明
扩展器控件的屏幕截图 扩展器 用于显示包含更多内容的正文的容器,其标题可以展开。
滚动和平移控件 滚动和平移控件 允许用户平移和缩放其内容的容器控件。
带批注的滚动条 带批注的滚动条 一个控件,用于扩展常规垂直滚动条的功能,以便轻松浏览大型集合。
语义式缩放 语义式缩放 允许用户缩放集合的两个不同的视图,以便更轻松地浏览大型项集合。
拆分视图 拆分视图 包含两个内容区的容器,具有多个窗格的显示选项。
双窗格视图 双窗格视图 一个控件,其中包含跨越可用空间的两个内容区域(并排或上下)。

状态和信息

图像 控制 说明
进展 Progress 通过进度栏或进度环显示应用程序任务的进度。
工具提示控件的屏幕截图 工具提示 在弹出窗口中显示元素的信息。
信息栏 信息栏 用于显示整个应用程序状态更改信息的内联消息。
信息徽章 信息徽章 用于显示通知或将焦点置于某个区域的非侵入性 UI。

文本

图像 控制 说明
自动建议框 自动建议框 用于在用户键入时提供建议的控件。
文本块 文本块 用于显示少量文本的轻量控件。
富文本块 富文本块 显示格式化文本、超链接、内联图像和其他丰富内容的控件。
文本框 文本框 单行或多行纯文本字段。
富文本编辑框 Rich Edit 框 支持格式化文本、超链接和其他丰富内容的 RTF 编辑控件。
密码框 密码框 用于输入密码的控件。
数字框 数字框 用于对代数公式进行数值输入和计算的文本控件。
标签 添加可访问标签到输入控件的指南。

标题栏

图像 控制 说明
标题栏 标题栏 自定义应用窗口的标题栏。

WinUI 3 画廊应用是体验这些控件的最佳方式。 它提供大多数 WinUI 控件、功能和 Fluent Design 模式的交互式演示,使其成为本文档的理想助手。 安装它以实时尝试控件,并从单个控件页直接链接。

其他控件和资源

Windows Community Toolkit是帮助程序、扩展和其他 UI 控件的集合,它们补充了内置的 WinUI 控件。 它由Microsoft进行社区驱动和维护,涵盖高级布局、转换器和动画等常见方案。

若要提前访问实验性控件和功能,请参阅 Windows Community Toolkit Labs,新组件会在这里开发和测试,然后再加入主工具包。