I have a XamDataTree that I have been able to successfully style except for one part. I cannot figure out how to apply a certain style to a node for the event that the mouse hovers over it. I have come up with a sort of hack to change the background by implementing MouseEnter & MouseOut event handlers for the TextBlock contained in my node's data template, but the node is still highlighted over/around it, which I do not want. I have used this link to figure out styling points for XamDataTree, but I still cannot figure out what to do for a hover event.
How can I change this style?
Hi Daniel,
I'm glad you were able to resolve your issue. Let me know if you have any further questions on this matter.
Thank you for the help, Rob. I was able to use your information as well as some the documentation to get this working correctly!
The appearance of the nodes in the XamDataTree when the mouse hovers over them is controlled by a visual state. When the node detects the mouse is over it, it switches to the "MouseOver" state. All the MouseOver state does is make a Border called "hoverBorder" switch Visibility.
<VisualState x:Name="MouseOver"> <Storyboard> <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00" Storyboard.TargetName="hoverBorder" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="00:00:00" > <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <Border x:Name="hoverBorder" Background="{StaticResource ItemHottrackCenterFill}" BorderBrush="{StaticResource ItemHottrackOuterBorderFill}" BorderThickness="{TemplateBinding BorderThickness}" Visibility="Collapsed" Grid.Column="5" CornerRadius="1"></Border>
You can see that the settings for this Border are preset and it is made Collapsed to start with. When the user mouses over the node the visual state is changed to MouseOver which in turn changes the visibility to Visible on the Border. If you want to change what happens when the user mouses over the node or if you just want to change the background you will need to modify the template for the XamDataTreeNodeControl.
In your install directory you will find the default styles used by the Infragistics controls. You can find the default style for a XamDataTreeNodeControl, add the style to your project and make the necessary changes to configure the node the way you want it. Below is the directory for the XamDataTree default style.
C:\Program Files (x86)\Infragistics\NetAdvantage 2013.1\WPF\DefaultStyles\DataTree