How to hide the gridlines when pressing a button in WPF C#?

July 16, 2024

I have been working on some projects and I can’t seem to find a way to hide gridlines that appear when you press a button like in the image below

is there a way that will hide the gridlines? I don’t want the user when press a button in my application to see the gridlines.

Here is an example of my button xaml code:

<Button Style="{DynamicResource HeaderButtonStyle}" Grid.Column="0" Background="Transparent" Width="Auto" BorderBrush="Transparent" Click="MinButton_Click">
        <StackPanel Orientation="Horizontal">
           <Image RenderOptions.BitmapScalingMode="HighQuality" Source="/Resources/icons8-minimize-window-100.png"/>
        </StackPanel>
</Button>

>Solution :

You can set the FocusVisualStyle property of the button to null. It will remove the default focus rectangle that appears around the button when it is clicked.

<Button 
    Style="{DynamicResource HeaderButtonStyle}" 
    Grid.Column="0" 
    Background="Transparent" 
    Width="Auto" 
    BorderBrush="Transparent" 
    Click="MinButton_Click"
    FocusVisualStyle="{x:Null}">
    <StackPanel Orientation="Horizontal">
        <Image RenderOptions.BitmapScalingMode="HighQuality" Source="/Resources/icons8-minimize-window-100.png"/>
    </StackPanel>
</Button>

If you want to apply this to all buttons in your application, you can define a style in your App.xaml file.

<Application.Resources>
    <Style TargetType="Button">
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>
</Application.Resources>

All buttons in your application will not show the focus rectangle when clicked. If you want to apply this style to only specific buttons, you can define a style with a key and apply it to the buttons as needed:

<Window.Resources>
    <Style x:Key="NoFocusButtonStyle" TargetType="Button">
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>
</Window.Resources>

<!-- apply the style to a button -->
<Button 
    Style="{StaticResource NoFocusButtonStyle}" 
    Grid.Column="0" 
    Background="Transparent" 
    Width="Auto" 
    BorderBrush="Transparent" 
    Click="MinButton_Click">
    <StackPanel Orientation="Horizontal">
        <Image RenderOptions.BitmapScalingMode="HighQuality" Source="/Resources/icons8-minimize-window-100.png"/>
    </StackPanel>
</Button>