prevent WPF style to be applied to parent during mouseover - wpf

Question

I have the following user control which gets highlighted on mouse over:
<UserControl x:Class="P.WebEnt.Designer.CanvasControls.Container"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:ig="http://schemas.infragistics.com/xaml"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Border.Style>
<Style>
<Setter Property="Border.Background" Value="White"/>
<Style.Triggers>
<Trigger Property="Border.IsMouseOver" Value="True">
<Setter Property="Border.Background" Value="Beige" />
</Trigger>
</Style.Triggers>
</Style>
</Border.Style>
<StackPanel Orientation="Vertical">
<ig:DragDropManager.DropTarget>
<ig:DropTarget IsDropTarget="True">
</ig:DropTarget>
</ig:DragDropManager.DropTarget>
<Label Content="" />
</StackPanel>
</Border>
At run-time, based on our scenario, same control could be added as a child to this control (nesting the same user control for 'n' number of levels).
The requirement is that if the same control is nested inside another, the mouseover on the child should highlight only child and not any of its ancestors. Currently, if I hover the mouse on inner-most control, it highlights all the ancestors.
Any help is appreciated.

Answer 1

here you go, use IsMouseDirectlyOver instead of IsMouseOver
<Trigger Property="Border.IsMouseDirectlyOver"
Value="True">
<Setter Property="Border.Background"
Value="Beige" />
</Trigger>
assuming that the concerned border is the only element nested inside other border, if there is other child elements in the inner most border it may not work as expected. in this case converters or attached behavior may help achieve the same.
EDIT
I attempted to solve the issue in a different way. as you have access to class itself, then we can perhaps do within the class
so change the trigger in style to DataTrigger
<Style>
<Setter Property="Border.Background"
Value="White" />
<Style.Triggers>
<DataTrigger Binding="{Binding IsCurrent,RelativeSource={RelativeSource FindAncestor,AncestorType=UserControl}}"
Value="True">
<Setter Property="Border.Background"
Value="Beige" />
</DataTrigger>
</Style.Triggers>
</Style>
and add the following code in the code behind of Container class
protected override void OnMouseMove(MouseEventArgs e)
{
Debug.Print(e.Source.GetHashCode().ToString());
if (CurrentControl != e.Source)
CurrentControl = e.Source as Container;
e.Handled = true;
}
static Container _CurrentControl;
static Container CurrentControl
{
get
{
return _CurrentControl;
}
set
{
if (_CurrentControl != null)
_CurrentControl.IsCurrent = false;
if (value != null)
value.IsCurrent = true;
_CurrentControl = value;
}
}
public bool IsCurrent
{
get { return (bool)GetValue(IsCurrentProperty); }
set { SetValue(IsCurrentProperty, value); }
}
// Using a DependencyProperty as the backing store for IsCurrent. This enables animation, styling, binding, etc...
public static readonly DependencyProperty IsCurrentProperty =
DependencyProperty.Register("IsCurrent", typeof(bool), typeof(Container), new PropertyMetadata(false));
give it a try and see if that is what you are looking for.