前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >C#-TreeView

C#-TreeView

作者头像
kdyonly
发布2023-03-03 18:59:53
6740
发布2023-03-03 18:59:53
举报
文章被收录于专栏:个人编程笔记

浏览量 3

TreeView是一个树形结构的控件,能够表现出对象的层级关系,比如文件夹目录展示经常使用。

新建WPF应用程序,在界面上添加TreeView控件,最直接简单的用法是在TreeView下添加TreeViewItem节点,然后设置它的header,如果你的层级关系固定,内容比较少,可以直接采用这种方式。

代码语言:javascript
复制
<TreeView>
    <TreeViewItem Header="食物">
        <TreeViewItem Header="水果">
            <TreeViewItem Header="苹果"></TreeViewItem>
            <TreeViewItem Header="梨子"></TreeViewItem>
        </TreeViewItem>
        <TreeViewItem Header="蔬菜">
            <TreeViewItem Header="大白菜"></TreeViewItem>
            <TreeViewItem Header="空心菜"></TreeViewItem>
        </TreeViewItem>
    </TreeViewItem>
</TreeView>

我们还可以使用绑定的方式进行数据展示,在model中创建TreeNode类,写法如下,通常我们需要做属性变更通知,需要继承INotifyPropertyChanged,当然你可以写一个基类(比如:NotifyPropertyObject )去继承这个接口,然后所有需要变更通知的类都继承于这个基类,就像下面的代码一样。

代码语言:javascript
复制
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;

namespace Demo.Base
{
    public class NotifyPropertyObject : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler? PropertyChanged;
        public void RaisePropertyChanged([CallerMemberName] String propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}
代码语言:javascript
复制
using Demo.Base;
using System.Collections.ObjectModel;

namespace Demo.Model
{
    public class TreeNode : NotifyPropertyObject
    {
        private string m_Name;
        public string Name
        {
            get { return m_Name; }
            set
            {
                m_Name = value;
                this.RaisePropertyChanged(Name);
            }
        }
        private bool m_IsChecked = false;

        public bool IsChecked
        {
            get { return m_IsChecked; }
            set
            {
                m_IsChecked = value;
                this.RaisePropertyChanged("IsChecked");
            }
        }
        private ObservableCollection<TreeNode> m_Children = new ObservableCollection<TreeNode>();
        public ObservableCollection<TreeNode> Children
        {
            get
            {
                return m_Children;
            }
            set
            {
                m_Children = value;
                this.RaisePropertyChanged("Children");
            }
        }
    }
}

接下来,我们可以在ViewModel里头进行数据处理逻辑编写,并将界面的DataContext绑定到你的逻辑处理类中,这样我们就能够在界面上显示我们需要的数据了。

代码语言:javascript
复制
using Demo.Base;
using Demo.Model;
using System.Collections.ObjectModel;

public class TreeViewDemoViewModel: NotifyPropertyObject
{
    private ObservableCollection<TreeNode> m_TreeNodes = new ObservableCollection<TreeNode>();
    public ObservableCollection<TreeNode> TreeNodes
    {
        get
        {
            return m_TreeNodes;
        }
        set
        {
            m_TreeNodes = value;
            this.RaisePropertyChanged("TreeNodes");
            
        }
    }
    public TreeViewDemoViewModel() {
        
        TreeNode fruits = new TreeNode();
        fruits.Name = "水果";
        TreeNode apple = new TreeNode();
        apple.Name = "苹果";
        TreeNode Pear = new TreeNode();
        Pear.Name = "梨子";
        fruits.Children.Add(apple);
        fruits.Children.Add(Pear);

        TreeNode vegetables = new TreeNode();
        vegetables.Name = "蔬菜";
        TreeNode cabbage = new TreeNode();
        cabbage.Name = "卷心菜";
        TreeNode waterspinach = new TreeNode();
        waterspinach.Name = "空心菜";
        vegetables.Children.Add(cabbage);
        vegetables.Children.Add(waterspinach);

        TreeNode foods = new TreeNode();
        foods.Name = "食物";
        foods.Children.Add(fruits);
        foods.Children.Add(vegetables);

        TreeNodes.Add(foods);
    }
}
代码语言:javascript
复制
<TreeView ItemsSource="{Binding TreeNodes}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Children}">
            <Label Content="{Binding Name}"/>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>
代码语言:javascript
复制
using Demo.View;
using System.Windows;

namespace TreeViewDemo
{
    /// <summary>
    /// Interaction logic for App.xaml
    /// </summary>
    public partial class App : Application
    {
        protected override void OnStartup(StartupEventArgs e)
        {
            TreeViewDemoView treeViewDemoView = new TreeViewDemoView();
            TreeViewDemoViewModel treeViewDemoViewModel = new TreeViewDemoViewModel();
            treeViewDemoView.DataContext = treeViewDemoViewModel;
            treeViewDemoView.Show();
        }
    }
}

效果预览

完整代码

https://gitee.com/rdonly/demo

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-06-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档