Glow effect on MouseEnter WPF

Question

I'm new in WPF(c#). I need make a glow effect around image control using triggers. How can I do make glow effect on mouse-enter event? I want to use your answer i my style.

My effect is:

<DropShadowEffect x:Key="MyEffect" ShadowDepth="0" Color="Blue" Opacity="1" BlurRadius="20"/>

I see many links but they don't work.

Solution 1

To add glow to Image control you need to set Effect to your DropShadowEffect when IsMouseOver=True, something like this:

<Image Source="/WpfApplication1;component/myimage.png">
   <Image.Style>
      <Style TargetType="{x:Type Image}">
         <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
               <Setter Property="Effect">
                  <Setter.Value>
                     <DropShadowEffect ShadowDepth="0" Color="Blue" Opacity="1" BlurRadius="20"/>
                  </Setter.Value>
               </Setter>
            </Trigger>
         </Style.Triggers>
      </Style>
   </Image.Style>
</Image>

Solution 2

If you want to reuse your effect, you must capture IsMouseOver trigger and set Control.Effect property to what you have defined in your resources.

<Button Width="100" Content="Hello Glow" >
 <Button.Style>
  <Style>
   <Style.Triggers>
    <Trigger Property="Button.IsMouseOver" Value="True">
     <Setter Property="Button.Effect" Value="{StaticResource MyEffect}" />
    </Trigger>
   </Style.Triggers>
  </Style>
 </Button.Style>
</Button>

for this, you must place you effect in recourses of current page/window/usercontrol

<Window.Resources>
 <DropShadowEffect x:Key="MyEffect" ShadowDepth="0" Color="Blue" Opacity="1" BlurRadius="20"/>
</Window.Resources>