Nesting WPF HierarchicalDataTemplates in a treeview

Question

I am parsing JSON and displaying it in a treeview as outlined in this question...

How to display JSON in WPF TreeView

But I ran into JSON that has nested collections and my code will not display it. I can display a String or a list of sub items, but if one of those sub items also contains its own sub items, they will not display.

How do I display n Number of nested items?

Here is my XAML...

<Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfApp2"
    Title="Window1" Height="300" Width="300">

<Window.Resources>
    <local:ValConv x:Key="valConv"/>
</Window.Resources>
<Grid>
    <TreeView x:Name="tView">

        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Value, Converter={StaticResource valConv}}" >
                <HierarchicalDataTemplate.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" Foreground="Red"/>
                </DataTemplate>
            </HierarchicalDataTemplate.ItemTemplate>
            <TextBlock Text="{Binding Key}"/>

        </HierarchicalDataTemplate>

    </TreeView.ItemTemplate>            

</TreeView>
</Grid>

And here is an example of the JSON.

Answer 1

you must have nested Template...

<!--Based treeview item style-->

    <Style x:Key="TreeItemItemStyle" TargetType="{x:Type TreeViewItem}">

        <Setter Property="Foreground" Value="{DynamicResource CbrForegroundBrush}" />

        <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />

        <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />

        <Style.Triggers>

            <Trigger Property="IsSelected" Value="True">

                <Setter Property="FontWeight" Value="Bold" />

            </Trigger>

        </Style.Triggers>

    </Style>



    <!--DRIVE treeview item style-->

    <Style x:Key="DriveItemStyle" TargetType="{x:Type TreeViewItem}" BasedOn="{StaticResource TreeItemItemStyle}">

    </Style>



    <!--FOLDER treeview item style-->

    <Style x:Key="DirectoryItemStyle" TargetType="{x:Type TreeViewItem}" BasedOn="{StaticResource TreeItemItemStyle}">

        <Setter Property="FontStyle" Value="Normal"/>

    </Style>



    <!--FILE treeview item style-->

    <Style x:Key="FileItemStyle" TargetType="{x:Type TreeViewItem}" BasedOn="{StaticResource TreeItemItemStyle}">

        <Setter Property="FontStyle" Value="Normal"/>

    </Style>



    <!--treeview item style SELECTOR-->

    <Selectors:SysObjectItemStyleSelector x:Key="SysObjectItemStyleSelector"

        DriveStyle="{StaticResource DriveItemStyle}"

        DirectoryStyle="{StaticResource DirectoryItemStyle}" 

        FileStyle="{StaticResource FileItemStyle}" />



    <!--DRIVE treeview item template-->

    <HierarchicalDataTemplate DataType="{x:Type ViewModels:SysDriveViewModel}" ItemsSource="{Binding Children}">

        <StackPanel Orientation="Horizontal">

            <Image Width="16" Height="16" Margin="3,0"

                   Source="{Binding Path=Type, Converter={x:Static Converters:TypeToImageConverter.Instance}}" />

            <TextBlock Text="{Binding Name}"/>

        </StackPanel>

    </HierarchicalDataTemplate>



    <!--FOLDER treeview item template-->

    <HierarchicalDataTemplate DataType="{x:Type ViewModels:SysDirectoryViewModel}" ItemsSource="{Binding Children}">

        <StackPanel Orientation="Horizontal">

            <Image Width="16" Height="16" Margin="3,0"

                   Source="{Binding Path=Type, Converter={x:Static Converters:TypeToImageConverter.Instance}}" />

            <TextBlock Text="{Binding Name}"/>

        </StackPanel>

    </HierarchicalDataTemplate>



    <!--FILE treeview item template-->

    <DataTemplate DataType="{x:Type ViewModels:SysFileViewModel}">

        <StackPanel Orientation="Horizontal">

            <Image Width="16" Height="16" Margin="3,0" 

                   Source="{Binding Path=Type, Converter={x:Static Converters:TypeToImageConverter.Instance}}" />

            <TextBlock Text="{Binding Name}"/>

        </StackPanel>

    </DataTemplate>

and so on - see samples https://wpf.2000things.com/tag/hierarchicaldatatemplate/