KrisTrip
KrisTrip

Reputation: 5043

WPF TreeView Highlight Row On Hover

Currently, hovering over a header in the TreeView will highlight the header. I would like hovering over any part of the row in the TreeView to highlight the entire row (much like windows explorer does). Could someone provide an example of how to do that?

enter image description here

Upvotes: 2

Views: 7714

Answers (1)

Tim
Tim

Reputation: 15237

You need to change the ControlTemplate for the TreeViewItem to actually be the entire width of the control.

There is a discussion about this issue, along with a solution, here:

http://leecampbell.blogspot.com/2009/01/horizontal-stretch-on-treeviewitems.html

There's another lengthy answer here, without the discussion:

http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/b04f73e2-0b10-4d97-a6da-64df2e30c21d/

So I meant those examples to be guides. If you take exactly the same code as is in the second link above (from MSDN forums) and just add this:

<Trigger Property="IsMouseOver" Value="True">
    <Setter Property="Background" TargetName="Bd"
            Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
</Trigger>

to the ControlTemplate you'll see that you get the highlight color on mouseover. Obviously you'll need to tweak the color and whatnot, but that's what you'll need to do - modify the ControlTemplate of the TreeViewItem so that it takes up the entire width and add a Trigger for IsMouseOver.

Upvotes: 4

Related Questions