WPF ToggleButton悬停异常灰边框及虚线焦点边框移除问题

问题分析 #

你遇到的两个问题均源于MahApps.Metro默认ToggleButton样式与自定义样式的冲突：

• 悬停时的灰色边框：MahApps默认样式在IsMouseOver状态下会应用自带边框样式，覆盖了你自定义的黑色边框
• 切换窗口后的虚线焦点边框：WPF默认的FocusVisualStyle会在控件获焦时显示虚线框，MahApps未主动禁用该特性

解决方案 #

通过两处修改即可彻底解决问题，同时保留你需要的悬停/选中/聚焦时的黑色边框：

修改后的完整样式代码 #

<Window.Resources>
    <!-- 需确保已引入MahApps命名空间：xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls" -->
    <Style TargetType="{x:Type ToggleButton}"
           BasedOn="{StaticResource MahApps.Styles.ToggleButton}">
        <!-- 移除默认虚线焦点边框 -->
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="Width" Value="35"/>
        <Setter Property="Height" Value="30"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="Margin" Value="2"/>
        <Setter Property="Padding" Value="5,3"/>
        <Setter Property="BorderThickness" Value="2"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="FontWeight" Value="Bold"/>
        <Setter Property="FontSize" Value="14"/>
        <Style.Triggers>
            <!-- 强制覆盖MahApps默认状态样式 -->
            <Trigger Property="IsFocused" Value="True">
                <Setter Property="Background" Value="Orange"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="Black"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="True">
                <Setter Property="Background" Value="Orange"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="Black"/>
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="Orange"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="Black"/>
                <!-- 覆盖MahApps内部边框附加属性，消除灰色边框 -->
                <Setter Property="Controls:ControlsHelper.BorderBrush" Value="Black"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
                <Setter Property="Background" Value="Orange"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="Black"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

修改说明 #

1. 移除虚线焦点边框：
   添加<Setter Property="FocusVisualStyle" Value="{x:Null}"/>，彻底禁用WPF默认的焦点虚线框样式。

2. 覆盖MahApps悬停灰色边框：

   • 在IsMouseOver触发器中添加Controls:ControlsHelper.BorderBrush的Setter，MahApps.Metro控件会通过该附加属性控制内部边框，避免默认灰色边框显示
   • 确保所有状态触发器中的BorderBrush和BorderThickness设置优先级高于MahApps默认样式

保留的StackPanel代码 #

<StackPanel x:Name="LanguageBoxAuth"
            Orientation="Horizontal"
            HorizontalAlignment="Center"
            VerticalAlignment="Top"
            Margin="0,280,0,0">
    <ToggleButton Content="IT" Click="OnLanguageButtonAuth_Click"/>
    <ToggleButton Content="EN" Click="OnLanguageButtonAuth_Click"/>
    <ToggleButton Content="ES" Click="OnLanguageButtonAuth_Click"/>
</StackPanel>

额外提示 #

如果仍有样式冲突，可以尝试将样式的BasedOn属性改为{StaticResource MahApps.Styles.ToggleButton.Flat}，使用MahApps扁平样式作为基础，进一步减少默认样式干扰。

内容的提问来源于stack exchange，提问作者markzzz