WPF控件ItemsControl、ListBox、ListView、DataGrid、TreeView、TabControl用法及区别_wpf表格控件

1.ItemsControl

temsControl是WPF中最基本的控件之一，用于显示一个数据项集合。它允许按照自定义方式呈现任何类型的对象，可以在其中使用不同的布局和面板来展示数据。ItemsControl非常灵活，可以满足各种需求。

以下是一个简单的ItemsControl的XAML示例，它使用StackPanel作为布局容器，并通过DataTemplate指定了如何呈现每个数据项：

<ItemsControl ItemsSource="{Binding Customers}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>
1
2
3
4
5
6
7
8
9
10
11
12

这段代码假设有一个名为Customers的集合，它包含多个Customer对象，每个对象都有一个Name属性。ItemsControl将此集合绑定到其ItemsSource属性，并使用DataTemplate将每个数据项呈现为一个文本块。此外，我们还使用了一个StackPanel作为ItemsControl的默认面板。

2.ListBox

ListBox是从ItemsControl派生的一个控件，用于显示选择项列表。与ItemsControl相比，ListBox还提供了选择功能，使用户可以从列表中选择一个或多个项。ListBox可以使用DataTemplate来自定义每个项的呈现方式。

以下是一个简单的ListBox的XAML示例，它绑定到一个名为Cities的字符串数组，并使用DataTemplate将每个城市呈现为一个按钮：

<ListBox ItemsSource="{Binding Cities}" SelectionMode="Multiple">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Button Content="{Binding}" />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
1
2
3
4
5
6
7

此代码将一个字符串数组绑定到ListBox的ItemsSource属性上，设置SelectionMode属性为Multiple以启用多选功能。然后，我们使用DataTemplate将每个数据项呈现为一个按钮。

3.DataGrid

DataGrid是WPF中用于显示表格的控件。它允许显示和编辑数据，支持排序、过滤、分组和分页等功能。DataGrid通常用于数据驱动的应用程序中，因为它可以使用户以一种直观的方式查看和操作数据。

以下是一个简单的DataGrid的XAML示例，它包含一个Person类的集合，并将其绑定到DataGrid的ItemsSource属性上：

<DataGrid ItemsSource="{Binding People}" AutoGenerateColumns="False" >
    <DataGrid.Columns>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}" />
        <DataGridTextColumn Header="Age" Binding="{Binding Age}" />
        <DataGridCheckBoxColumn Header="IsMarried" Binding="{Binding IsMarried}" />
    </DataGrid.Columns>
</DataGrid>
1
2
3
4
5
6
7

此代码将一个Person类的集合绑定到DataGrid的ItemsSource属性上，并使用AutoGenerateColumns属性禁用自动生成列。然后，我们手动添加三个列：Name、Age和IsMarried。DataGridTextColumn用于呈现文本数据，而DataGridCheckBoxColumn用于呈现布尔值数据。

4.ListView

ListView也是一个用于显示项集合的控件，它与ListBox很相似，但提供了更多的自定义选项。ListView允许选择如何绘制每个项、如何排序和分组等。

以下是一个简单的ListView的XAML示例，它使用GridView作为视觉化布局，并使用DataTemplate将每个数据项呈现为一个StackPanel：

<ListView ItemsSource="{Binding Customers}">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" />
            <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" />
            <GridViewColumn Header="Email" DisplayMemberBinding="{Binding Email}" />
        </GridView>
    </ListView.View>
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Image Source="{Binding Image}" Width="50" Height="50" />
                <TextBlock Text="{Binding Name}" Margin="10,0,0,0" />
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

该代码将一个名为Customers的集合绑定到ListView的ItemsSource属性上，并使用GridView列来表示每列的数据。然后，我们使用DataTemplate来定义每个数据项的呈现方式，这里使用了一个StackPanel来呈现图片和文本。

5.TreeView

TreeView是用于显示具有层次结构的数据的控件。它允许以树形式表示数据，并支持展开和折叠子项。TreeView通常在文件资源管理器、目录结构和导航菜单等应用程序中使用。

以下是一个简单的TreeView的XAML示例，它使用HierarchicalDataTemplate来定义每个数据项和其子项的呈现方式：

<TreeView ItemsSource="{Binding Departments}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Employees}">
            <TextBlock Text="{Binding Name}" />
            <HierarchicalDataTemplate.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}" />
                </DataTemplate>
            </HierarchicalDataTemplate.ItemTemplate>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>
1
2
3
4
5
6
7
8
9
10
11
12

此代码将一个名为Departments的部门集合绑定到TreeView的ItemsSource属性上，并使用HierarchicalDataTemplate对每个部门及其下属员工进行呈现。在这个例子中，我们使用了一个TextBlock来呈现每个部门的名称，并使用嵌套的HierarchicalDataTemplate来呈现每个部门的下属员工名称。

6.TabControl

TabControl是一种允许用户将不同视图放在不同选项卡页面上的控件。它允许组织和管理多个相关视图，并且只显示当前活动选项卡的内容。

以下是一个简单的TabControl的XAML示例，它包含两个选项卡页，并使用ContentPresenter来呈现每个选项卡页的内容：

<TabControl>
    <TabItem Header="Page1">
        <ContentPresenter Content="{Binding Page1Content}" />
    </TabItem>
    <TabItem Header="Page2">
        <ContentPresenter Content="{Binding Page2Content}" />
    </TabItem>
</TabControl>
1
2
3
4
5
6
7
8

该代码定义了一个TabControl，其中包含两个选项卡页。每个选项卡使用ContentPresenter来呈现其内容，并通过绑定到ViewModel中的Page1Content和Page2Content属性来获取内容。

总结

这些控件都是用于在WPF应用程序中呈现数据的控件。它们之间的主要区别在于其用途、功能、视觉外观和自定义选项。可以根据的需求和数据类型来选择适当的控件：

如果需要简单地显示一个数据项集合，则可以使用ItemsControl或ListView；
如果需要支持选择功能，则可以使用ListBox；
如果需要以表格形式查看或编辑数据，则应该使用DataGrid；
如果需要显示具有层次结构的数据，则应该使用TreeView；
如果需要将不同视图放在不同选项卡页面上，则应该使用TabControl。