2022年10月19日【Jiawei_Z】WPF的控件章节

WPF基础系列二：控件简介

参考链接

文章目录
控件简介
前言
一、控件
二、控件类型
三、控件详解
1.ContentControl 类
2.HeaderedContentControl 类
3.ItemsControl 类
4.其他

前言
控件就是显示数据和响应用户操作的UI元素，也即：控件就是数据和行为的载体。在WPF中，是数据驱动UI，数据是核心，处于主动的，UI从属于数据并表达数据，是被动的。因此，就重要性而言，WPF数据第一，控件第二，尽管如此，控件也占有非常重要的地位。

一、控件是什么呢？
控件的实质： 我们先从UI上分析，UI的功能是让用户观察和操作数据，为了能显示数据和响应用户的操作通知程序（通过事件来通知，如何处理事件又是一系列的算法），所以控件就是显示数据和响应用户操作的UI元素，也即：控件就是数据和行为的载体。
数据驱动UI： 什么是数据驱动UI呢？我们知道传统的GUI（图形用户界面）界面都是由windows消息通过事件传递给程序，程序根据不同的操作来表达出不同的数据体现在UI界面上，这样数据在某种程度上来说，受到很大的限制。WPF中是数据驱动UI，数据是核心，处于主动的，UI从属于数据并表达数据，是被动的。因为以后的章节会重点介绍，在此不做过多的说明，只要记着，WPF数据第一，控件第二。

二、控件类型
WPF控件有许多，大致可以分为6类：

布局控件： 是可以容纳多个控件或者嵌套其他布局的控件，用于在UI上组织和排列控件。其父类为Panel ；
内容控件： 只能容纳一个控件或者布局控件作为他的内容。所以经常借助布局控件来规划其内容。其父类为ContentControl ；
带标题内容控件： 相当于一个内容控件，但是可以加一个标题，标题部分也可以容纳一个控件或者布局，其父类为HeaderedContentControl ；
条目控件： 可以显示一列数据，一般情况下，是数据的类型是相同的。其共同的基类为ItemsControl ；
带标题的条目控件： 和上面的带标题内容控件类同，其基类为HeaderdeItemsControl ；
特殊内容控件： 这类控件比较独立，但也比较常用，如TextBox，TextBlock，Image 等（由于其常用性和相对比较简单，本篇笔记不做说明）
其各类控件的继承关系如下图所示：

三、控件详解
1.ContentControl 类
内容控件的特点是： 他们内容属性的名称为Content，只能有单一元素充当其内容。下面通过例子说明其特点：

<Grid>
        <Button Content="测试"  Margin="120,146,0,146" HorizontalAlignment="Left" Width="82" Height="50"/>
   </Grid>

运行结果：

特别的，同样类型的控件还有： ButtonBase、CheckBox、ComboBoxItem、ContentControl、Frame、GridViewColumnHeader、GropItem、Label、ListBoxItem、ListViewItem、NavigationWindow、RadioButton、ScrollViewer、StatusBarItem、ToggleButton、ToolTip、UserControl、Window。

这类控件除了用content属性外，还可以嵌套textblock/textbox/image等显示内容（注意只允许嵌套单一元素作为内容），示例如下，运行效果同上：

<Grid>
        <Button Margin="120,146,0,146" HorizontalAlignment="Left" Width="82" Height="50">
            <TextBlock  Text ="测试"  />
        </Button>
 </Grid>

2.HeaderedContentControl 类
带标题的内容控件特点： 可以显示带标题的数据，内容属性为Content和Header，其这两个属性都只能容纳一个元素。在此举例说明GroupBox的用法，然后列出其他属于此类的控件。示例如下：

 <Grid Background="Gold">
        <GroupBox Margin="42,0,96,26">
            <GroupBox.Header>
                <Label Content="我是标题"/>
            </GroupBox.Header>
           <Button  HorizontalAlignment="Left" Width="117" Height="45">
               <TextBox Text="测试"/>
            </Button>
        </GroupBox>
  </Grid>

特别的，同样类型的控件还有： Expender，GroupBox，HeaderedContentControl，TabItem

3.ItemsControl 类
条目控件特点： 该类控件用于显示列表化的数据，内容属性为Items或ItemsSource，每种ItemsControl都对应有自己的条目容器（Item Container）。本类元素可能会用的比较多些，也比较灵活，所以这里不做过多记录，以后的记录会经常用到，具体的再详细说明。下面以ListBox控件为示例：

    <Grid Background="Gold">
        <ListBox x:Name="listbox" Margin="0,0,198,55">
                <CheckBox x:Name="cb1" Content="选择"/>
                <CheckBox x:Name="cb2" Content="选择"/>
                <CheckBox x:Name="cb3" Content="选择"/>
                <CheckBox x:Name="cb4" Content="选择"/>
                <Button x:Name="btn1" Content="按钮1"/>
                <Button x:Name="btn2" Content="按钮1"/>
                <Button x:Name="btn3" Content="按钮1"/>
        </ListBox>
    </Grid>

特别的，同样类型的控件还有： ItemsControl族元素和其对应的Item Container有ComboBox——ComboBoxItem，ContextMenu——MenuItem，ListBox——ListBoxItem，ListView——ListViewItem，Menu——MenuItem，StatusBar——StatusBarItem，TabControl——TabItem，TreeView——TreeViewItem.

由于已经演示了HeaderedContentControl和ItemsControl的功能，另外HeaderedItemsControl的用法就不再记录了，仅仅列出属于其族的控件：MemuItem、TreeViewItem、TooBar。

4.其他
Panel布局控件在系列一中有详细介绍，这里不做赘述；
特殊内容控件，这类控件比较独立，但也比较常用，如TextBox，TextBlock，Image 等（由于其常用性和相对比较简单，本篇笔记不做说明）