HierarchicalDataTemplate （一）

最新推荐文章于 2024-03-07 20:41:09 发布

清风ai明月

最新推荐文章于 2024-03-07 20:41:09 发布

阅读量4.1k

点赞数

分类专栏： WPF

本文链接：https://blog.youkuaiyun.com/i1tws/article/details/93538475

版权

WPF 专栏收录该内容

32 篇文章

订阅专栏

能够帮助层级控件显示层级数据的模板是HierarchicalDataTemplate

一般常用于TreeView控件和MenuItem控件，显示层级数据。

数据类：

using System.Collections.Generic;

namespace 优快云WpfApp.com.data
{
    //公司数据
    public class CompanyData
    {
        public string Name { get; set; }
        public List<DempartmentData> DempartmentDatas { get; set; }
    }

    //部门数据
    public class DempartmentData
    {
        public string Name { get; set; }
        public List<EmployeeData> EmployeeDatas { get; set; }
    }

    //员工
    public class EmployeeData
    {
        public string Name { get; set; }
    }

}

窗口前台：

<Window x:Class="优快云WpfApp.TreeViewWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:优快云WpfApp" xmlns:da="clr-namespace:优快云WpfApp.com.data"
        mc:Ignorable="d"
        Title="TreeViewWindow" Height="450" Width="800">
    <Window.Resources>
        
        <HierarchicalDataTemplate DataType="{x:Type da:CompanyData}" ItemsSource="{Binding Path=DempartmentDatas}">
            <TextBlock Text="{Binding Name}"/>
        </HierarchicalDataTemplate>
        
        <HierarchicalDataTemplate DataType="{x:Type da:DempartmentData}" ItemsSource="{Binding Path=EmployeeDatas}">
            <TextBlock Text="{Binding Name}"/>
        </HierarchicalDataTemplate>
        
        <HierarchicalDataTemplate DataType="{x:Type da:EmployeeData}">
            <TextBlock Text="{Binding Name}"/>
        </HierarchicalDataTemplate>
        
    </Window.Resources>
    <Grid>
        <TreeView x:Name="treeView" HorizontalAlignment="Left" Height="350" Margin="30,30,0,0" VerticalAlignment="Top" Width="440"/>
        <Button x:Name="button" Content="测试" HorizontalAlignment="Left" Margin="575,61,0,0" VerticalAlignment="Top" Width="105" Height="69" Click="Button_Click"/>

    </Grid>
</Window>

解析说明：

引用了数据类的名称空间 xmlns:da="clr-namespace:优快云WpfApp.com.data"

DataType指定了HierarchicalDataTemplate模板用哪种数据类型

ItemsSource指定下一层显示哪些数据

内容指定了一个TextBlock，并绑定了需要显示当前指定类型数据中的属性

窗口后台：

using 优快云WpfApp.com.data;
using System.Collections.Generic;
using System.Windows;

namespace 优快云WpfApp
{
    /// <summary>
    /// TreeViewWindow.xaml 的交互逻辑
    /// </summary>
    public partial class TreeViewWindow : Window
    {
        public TreeViewWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            List<EmployeeData> employeeDatas = new List<EmployeeData>();
            employeeDatas.Add(new EmployeeData { Name = "员工1"});
            employeeDatas.Add(new EmployeeData { Name = "员工2" });


            List<DempartmentData> departmentDatas = new List<DempartmentData>();
            departmentDatas.Add(new DempartmentData { Name = "部门1", EmployeeDatas = employeeDatas });
            departmentDatas.Add(new DempartmentData { Name = "部门2", EmployeeDatas = employeeDatas });

            List<CompanyData> companyDatas = new List<CompanyData>();
            companyDatas.Add(new CompanyData { Name = "公司1", DempartmentDatas = departmentDatas });
            companyDatas.Add(new CompanyData { Name = "公司2", DempartmentDatas = departmentDatas });

            treeView.ItemsSource = companyDatas;
        }
    }
}

效果图：