Change the color of a specific item in Treeview WPF

Question

I have a Treeview in my WPF application. On the fly, at runtime, if a Tree element meets a certain condition, it should change its Font color from black to red.!

XAML

 <TreeView Grid.Column="0" Grid.Row="0" HorizontalAlignment="Stretch" Name="treeView1" VerticalAlignment="Stretch" SelectedItemChanged="treeView1_SelectedItemChanged" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Top" BorderThickness="0,0,0,1" BorderBrush="LightGray"> <TreeViewItem Header="Head Tree" ItemsSource="{Binding MainComps}"> <TreeViewItem.ItemContainerStyle> <Style TargetType="{x:Type TreeViewItem}"> <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" /> <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" /> <Setter Property="FontWeight" Value="Normal" /> <Style.Triggers> <Trigger Property="IsSelected" Value="True"> <Setter Property="FontWeight" Value="Bold" /> </Trigger> <DataTrigger Binding="{Binding IsSelected}" Value="True"> <Setter Property="Foreground" Value="RED" /> </DataTrigger> </Style.Triggers> </Style> </TreeViewItem.ItemContainerStyle> <TreeViewItem.Resources> <HierarchicalDataTemplate DataType="{x:Type TextBlock}" ItemsSource="{Binding Children}"> <StackPanel Orientation="Horizontal"> <TextBlock Text="Head Tree" /> </StackPanel> </HierarchicalDataTemplate> <HierarchicalDataTemplate DataType="{x:Type local:MainCompViewModel}" ItemsSource="{Binding Children}"> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding Maincompname}" /> </StackPanel> </HierarchicalDataTemplate> <HierarchicalDataTemplate DataType="{x:Type local:FeatureViewModel}" ItemsSource="{Binding Children}"> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding FeatureName}" /> </StackPanel> </HierarchicalDataTemplate> <DataTemplate DataType="{x:Type local:CompViewModel}"> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding Component}" /> </StackPanel> </DataTemplate> </TreeViewItem.Resources> </TreeViewItem> </TreeView> 

Code behind

 private void treeView1_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e) { if(selected Item meets certain condition) { //Change color of tree node } } 

How can I change the color of a specific Node and leave it in the same SO color as when I expanded it. He must be in RED . Any help would be appreciated.

Answer 1

You can create a boolean property in the model that is true when the elements satisfy the condition. Then you bind Foreground as follows:

  <TreeView.ItemContainerStyle> <Style TargetType="{x:Type TreeViewItem}"> <Style.Triggers> <DataTrigger Binding="{Binding Path=BoolProp}" Value="False"> <Setter Property="Foreground" Value="Blue"></Setter> </DataTrigger> <DataTrigger Binding="{Binding Path=BoolProp}" Value="True"> <Setter Property="Foreground" Value="Red"></Setter> </DataTrigger> </Style.Triggers> </Style> </TreeView.ItemContainerStyle> 

or with a converter:

  <TreeView.ItemContainerStyle> <Style TargetType="{x:Type TreeViewItem}"> <Setter Property="Foreground" Value="{Binding Path=BoolProp, Converter={StaticResource ResourceKey=TheKey}}"/> </Style> </TreeView.ItemContainerStyle> 

Answer 2

Just change Foreground:

 TreeViewItem ti = (TreeViewItem)treeView1.SelectedItem; ti.Foreground = Brushes.Red; 

Answer 3

This is built into the template. You can change the color by copying the default Aero-Style for control and changing the hard-set value.

Or by drilling a visual tree on a load to change it that way.

To get the default style and tenmplate, go through MSDN

You can also check the wise step EXAMPLE from here.