Comment modifier une image d'un nœud dans une arborescence WPF lorsque le nœud est développé ou réduit?

Question

Mon Xaml ressemble à ceci:

<TreeView Name="mainTree" ItemsSource="{Binding Folders}"> 
    <TreeView.Resources> 
    <Style TargetType="{x:Type TreeViewItem}"> 
     <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" /> 
     <Style.Triggers> 
     <!-- ??? --> 
     </Style.Triggers> 
    </Style> 
    <HierarchicalDataTemplate DataType="{x:Type local:FolderNode}" ItemsSource="{Binding Children}" > 
     <StackPanel Orientation="Horizontal" Name="myPanel"> 
     <Image x:Name="treeImg" Width="16" Height="16" Source="Images/vsfolder_closed.png"/> 
     <TextBlock Text="{Binding Name}" /> 
     </StackPanel> 
     <HierarchicalDataTemplate.Triggers> 
     <!-- ??? --> 
     </HierarchicalDataTemplate.Triggers> 
    </HierarchicalDataTemplate> 
    </TreeView.Resources> 
</TreeView> 

Maintenant, ce que je voudrais est si un treenode est étendu, la source change d'image aux images/vsfolder_open.png ...

Quelle serait la meilleure façon pour faire ça?

Merci d'avance!

Answer 1

Ajoutez un DataTrigger au HierarchicalDataTemplate. Puisque vous avez une liaison bidirectionnelle à la propriété IsExpanded dans le ViewModel, vous pouvez lier à celle-ci et utiliser TargetName en raison de la portée de nom dans un DataTemplate.

<HierarchicalDataTemplate.Triggers> 
    <DataTrigger Binding="{Binding IsExpanded}" Value="True"> 
     <Setter TargetName="treeImg" 
       Property="Source" 
       Value="Images/vsfolder_open.png"/> 
    </DataTrigger> 
</HierarchicalDataTemplate.Triggers>