Question

I’m trying to bind an ObservableCollection to a treeview in WPF. It does kind-of work but not quite the way I thought it would.

This is the binding I have setup

    <TreeView Height="250" ItemsSource="{Binding Path=TheUsers}" VerticalAlignment="Bottom" Width="500" Margin="0,39,0,0">
        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Path=Permission}">
                <TextBlock Text="{Binding}" />
            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>
    </TreeView> 

This is the collection it is binding to:

    ObservableCollection<UserViewModel> theUsers;
    public ObservableCollection<UserViewModel> TheUsers
    {
        get
        {
            return theUsers;
        }
        set
        {
            theUsers = value;
            OnPropertyChanged("TheUsers");
        }
    }

This is the object in the collection:

public class UserViewModel
{     
    string userName = null;
    public string UserName
    {
        get
        {
            return userName;
        }
        set
        {
            userName = value;
            OnPropertyChanged("UserName");
        }
    }

    int permCount = 0;
    public int PermCount
    {
        get
        {
            return permCount;
        }
        set
        {
            permCount = value;
            OnPropertyChanged("PermCount");
        }
    }

    List<string> permission = null;
    public List<string> Permission
    {
        get
        {
            return permission;
        }
        set
        {
            permission = value;
            OnPropertyChanged("Permission");
        }
    }

This is what it displays

What I would like it to do is display the UserName for UserViewModel and the Permissions List<string> items as the children. What is the proper way to do this ?

Thanks in Advance!

Answer 1

You should be able to do this with a HierarchicalDataTemplate in addition to a normal DataTemplate:

<TreeView Height="250" ItemsSource="{Binding Path=TheUsers}" VerticalAlignment="Bottom" Width="500" Margin="0,39,0,0">
    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type local:UserViewModel}" ItemsSource="{Binding Permission}">
            <TextBlock Text="{Binding Path=UserName}" />
        </HierarchicalDataTemplate>
        <DataTemplate DataType="{x:Type sys:String}" >
            <TextBlock Text="{Binding}" />
        </DataTemplate>
    </TreeView.Resources>
</TreeView> 

Add the following namespaces to your control/window:

xmlns:local="clr-namespace:WhateverYourAssemblyNamespaceIs"
xmlns:sys="clr-namespace:System;assembly=mscorlib"