了解WPF控件：TreeView常用属性与用法（十五）

引言

• TreeView控件是WPF（Windows Presentation Foundation）中用于显示分层数据的常用控件。这个控件允许用户以树形结构展示数据，使得数据更加清晰易懂。在创建文件浏览器、组织结构图等应用程序时，TreeView控件非常有用。

TreeView控件常用属性

1.Items属性

• tems属性是用来获取或设置TreeView中的项的集合。你可以通过这个属性动态添加或删除节点。例如，你可以创建一个新的TreeViewItem对象，设置它的相关属性，然后将其添加到TreeView的Items集合中。

2.ItemsSource属性

• ItemsSource属性是绑定到TreeView中数据的源。通过将数据源绑定到这个属性，可以实现数据的自动加载和更新。你可以将任何实现了IEnumerable接口的对象绑定到这个属性，例如List、Array、ViewModel等。

3.SelectedItem属性

• SelectedItem属性是用来获取或设置当前被选中的项的。你可以通过这个属性监听节点选中事件。当用户选择一个节点时，SelectedItem属性将被设置为对应的TreeViewItem对象。

4.Header属性

• Header属性是用来获取或设置TreeView项的头部内容。你可以通过这个属性自定义节点的显示内容。你可以设置Header属性的值为一个字符串、一个控件或者一个布局。

5.Tag属性

• Tag属性用于存储与TreeView项相关的附加信息。你可以在代码中访问和操作这些信息。例如，你可以将一个对象或者一个数据值设置为某个TreeViewItem的Tag，然后在需要的时候通过这个Tag获取数据。

6.ContextMenu属性

• ContextMenu属性是用来获取或设置与TreeView项关联的上下文菜单的。你可以自定义右键菜单的内容和行为。例如，你可以创建一个ContextMenu，然后将其设置为TreeViewItem的ContextMenu属性。

• 下面来写个例子，右键菜单执行操作，这里用到命令，首先需要安CommunityToolkit.Mvvm：

using CommunityToolkit.Mvvm.Input;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Windows;
using System.Windows.Input;

namespace WpfCommonControls
{
    /// 

    /// TreeViewWindow.xaml 的交互逻辑
    /// 
    public partial class TreeViewWindow : Window
    {
        public TreeViewWindow()
        {
            InitializeComponent();

            // 绑定上下文
            DataContext = new TreeViewModel();
        }

    }

    /// 

    /// 树节点实体类
    /// 
    public class TreeNodeModel
    {
        public string Name { get; set; }=string.Empty;
        public ObservableCollection Children { get; set; } = new ObservableCollection();
    }

    /// 

    /// 树ViewModel
    /// 
    public class TreeViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler? PropertyChanged;
        protected virtual void OnPropertyChanged(string propertyName) => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));


        private string _textBlockMsg = "这里显示相关提示操作";
        public string TextBlockMsg {
            get => _textBlockMsg;
            set
            {
                _textBlockMsg = value;
                OnPropertyChanged(nameof(TextBlockMsg));
            }
        }    

        private ObservableCollection _treeNodes=new ObservableCollection ();
        public ObservableCollection TreeNodes
        {
            get => _treeNodes;
            set
            {
                _treeNodes = value;
                OnPropertyChanged(nameof(TreeNodes));
            }
        }

        public ICommand EditCommand { get; set; }
        public ICommand DeleteCommand { get; set; }

        public TreeViewModel()
        {
            // 初始化数据源
            TreeNodes = new ObservableCollection
            {
                new TreeNodeModel { Name = "根节点",
                    Children = new ObservableCollection
                    {
                        new TreeNodeModel { Name = "子节点1",Children=new ObservableCollection
                        {
                             new TreeNodeModel { Name = "子节点1-1" },
                              new TreeNodeModel { Name = "子节点1-2" }
                        }
                        },
                        new TreeNodeModel { Name = "子节点2" }
                    }
                }
            };

            EditCommand = new RelayCommand(OnEditNode);
            DeleteCommand = new RelayCommand(OnDeleteNode);
        }

        private void OnEditNode(TreeNodeModel? node)
        {
            // 编辑节点的逻辑
            TextBlockMsg = $"编辑节点: {node?.Name}";
        }

        private void OnDeleteNode(TreeNodeModel? node)
        {
            // 删除节点的逻辑
            TextBlockMsg = $"删除节点: {node?.Name}";
        }

    }
}

上述代码，动态绑定TreeView数据源，以及ContextMenu菜单属性，相关操作取值，运行效果如下图：

公众号“点滴分享技术猿”