从Microsoft Store可以下载一个App，叫做XAML Controls Library，里面例举了许多WinUI中定义的XAML控件。可以逐一浏览。另一个用于展示WindowsCommunityToolkit的App叫做Windows Community Toolkit Sample App，也可以下载浏览。

如何给这些控件们分类是一个有学问的问题。控件那么多，用的时候选哪个呢？这需要了解每个控件的作用和意图。

有些控件的作用独特，很容易可以把它们与其他控件区分出来：

  • WebView，显示Web内容
  • InkCanvas，用于笔迹输入
  • PersonPicture，用于显示账户头像
  • Image，用来显示图片
  • MediaElement和MediaPlayerElement，用来播放视频
  • AnimatedVisualPlayer，用来显示Adobe AfterEffects创建的动画
  • ProgressBar和ProgressRing，用来显示进度
  • ToolTip，用来显示提示信息
  • DatePicker和TimePicker，用来选择日期和时间
  • CalendarView，用来显示日历
  • CalendarDataPicker，从日历上挑选一个日期
  • ColorPicker，颜色选择器

触屏相关：

  • PullToRefresh，以下拉方式刷新列表或者井格内容，估计是为了方便触屏操作
  • SwipeControl，指划控制

样式相关：

  • Acrylic，透薄效果
  • Reveal，许多控件的默认效果，鼠标靠近时会有视觉上的突出效果
  • Reveal Focus，用于突出具有Tab焦点的控件
  • Compact Sizing，将大小减小一号

文字显示和处理相关的控件

  • TextBlock，显示一段文字
  • RichTextBlock，显示一段文字，可以带超链接、图片等等
  • TextBox，用来输入一段文字
  • RichTextBox，用来处理富文本的编辑
  • PasswordBox，密码输入框
  • AutoSuggestBox，带下拉候选框的文字输入框

选项相关的控件

  • CheckBox，按键的目的主要是让用户选取一至多个选项
  • ComboBox，以弹出列表的方式来展示选项，而不是像CheckBox那样将选项完全罗列出来
  • RadioButton，和CheckBox类似，但是只能多选一
  • RatingControl，用作星级评价
  • Slider，用滑杆来选取值
  • ListBox，以一个列表的方式显示用户可以选择的选项

按键是任何UI界面都必不可少的组成部分，因此种类也五花八门

  • Button，最简单的按键，按下后触发一个动作
  • RepeatButton，一个能够记住自己被按下次数的按键
  • ToggleButton，有开关状态的按键
  • ToggleSwitch，ToggleButton的另一种形式
  • DropdownButton，和ComboBox有点像，但是是触发动作而不是选择内容
  • SplitButton，是DropdownButton的扩展，能够带一个目标对象作为额外参数
  • ToggleSplitButton，能够在SplitButton中显示类似ToggleButton的开关状态
  • HyperlinkButton，显示超链接

内容组织：

  • SemanticZoom，能够显示一个大纲，让用户选择需要跳转的内容
  • ListView，以列表方式显示内容
  • TreeView，以嵌套列表的方式显示内容
  • GridView，以横列方式显示内容
  • DataGrid，属于WindowsCommunityToolkit，主要是以表格的方式显示数据
  • FlipView，以横幅的方式来显示诸如图片之类的内容

滚动，如果内容比显示区域大的时候，就会用到滚动：

  • ScrollViewer，以滚动方式显示内容
  • Hub，横向滚动显示内容

页面组织：

  • Pivot，以组标签的方式组织内容
  • NavigationView，提供可缩放的边栏菜单，用于访问顶层元素

弹出内容：

  • ContentDialog，弹出一个模态对话框
  • Flyout，在原地弹出一个消息框
  • TeachingTip，在某个地方弹出一个消息框

菜单和工具栏

  • CommandBar，工具栏
  • CommandBarFlyout，工具栏飞页
  • AppBarButton，工具栏图标
  • AppBarSeparator，工具栏分隔线
  • AppBarToggleButton，工具栏触发按键
  • MenuBar，菜单栏
  • MenuFlyout，菜单栏飞页
  • StandardUICommand，常用菜单或者工具栏命令
  • XamlUICommand，可以用来定义命令的外观呈现

布局相关：

  • Border，边框
  • Canvas，画布，支持用坐标来描述子元素的位置
  • Grid，以横列方式显示子元素
  • RelativePanel，子元素可以使用彼此之间的关系来布局
  • SplitView，在内容左边或者右边制造出一个面板
  • StackPanel，将多个子元素横向或者竖向堆叠在一起
  • VariableSizedWrapGrid，表格方式组织子元素，单个子元素可以跨多行或者多列
  • ViewBox，一个具有缩放特性的容器

动态效果：

  • Parallax，可以让背景随着内容滚动，产生视察效果
  • Animation interop，在鼠标移入移出时加入Q弹效果
  • Connected Animation，用渐变效果增加前后联系
  • Earsing Functions，加快或者减弱动画效果
  • Implicit Transitions，根据权属来调整动画效果
  • Page Transitions，调整换页效果，有点类似PPT换页
  • Theme Transitions，主题中带的一套变换

数据驱动：

  • ItemsRepeater，用来呈现大量数据条目

（完）