MVVM - select item in TreeView and show its properties on a ListView using binding

Question

I'm new to MVVM. I created a TreeView with hierarchy of 3 levels: level1: Program, level2: Action, level3: Position. I also created a ListView under the TreeView (see xaml) . Right now the items of the ListView are not bound to anything (the names "Type", "Speed" are only placeholders.)

When selecting an item from level2 (Action) in the TreeView, i'd like to see it's properties (type, speed) appear on the ListView below.

Is there a way to do it through a change in the View only (xaml), without using code in the ViewModel ? maybe there's a way to use a certain binding, that can be changed when pressing on the item in the TreeView?

xaml (model):

       <TreeView 
            Grid.Row="0"
            x:Name="MainTreeView"
            HorizontalAlignment="Stretch"
            Margin="10" 
            VerticalAlignment="Stretch"
            ItemsSource="{Binding Programs}">
            <TreeView.ItemTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding Actions}" DataType="{x:Type VM:ProgramVM}">
                    <Label Content="{Binding ProgramName}"/>
                    <HierarchicalDataTemplate.ItemTemplate>
                        <HierarchicalDataTemplate ItemsSource="{Binding Poses}" DataType="{x:Type VM:ActionVM}">
                            <Label Content="{Binding Actiontype}"/>
                            <HierarchicalDataTemplate.ItemTemplate>
                                <DataTemplate DataType="{x:Type VM:PositionVM}">
                                    <Label Content="{Binding PosName}"/>
                                </DataTemplate>
                            </HierarchicalDataTemplate.ItemTemplate>
                        </HierarchicalDataTemplate>
                    </HierarchicalDataTemplate.ItemTemplate>
                </HierarchicalDataTemplate>

            </TreeView.ItemTemplate>
        </TreeView>
        <ListView Grid.Row="1" Margin="10" Name="lvUsers">
            <ListView.View>
                <GridView>

                    <GridViewColumn Header="Type" Width="100" DisplayMemberBinding="{Binding Type}" />
                    <GridViewColumn Header="Speed" Width="100" DisplayMemberBinding="{Binding Speed}" />
                </GridView>
            </ListView.View>
        </ListView>

You want to show details of selected item or items? If you want one item then `ListView` is an overkill. Use a container (Grid or StackPanel) and add `TextBlocks` for Type and Speed. BTW, TreeView has a [SelectedItem](https://learn.microsoft.com/en-us/dotnet/api/system.windows.controls.treeview.selecteditem?redirectedfrom=MSDN&view=netframework-4.8#System_Windows_Controls_TreeView_SelectedItem) property, you can use that to get the info out. — XAMlMAX, Nov 21 '19 at 13:47

Grim · Answer 1 · 2019-11-21T15:24:07.283

This is a well known issue with the treeview in WPF. You have to create an 'is selected' property for each object in your tree so that you know what the user has chosen, then you can just show the selected object in your listview. It's been a while since I played with a treeview, but here are some of the links that I think helped me in the past.

Data binding to SelectedItem in a WPF Treeview

WPF MVVM TreeView SelectedItem

MVVM - select item in TreeView and show its properties on a ListView using binding

1 Answers1