Change Ellipse property on parent grid mouseover WPF - wpf

Question

I have a grid in which i have a ellipse, and i want that on mouse is over oon the gid the ellipse should be filled with red color . How can i do this thing ? if i place trigger in ellipse then its only on mouse overover with in ellipse. But i want that the color should be changed o mouse is over on the parent grid of ellipse .
Here is my code of User Control :
<UserControl x:Class="DeviceIcon"
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"
mc:Ignorable="d"
d:DesignHeight="31" d:DesignWidth="31">
<Grid Background="#00000000" Name="MainGrid">
<Ellipse Name="BackCircle" Width="30" Height="30" Fill="Lavender" Stroke="Red" >
</Ellipse>
</Grid>

Answer 1

You can add event handlers to the parent grid. The mouse events bubble up to the grid from the ellipse and other child elements.
XAML
<Grid Background="#00000000"
Name="MainGrid"
MouseEnter='MainGrid_MouseEnter'
MouseLeave='MainGrid_MouseLeave'>
<Ellipse Name="BackCircle"
Width="30"
Height="30"
Fill="Lavender"
Stroke="Red">
</Ellipse>
</Grid>
Code
private Brush _oldFill;
private void MainGrid_MouseEnter(object sender, MouseEventArgs e) {
_oldFill = BackCircle.Fill;
BackCircle.Fill = new SolidColorBrush(Colors.Red);
}
private void MainGrid_MouseLeave(object sender, MouseEventArgs e) {
BackCircle.Fill = _oldFill;
}