How do I prevent WPF buttons from remaining highlighted after being clicked?
Try to set Focusable
to false. The button will be clickable but will not remain focused.
What happens is that the button accepts the input focus after it has been clicked, just like any other control does when you click on it.
And the way that Windows indicates that a control has the input focus (at least under the Aero theme) is with a subtle blue highlight.
For a button control in particular, when it has the input focus, simply pressing the Enter key will "push" that button. That's why maintaining the highlight is very important, so that the user knows what to expect.
The better solution is to set the focus to a different control in your window immediately after the user has clicked on the button. That way, it will no longer be automatically highlighted and no action will be automatically triggered when the user presses the Enter key. (This is the real usability problem that you're trying to solve, even if you don't know it yet. Nothing is more confusing than a button inadvertently getting clicked when the user is actually trying to type something.)
You could prevent the button from ever getting the focus altogether by setting its Focusable
property to false, but I would very much recommend against this. Once you've done this, there will be no way for the user to "press" the button using only the keyboard. Well-designed applications should always be accessible to users who either prefer not to or who are unable to use the mouse.
This is the default look for Aero buttons when they have focus. You can either set Focusable="False"
or use a custom Style, that doesn't render it differently when the button has focus. Something like:
xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
<Style x:Key="BaseButtonStyle" TargetType="{x:Type ButtonBase}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ButtonBase}">
<theme:ButtonChrome Name="Chrome" Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}" RenderDefaulted="{TemplateBinding Button.IsDefaulted}"
RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"
SnapsToDevicePixels="true">
<ContentPresenter Margin="{TemplateBinding Padding}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
</theme:ButtonChrome>
<ControlTemplate.Triggers>
<!--
Do not show blue when focused
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter TargetName="Chrome" Property="RenderDefaulted" Value="true" />
</Trigger>-->
<Trigger Property="ToggleButton.IsChecked" Value="true">
<Setter TargetName="Chrome" Property="RenderPressed" Value="true" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="#ADADAD" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type ToggleButton}" BasedOn="{StaticResource BaseButtonStyle}" TargetType="{x:Type ToggleButton}" />
<Style x:Key="{x:Type RepeatButton}" BasedOn="{StaticResource BaseButtonStyle}" TargetType="{x:Type RepeatButton}" />
<Style x:Key="{x:Type Button}" BasedOn="{StaticResource BaseButtonStyle}" TargetType="{x:Type Button}" />
You'd need to add a reference to PresentationFramework.Aero.dll
That is simply the focussed state. To turn it off you will have to change the focussed state. It's easiest by using Blend.
I do not recommend setting Focusable to false because it interferes with using the keyboard