首页 > 解决方案 > 使用复选框创建 WPF Windows 资源管理器树视图

问题描述

我正在尝试创建一个 WPF Windows 资源管理器树视图文件浏览器,其中包含用于选择多个文件的复选框。复选框应仅查看文件。像这样 在此处输入图像描述

我在 WPF 方面没有太多经验,我很难开始。

谢谢。

标签: c#wpftreeviewfile-browser

解决方案


我会给你一个最简单的想法,关于如何实现它。考虑两个类FolderFile(我已经实现了自己的简单类以简化示例):

public class Folder
{
    public List<Folder> Folders { get; set; } = new();

    public List<File> Files { get; set; } = new();


    public override string ToString() => Name;
    public string Name { get; set; }
}

public class File
{
    public string Name { get; set; }
    
    public override string ToString() => Name;
}

你会有这种MultiselectTreeView实现:

public class MultiSelectTree: TreeView
{
    public List<File> SelectedFiles { get; set; } = new();
    
    public void AddItem(object item)
    {
        if (item is Folder folder)
        {
            var root = FormFolderTreeItem(folder);
            Items.Add(root);
        }

        if (item is File file)
        {
            var f = FormFileTreeItem(file);
            Items.Add(f);
        }
    }

    private TreeViewItem FormFolderTreeItem(Folder folder)
    {
        var treeItem = new TreeViewItem { Header = folder };

        foreach (var subFolderItem in folder.Folders.Select(FormFolderTreeItem))
        {
            treeItem.Items.Add(subFolderItem);
        }

        foreach (var file in folder.Files.Select(FormFileTreeItem))
        {
            treeItem.Items.Add(file);
        }
        
        return treeItem;
    }
    
    private TreeViewItem FormFileTreeItem(File file)
    {
        var treeItem = new TreeViewItem ();
        // wrap Files in a checkbox and set this checkbox as a content of a TreeViewItem
        var checkBox = new CheckBox { Content = file };
        treeItem.Header = checkBox;
        
        // Subscribe for the checked event
        // When the event triggers - add file to the SelectedFiles
        checkBox.Checked += (sender, args) =>
        {
            if (sender is CheckBox chb)
            {
                SelectedFiles.Add((File)chb.Content);
            }
            args.Handled = true;
        };
        
        // Just the opposite here
        checkBox.Unchecked += (sender, args) =>
        {
            if (sender is CheckBox chb)
            {
                SelectedFiles.Remove((File)chb.Content);
            }
            args.Handled = true;
        };

        return treeItem;
    }
}

然后,您可以使用属性访问您选择的文件SelectedFiles

以下是使用示例(Tree 是 的实例MultiSelectTree):

var firstRoot = new Folder { Name = "Root" };
var secondRoot = new Folder {Name = "Second Root"};
        
firstRoot.Folders.Add(new Folder { Name = "Sub folder"});
        
secondRoot.Files.AddRange(new []
{
     new File {Name = "First file" },
     new File {Name = "Second file" }
});
        
Tree.AddItem(firstRoot);
Tree.AddItem(secondRoot);

结果你会得到这个:TreeView with checkboxes and multiselect

现在您必须弄清楚如何调整您已经在设计 WPF TreeView 文件资源管理器中使用的示例


推荐阅读