如何为CheckBox鼠标悬停状态的背景色设置基于选中状态的判定条件

解决方案 #

你的问题根源是当前模板的触发器都是单条件触发，IsMouseOver触发器不会区分CheckBox是否处于选中状态，所以会全局覆盖背景色。你只需将原单条件IsMouseOver触发器替换为多条件触发器（MultiTrigger），分别对应选中/未选中状态下的悬停逻辑即可，修改步骤如下：

步骤1：调整资源定义（可选） #

你可以新增两组悬停状态的画刷，方便后续维护，不需要复用也可以跳过这步直接在触发器里写色值：

<!-- 未选中状态悬停样式 -->
<SolidColorBrush x:Key="OptionMark.MouseOver.Unchecked.Background" Color="#FFFFFF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Unchecked.Border" Color="#FFABADB3"/><!-- WPF默认CheckBox边框色，可自定义 -->
<!-- 选中状态悬停样式 -->
<SolidColorBrush x:Key="OptionMark.MouseOver.Checked.Background" Color="#FF3C77DD"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Checked.Border" Color="#FF3C77DD"/>

步骤2：替换原IsMouseOver单条件触发器 #

找到ControlTemplate.Triggers节点下原有的IsMouseOver="true"单条件触发器，删除后替换为以下两个多条件触发器：

<!-- 未选中+鼠标悬停逻辑 -->
<MultiTrigger>
    <MultiTrigger.Conditions>
        <Condition Property="IsMouseOver" Value="True"/>
        <Condition Property="IsChecked" Value="False"/>
    </MultiTrigger.Conditions>
    <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Unchecked.Background}"/>
    <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Unchecked.Border}"/>
    <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
    <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
</MultiTrigger>

<!-- 选中+鼠标悬停逻辑 -->
<MultiTrigger>
    <MultiTrigger.Conditions>
        <Condition Property="IsMouseOver" Value="True"/>
        <Condition Property="IsChecked" Value="True"/>
    </MultiTrigger.Conditions>
    <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Checked.Background}"/>
    <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Checked.Border}"/>
    <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
    <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
</MultiTrigger>

可选适配 #

如果需要按压、禁用状态也保持选中/未选中的样式区分，可以参照上面的逻辑，把对应的IsPressed、IsEnabled单条件触发器也替换为多条件触发器即可。

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