The Mouse Over trigger is not working on wpf button control

Question

The Mouse Over trigger is not working on wpf button control. I want to change background and foreground of a button when the mouse is over on it.

<Button.Style>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="{x:Type Button}">
            <Border Background="{TemplateBinding Background}" BorderBrush="Black" BorderThickness="1">
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Border>
         </ControlTemplate>
       </Setter.Value>
       <Style.Triggers>
          <Trigger Property="IsMouseOver" Value="True">
             <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
                       <GradientStop Color="#FFF2E32F" Offset="0" />
                       <GradientStop Color="#FF45E815" Offset="1" />
                    </LinearGradientBrush>
                </Setter.Value>
             </Setter>
             <Setter Property="Foreground" Value="White"/>
        </Trigger>
      </Style.Triggers>
   </Style>
</Button.Style>

Edited

I added Template but it just removes the button default MouseOver trigger and not taking place my desired foreground and background style.

Have you take a look at this question and try the solution? http://stackoverflow.com/questions/17259280/how-do-you-change-background-for-a-button-mouseover-in-wpf — Rizki Pratama, Jan 30 '17 at 05:02
@RizkiPratama Yes. but nothing changed by adding template. this solution just remove the button default MouseOver trigger but not taking place my desired foreground and background style. — AAAE_N, Jan 30 '17 at 05:17
Of course the default trigger is removed when you replace it with your custom control template. This is the expected behaviour. What exactly are you trying to accomplish? You cannot combine two different control templates. — mm8, Jan 30 '17 at 11:37

score 3 · Accepted Answer · edited May 23 '17 at 12:09

I found a working solution from here. Define the style inside the button like this:

<Button.Style>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Background="{TemplateBinding Background}" BorderBrush="Black" BorderThickness="1">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
                            <GradientStop Color="#FFF2E32F" Offset="0" />
                            <GradientStop Color="#FF45E815" Offset="1" />
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="Foreground" Value="White"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Button.Style>

@AAAE_N Can I take a look at your full code please? Because I've tried it myself and it worked on me, that is, the mouse over trigger is working. — Rizki Pratama, Jan 30 '17 at 07:10
This is really confused. The code sample in the question is missing a closing tag for the Setter element, so it won't compile. The code sample in this answer fixes the missing tag, but is otherwise identical. — Tony Pulokas, Jan 21 '22 at 22:42

The Mouse Over trigger is not working on wpf button control

1 Answers1