How to set border color in WPF when IsMouseOver?

Question

Hi I have a button in my app and I would like to set the border color to red when the mouse is over the button but BorderBrush does not work

 <Style.Triggers>                 
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" Value="#EE2D2D"/>                
     <Setter Property="Background" Value="#BED591"/>                  
   <Setter Property="Foreground" Value="#EE2D2D"/>         
        </Trigger>

Any help?

Answer 1

Hi,@VFarkas. Welcome to Microsoft Q&A. To achieve the effect of changing the border color when the mouse is over the button, you could modify the ControlTemplate of the Button to include a Border element and change its color based on the IsMouseOver property.

 <Button Content="Click me" Width="300" Height="100">
            <Button.Style>
                <Style TargetType="Button">
                    <Setter Property="Background" Value="#BED591"/>
                    <Setter Property="Foreground" Value="#EE2D2D"/>
                    <Setter Property="BorderThickness" Value="3"    />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="Button">
                                <Border x:Name="border"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Padding="{TemplateBinding Padding}">
                                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                </Border>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter TargetName="border" Property="BorderBrush" Value="#EE2D2D"/>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Button.Style>
        </Button>

The result:

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.