CODEWITHSUNDEEP
wpfmvvmtreeview
TheColonel26
TheColonel26

Reputation: 2728

Tree View IsSelected with hierarchical data template

I have found a couple examples of binding an IsSelected Property in the view model. However none of these deal with a TreeView with Hierachical data templates.

My Hierachy is like this

I would like to be able to select multiple VM_Part instances or Multiple VM_Steps under one part. The idea being I can have a context menu and perform various commands on the selected items

<Window x:Class="NameSpace1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:Hipot_Sequence_Editor"
    xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"

    mc:Ignorable="d"
    Title="MainWindow" Height="677.538" Width="896.456">

<Window.DataContext>
    <local:VM_Main></local:VM_Main>
</Window.DataContext>
<Grid>
    <TreeView x:Name="treeView" Grid.Column="1" HorizontalAlignment="Left" Height="628" Margin="10.2,10,0,0" VerticalAlignment="Top" Width="237" Grid.RowSpan="2" ItemsSource="{Binding Parts}">
        <TreeView.Resources>
            <HierarchicalDataTemplate DataType="{x:Type viewModels:VM_Part}" ItemsSource="{Binding VM_Steps}">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding SequenceNumber}" />
                    <TextBlock Text=" - "></TextBlock>
                    <TextBlock Text="{Binding PartNumber}" />
                </StackPanel>
            </HierarchicalDataTemplate>
            <DataTemplate DataType="{x:Type viewModels:VM_Step}">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" />
                </StackPanel>
            </DataTemplate>
        </TreeView.Resources>
    </TreeView>
</Grid>

This seems to me the closet example to what I need. I tried the first answered suggested

<TreeView.Resources>
    <Style TargetType="TreeViewItem">
        <Setter Property="IsSelected"
                Value="{Binding Path=IsSelected, Mode=TwoWay}" />
    </Style>
</TreeView.Resources>

However it seems that this code assumes IsSelected is in VM_Main and not in VM_Part or VM_Step

Upvotes: 1

Views: 1542

Answers (1)

ASh
ASh

Reputation: 35733

each TreeViewItem in a hierarchy

  • VM_Part TreeViewItem
    • VM_Step TreeViewItem
    • VM_Step TreeViewItem
    • VM_Step TreeViewItem

has its own DataContext (VM_Part or VM_Step)

so if VM_Part and VM_Step have IsSelected property, then style for TreeViewItem is defined correctly

<Style TargetType="TreeViewItem">
    <Setter Property="IsSelected"
            Value="{Binding Path=IsSelected, Mode=TwoWay}" />
</Style>

however, multiselection in TreeView is probably simpler with CheckBoxes added to item template and bound to view model IsSelected property:

<HierarchicalDataTemplate DataType="{x:Type viewModels:VM_Part}" ItemsSource="{Binding VM_Steps}">
    <StackPanel Orientation="Horizontal">
        <CheckBox IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}" />
        <TextBlock Text="{Binding SequenceNumber}" />
        <TextBlock Text=" - "/>
        <TextBlock Text="{Binding PartNumber}" />
    </StackPanel>
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type viewModels:VM_Step}">
    <StackPanel Orientation="Horizontal">
        <CheckBox IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}" />
        <TextBlock Text="{Binding Name}" />
    </StackPanel>
</DataTemplate>

Upvotes: 2

Related Questions