WPF style triggers on a TreeView?

Question

I have the following treeview defined in my xaml:

        <TreeView Name="PST_TreeView"
              Grid.Row="0"
              Grid.Column="0"
              Width="Auto"
              Height="Auto"
              HorizontalAlignment="Stretch"
              VerticalAlignment="Stretch"
              ItemsSource="{Binding SitesCollection}"
              ItemTemplate="{StaticResource SitesTemplate}"
              Style="{StaticResource TreeViewStyleBasic}" />

With Resource bindings targeting my resources file:

    <Style x:Key="TreeViewStyleBasic" TargetType="TreeView">
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="BorderBrush" Value="{DynamicResource TitleBarButtons_BorderBrush}" />
    <Setter Property="BorderThickness" Value="0 0 2 0" />
</Style>

<Style x:Key="TreeViewItemStyle_CatNodes" TargetType="{x:Type TextBlock}">
    <Setter Property="Foreground" Value="Snow" />
    <Setter Property="FontFamily" Value="Calibri" />
    <Setter Property="FontSize" Value="16" />
    <Setter Property="FontWeight" Value="Normal" />
    <Setter Property="TextAlignment" Value="Left" />
</Style>

<Style x:Key="TreeViewItemStyle_ChildNodes" TargetType="{x:Type TextBlock}">
    <Setter Property="Foreground" Value="Snow" />
    <Setter Property="FontFamily" Value="Calibri" />
    <Setter Property="FontSize" Value="14" />
    <Setter Property="FontWeight" Value="Normal" />
    <Setter Property="FontStyle" Value="Italic" />
    <Setter Property="TextAlignment" Value="Left" />
</Style>

<DataTemplate x:Key="VolumeInfoDataTemplate">
    <StackPanel Orientation="Horizontal">
        <TextBlock Width="{TemplateBinding Width}"
                   Height="{TemplateBinding Height}"
                   Margin="5"
                   Style="{DynamicResource TreeViewItemStyle_ChildNodes}"
                   Text="{Binding VolumeName}" />
    </StackPanel>
</DataTemplate>

<HierarchicalDataTemplate x:Key="SitesTemplate"
                          ItemsSource="{Binding VolumesList}"
                          ItemTemplate="{StaticResource VolumeInfoDataTemplate}">
    <StackPanel Orientation="Horizontal">
        <TextBlock Width="{TemplateBinding Width}"
                   Height="{TemplateBinding Height}"
                   Margin="5"
                   Style="{DynamicResource TreeViewItemStyle_CatNodes}"
                   Text="{Binding SiteName}" />
    </StackPanel>
</HierarchicalDataTemplate>

The xaml and resource look ups above work find and as expected.

How might I employ triggers to extend my style definitions to say for example handle the 'IsSelected' event so that the selected tree node will have a slate grey border and a light grey background?

RESEARCH: Kind of thing I am going for.

UPDATE: There is no IsSelected property on the TreeView, however TreeViewItem does has one defined.

Gian Paolo Tessitore Gian Paolo Tessitore · Accepted Answer · 2012-04-11T15:36:25

Try this:

  <DataTemplate x:Key="VolumeInfoDataTemplate"> 
        <StackPanel Orientation="Horizontal"> 
            <TextBlock Width="{TemplateBinding Width}" 
                       Height="{TemplateBinding Height}" 
                       Margin="5" 
                       Style="{DynamicResource TreeViewItemStyle_ChildNodes}" 
                       Text="{Binding VolumeName}"
                       Name="Tb" /> 
        </StackPanel> 
        <DataTemplate.Triggers>
             <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource    AncestorType=TreeViewItem}}" Value="True">
                  <Setter TargetName="Tb" Property="Background" Value="LightGray"/>
             </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>

WPF style triggers on a TreeView?

1 Answers