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

发布时间 2023-10-17 11:28:01作者: 学而时习

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>

这段代码假设有一个名为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>

此代码将一个字符串数组绑定到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>

此代码将一个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>

该代码将一个名为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>

此代码将一个名为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>

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

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

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