如何在一个 TreeView 分支上绑定两个不同的集合 [英] How to bind two different collection at one TreeView branch

问题描述

我正在编写一个基于 MVVM 模式的 WpfCustomControlLibrary.我有一个包含 TreeView 对象的视图，它必须处理相当扩展的模型.

I'm writing a WpfCustomControlLibrary based on MVVM pattern. I have a View contains TreeView object which must handle quite expanded model.

型号:

    public class TreeBranchesView
    {
        public ObservableCollection<DiscountGroup> DiscoutGroups { get; set; }
    }

public class DiscountGroup : ViewModelBase
{
    public int ID { get; set; }
    public string GroupName { get; set; }
    public decimal DefaultValue { get; set; }
    private bool _isCheckedInMenu;
    public bool IsCheckedInMenu
    {
        get { return _isCheckedInMenu; }
        set
        {
            _isCheckedInMenu = value;
            OnPropertyChanged("IsCheckedInMenu");
        }
    }

    public ObservableCollection<SubGroup> SubGroups { get; set; }
    public ObservableCollection<ArticleGroup> ArticleGroup { get; set; }
}

public class SubGroup : ViewModelBase
{
    public int ID { get; set; }
    public int SubGroupParent { get; set; }
    public string Name { get; set; }
    public decimal DefaultValue { get; set; }
    public ObservableCollection<ArticleGroup> ArticleGroup { get; set; }
}

 public class ArticleGroup
{
    public int ArticleID { get; set; }
    public int DiscountGroup { get; set; }
    public int SubGroup { get; set; }
}

我的主要目标是实现以下情况:

My main goal is to achieve below situation:

-DiscountGroup
--ArticleGroup
--ArticleGroup
-DiscountGroup
--ArticleGroup
--ArticleGroup
--SubGroup
--SubGroup
--SubGroup
---ArticleGroup
---ArticleGroup
-DiscountGroup
-DiscountGroup
--SubGroup

文章组和子组可以位于同一级别.实际上我的 xaml 看起来像:

ArticleGroup and SubGroups can be located at the same level. Actualy my xaml looks like:

<GroupBox Grid.Column="0" Grid.Row="0" Header="MainTree">
     <StackPanel Orientation="Horizontal">
          <TreeView x:Name="MainTreeView" Grid.Column="0" Grid.Row="0" ItemTemplate="{StaticResource level1}" 
           ItemsSource="{Binding TreeBranches}" />
      </StackPanel>
</GroupBox>

所有模板都存储在 windows.resources 下

all templates are stored under windows.resources

<Window.Resources>
        <HierarchicalDataTemplate x:Key="level2" ItemsSource="{Binding ArticleGroup}" >
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Name}" />
            </StackPanel>
        </HierarchicalDataTemplate> 
        <HierarchicalDataTemplate x:Key="level1" ItemsSource="{Binding SubGroups}" ItemTemplate="{StaticResource level2}" >
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding GroupName}" />
                </StackPanel.ContextMenu>
            </StackPanel>
        </HierarchicalDataTemplate>
</Window.Resources>

我有以下问题 - TreeView 必须在同一级别显示两个不同的集合，上面的代码 不允许这样做，此时它只处理一个.重要的是，这些集合的类型不同.

I have the following problem - TreeView must show two different collection at the same level and above code doesn't allow to do it , at this moment it handle only one. What is important, these collections don't have the same type.

推荐答案

一种解决方案是为将放置在树中的项目创建一个基类，比如 TreeNode.这个基类有这个接口:

One solution is to create a base class, lets say TreeNode, for the items which will be placed in the tree. This base class has this interface:

public interface ITreeNode
{
    ObservableCollection<ITreeNode> Children { get; set; }
    string Name { get; set; }
    ITreeNode Parent { get; set; }
    void AddChild(ITreeNode child);
    void RemoveChild(ITreeNode child);
}

使需要出现在树上的类继承自TreeNode类:

Make the classes that need to appear on the tree to be inherited from the TreeNode class:

public class DiscountGroup: TreeNode{};
public class SubGroup: TreeNode {}
public class ArticleGroup: TreeNode{}

然后为您的树定义一个根，例如:

Then define a root for your tree like:

Root = new TreeNode() {Name="Root"};

添加一些分支

var dg1 = new DiscountedGroup(){Name = "DG1"}; 
var dg1 = new DiscountedGroup(){Name = "DG1"}; 
Root.AddChild(dg1);
Root.AddChild(dg2};

添加一些子到分支

dg1.AddChild(new ArticleGroup());
dg1.AddChild(new SubGroup());
dg2.AddChild(new ArticleGroup());
dg2.Add(new SubGroup());

您可以添加任意数量的图层.然后，在 Xaml 中，将 root.Children 绑定到您的 TreeView.TreeViewItem.ItemsSource.

You can add as many layers as you like. Then, In Xaml, bind root.Children to your TreeView.TreeViewItem.ItemsSource.

确保在 Xaml=>TreeViewItem.Resources 中为具有子项的对象(或类)定义了 HierarchicalDataTemplate(否则只使用 DataTemplate)并使用 TreeViewItem.ItemTemplateSelector 为每个类检测正确的数据模板.

Make sure in Xaml=>TreeViewItem.Resources you have HierarchicalDataTemplate defined for Objects (or classes) which have children (otherwise just use DataTemplate) and use TreeViewItem.ItemTemplateSelector for detecting right data template for each class.

里面有更多的细节，我试着大致解释一下.

There are more details into it, I tried to explain generally.

这篇关于如何在一个 TreeView 分支上绑定两个不同的集合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！