WPF7 布局控件

一般，日常开发中会涉及到的WPF控件包括6类：

1、布局控件：可以容纳多个控件或嵌套其他布局控件，用于在UI上组织和排列控件。Grid、StackPanel、DockPanel等控件都属于此类，它们拥有共同的父类Panel。

2、内容控件：只能容纳一个其他控件或布局控件作为他的内容。Window，Button等控件都属于此类。因为只能容纳一个控件作为其内容，所以经常需要借助布局控件来规划期内容。它们的共同父类是ContentControl。

3、带标题内容控件：相当于一个内容控件，但可以加一个标题，标题部分也可以容纳一个控件或布局。GroupBox、TabItem等都是这类控件的典型代表。它们的共同父类是HeaderedContentControl。

4、条目控件：可以显示一列数据，一般情况下这列数据的类型相同。此类控件包括ListBox、ComboBox等。共同基类是ItemsControl。

5、带标题条目控件：在一个条目控件上加上一个标题显示区。TreeViewItem、MenuItem都属于此类控件，一般用于显示层级关系。

6、特殊内容控件：TextBox容纳的是字符串、TextBlock可以容纳可自由控制格式的文本、Image容纳图片类型数据等，这类控件一般比较独立。

一、内容模型

1、ContentControl族

本族元素均派生自ContentControl类，都是控件，内容属性的名称为Content，只能由单一元素充当其内容。

例如：

    <StackPanel>
        <Button Margin="5">
            <TextBlock Text="Hello"></TextBlock>
        </Button>
        <Button Margin="5">
            <Image Width="30" Height="30"/>
        </Button>
    </StackPanel>

第一个Button的内容是一个静态文本，第二个Button的内容是一张图片。但不能在一个Button中同时包含文字和图片。

2、HeaderedContentControl族

都派生自HeaderedContentControl类，HeaderedContentControl是ContentControl类的派生类，都是控件，用于显示带标题的数据，除了用于显示主体内容的区域外，控件还具有一个显示标题的区域，内容属性为Content和Header，无论是Content还是Header都只能容纳一个元素作为其内容。

例如：

        <GroupBox Margin="10" BorderBrush="Gray">
            <GroupBox.Header>
                <Image Width="30" Height="30"/>
                
            </GroupBox.Header>
            <TextBlock TextWrapping="WrapWithOverflow" Margin="10" Text="One tree,one horse,one elephant and one turkey together,guess a goods"/>
        </GroupBox>

3、ItemsControl族

均派生自ItemsControl类，都是控件，用于显示列表化的数据，内容属性为Items或ItemsSource，每种ItemsControl都对应有自己的条目容器。

ListBox是个典型的ItemsControl，WPF的UI是树形结构，VisualTreeHelper类是辅助类，如果ListBox内部包含一个Button标签，如果沿着Button一层一层向上找，到第三层就会发现是一个ListBoxItem，ListBoxItem就是ListBox对应的Item Container。也就是，无论把什么样的数据集合交给ListBox，最后都会以这种形式自动包装，所以也就可以简单的绑定数据：

        <ListBox x:Name="listBoxEmployee">           
        </ListBox>
...
//一个Employee类
    public class Employee
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int Age { get; set; }
        public List<Employee> GetEmployeeList()
        {
            List<Employee> list = new List<Employee>()
            {
                new Employee(){Id=1,Name="Tim",Age=30},
                new Employee(){Id=2,Name="Tom",Age=26},
                new Employee(){Id=3,Name="Guo",Age=26},
                new Employee(){Id=4,Name="Yan",Age=25},
                new Employee(){Id=5,Name="Owen",Age=30},
                new Employee(){Id=6,Name="Victor",Age=31}
            };
            return list;
        }
    }
...
//MainWindow.xaml.cs中绑定
        public MainWindow()
        {
            InitializeComponent();
            this.listBoxEmployee.DisplayMemberPath = "Name";
            this.listBoxEmployee.SelectedValuePath = "Id";
            this.listBoxEmployee.ItemsSource = new Employee().GetEmployeeList();
        }

4、HeaderedItemsControl族

除了具有ItemsControl特性外，还具有显示标题的能力，均派生自HeaderedItemsControl类，均是控件，用于显示列表化的数据，同事可以显示一个标题，内容属性是Items、ItemSource和Header。

5、Decorator类

用于装饰UI。

6、TextBlock和TextBox

最主要的功能是显示文本。TextBlock只能显示文本，不能编辑，所以又称静态文本。TextBox则允许用户编辑其中的内容。TextBlock虽然不能编辑内容，但可以使用丰富的格式标记显示排版效果。

7、Shape族

绘制2D图像用。

8、Panel族

最重要的控件族，所有用于UI布局的元素都属于这一族。主要功能是控制UI布局，内容属性是Children，内容可以是多个元素，Panel元素将控制他们的布局。包括DockPanel、Grid、Canvas、StackPanel等。