AAAE_N
AAAE_N

Reputation: 305

The Mouse Over trigger is not working on wpf button control

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.

Upvotes: 1

Views: 7531

Answers (1)

Rizki Pratama
Rizki Pratama

Reputation: 571

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>

Upvotes: 3

Related Questions