C#•3mo ago

WPF TreeView Fails to load ItemsSource

The control

<UserControl x:Class="XMLViewer.Features.XMLViewer.XmlViewerComponent"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:XMLViewer.Features.XMLViewer" 
             mc:Ignorable="d" 
             d:DataContext="{d:DesignInstance Type=local:XmlViewerViewModel}"
             d:DesignHeight="600" d:DesignWidth="400" >
    
    <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Hidden">
        <StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Items.Name}" />
            <TreeView ItemsSource="{Binding Items}" Height="300">
                <TreeView.ItemTemplate>
                    <HierarchicalDataTemplate DataType="{x:Type local:NodeItem}" ItemsSource="{Binding Children}">
                        <TextBlock Text="{Binding Name}" />
                    </HierarchicalDataTemplate>
                </TreeView.ItemTemplate>
            </TreeView>
            <TextBlock Text="{Binding Text}" Foreground="Gray"/>
        </StackPanel>
    </ScrollViewer>

</UserControl>

<UserControl x:Class="XMLViewer.Features.XMLViewer.XmlViewerComponent"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:XMLViewer.Features.XMLViewer" 
             mc:Ignorable="d" 
             d:DataContext="{d:DesignInstance Type=local:XmlViewerViewModel}"
             d:DesignHeight="600" d:DesignWidth="400" >
    
    <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Hidden">
        <StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Items.Name}" />
            <TreeView ItemsSource="{Binding Items}" Height="300">
                <TreeView.ItemTemplate>
                    <HierarchicalDataTemplate DataType="{x:Type local:NodeItem}" ItemsSource="{Binding Children}">
                        <TextBlock Text="{Binding Name}" />
                    </HierarchicalDataTemplate>
                </TreeView.ItemTemplate>
            </TreeView>
            <TextBlock Text="{Binding Text}" Foreground="Gray"/>
        </StackPanel>
    </ScrollViewer>

</UserControl>

The viewmodel:

namespace XMLViewer.Features.XMLViewer;
public partial class XmlViewerViewModel : ObservableObject {
    [ObservableProperty]
    public NodeItem _items;

    public XmlViewerViewModel() {
        //testing treeview binding
        var test = new NodeItem {
            Name = "Test 1",
            Children = new ObservableCollection<NodeItem> {
            new NodeItem {Name = "Test 1.1" },
            new NodeItem { Name = "Test 1.2" },
        },
        };

        Items = test;
    }

}

namespace XMLViewer.Features.XMLViewer;
public partial class XmlViewerViewModel : ObservableObject {
    [ObservableProperty]
    public NodeItem _items;

    public XmlViewerViewModel() {
        //testing treeview binding
        var test = new NodeItem {
            Name = "Test 1",
            Children = new ObservableCollection<NodeItem> {
            new NodeItem {Name = "Test 1.1" },
            new NodeItem { Name = "Test 1.2" },
        },
        };

        Items = test;
    }

}

3 Replies

SaiyanslayerOP•3mo ago

The NodeItem:

public class NodeItem {
    public string Name { get; set; }
    public ObservableCollection<NodeItem> Children { get; set; }
    
    public NodeItem() {
        Name = "No name";
        Children = new();
    }
    public NodeItem(NModel node) {
        Name = node.Name;
        Children = new();
        foreach (var child in node.Children) { Children.Add(new NodeItem(child)); }
    }
}

public class NodeItem {
    public string Name { get; set; }
    public ObservableCollection<NodeItem> Children { get; set; }
    
    public NodeItem() {
        Name = "No name";
        Children = new();
    }
    public NodeItem(NModel node) {
        Name = node.Name;
        Children = new();
        foreach (var child in node.Children) { Children.Add(new NodeItem(child)); }
    }
}

Furtun•3mo ago

Did you use chatgpt for this? Why is your item list in your view model just one NodeItem? Shouldn't it be a list or an observable collection? Your treeview.itemsource is getting bound to Items property of your view model. But your items property is a singular NodeItem. I've never used treeview before so idk what it expects and this code might be right, but to me it looks wrong and I'd expect items to be a collection (either list or observable collection if you expect it to change)

SaiyanslayerOP•3mo ago

I think you're right, I'll try making that NodeItem a list I think that did it, thanks!

Gaming

Programming

WPF TreeView Fails to load ItemsSource