Changing Foreground of a TreeViewItem upon selection

Question

In my program I have a TreeView in which the user will select different items from. There are a few items in my TreeView that are customized upon creation in my c# code-behind.

Like so:

public static TreeViewItem newItem = new TreeViewItem() //Child Node { Header = new StackPanel //ICON { Orientation = Orientation.Horizontal, Children = { new Border { Width = 12, Height = 14, Background = Brushes.Blue, BorderThickness = new Thickness(1.0), BorderBrush = Brushes.Black }, new Label { Content = "Node1" } } } };

I would like these items to display WHITE foregrounds when they are selected (just like the default node behavior).

This is what I have tried so far in XAML. It is a style template that I have set for TreeViewItems. I receive no compiler errors, but for some reason when I run the program my TreeView is not visible.

<Style TargetType="{x:Type TreeViewItem}" > <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type TreeViewItem}"> <ControlTemplate.Triggers> <Trigger Property="IsSelected" Value="True" > <Setter Property="Foreground" Value="White" /> </Trigger> <Trigger Property="IsSelected" Value="False" > <Setter Property="Foreground" Value="Black" /> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>

How can I fix this so that all of my TreeView nodes display white foregrounds when selected?

If I used TextBlock would it allow the Foreground change? — Eric after dark
– Eric after dark, Commented Aug 19, 2013 at 19:49

Anatoliy Nikolaev · Accepted Answer · 2013-08-19 19:41:34Z

This is because you completely rewrite the template, and you do not write anything instead. Just to set the triggers, not necessarily to do them in the template, you can just set them in Style. Template is typically set to change the elements in the visual tree. Try this example:

<Window.Resources> <Style TargetType="{x:Type TreeViewItem}"> <Style.Resources> <!-- Set Highlight Background color --> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Black" /> </Style.Resources> <Style.Triggers> <Trigger Property="IsSelected" Value="True"> <!-- Set Foreground color --> <Setter Property="Foreground" Value="White" /> </Trigger> </Style.Triggers> </Style> </Window.Resources> <Grid> <TreeView> <TreeViewItem Header="Root"> <TreeViewItem Header="Child1" /> <TreeViewItem Header="Child2" /> <TreeViewItem Header="Child3" /> <TreeViewItem Header="Child4" /> </TreeViewItem> </TreeView> </Grid>

For more information, please see:

Styling and Templating on MSDN

Example of TreeView Style/Template on MSDN

EDIT

Try this:

public TreeViewItem newItem = new TreeViewItem() //Child Node { Header = new StackPanel { Orientation = Orientation.Horizontal, Children = { new Border { Width = 12, Height = 14, Background = Brushes.Blue, BorderThickness = new Thickness(1.0), BorderBrush = Brushes.Black }, new Label { Content = "Node1", Foreground = Brushes.Black, } } } }; private void AddItem_Click(object sender, RoutedEventArgs e) { // Set Selected handler on Selected event newItem.Selected += new RoutedEventHandler(newItem_Selected); // Set Unselected handler on Unselected event newItem.Unselected += new RoutedEventHandler(newItem_Unselected); // Add your item MyTreeView.Items.Add(newItem); } // Set the black color for foreground private void newItem_Unselected(object sender, RoutedEventArgs e) { TreeViewItem MyTreeViewItem = sender as TreeViewItem; StackPanel MyStackPanel = MyTreeViewItem.Header as StackPanel; Label MyLabel = MyStackPanel.Children[1] as Label; MyLabel.Foreground = Brushes.Black; } // Set the white color for foreground private void newItem_Selected(object sender, RoutedEventArgs e) { TreeViewItem MyTreeViewItem = sender as TreeViewItem; StackPanel MyStackPanel = MyTreeViewItem.Header as StackPanel; Label MyLabel = MyStackPanel.Children[1] as Label; MyLabel.Foreground = Brushes.White; }

Note: This code can be shortened and made easier if you use a template for TreeViewItem.

This is working for all of the normal TreeViewItems, but the ones I mentioned in my question are not being affected (The custom ones).
@Ericafterdark, I don't see a need for Label in your code. Unless you really need it replace it with TextBlock and original, simpler solution with Style should work straight away for your items
@Anatoliy Nikolaev, this answer seems like it would work if I was adding nodes with a button click. But at the moment my Selected Nodes are controlled by a SelectedItemChanged method. How would I call to those event handlers from a SelectedItemChanged method? @dkozl - Changed it to TextBlock.
@Eric after dark: Just add two events to your newItem, like this: newItem.Selected += new RoutedEventHandler(newItem_Selected);, e.g. before the addition of TreeView.Items. You do it somehow you add?

Collectives™ on Stack Overflow

Changing Foreground of a TreeViewItem upon selection

1 Answer 1

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Linked

Related