防止 PointerOver 更改 Checked 按钮的文本颜色

Question

我在尝试让一组单选按钮充当按钮时遇到问题，我的目标是让按钮的文本颜色在悬停时发生变化，并让它恢复到原始颜色并以粗体显示点击。我正在对之前的类似问题实施建议，但我似乎做错了什么，因为我没有得到想要的行为。当我将鼠标悬停在按钮上时，PointerOver 仍在更改 "Checked" 按钮

的文本颜色

   <Page.Resources>
    <Style x:Key="RadioButtonStyle" TargetType="RadioButton">
        <Setter Property="Background" Value="{ThemeResource RadioButtonBackground}"/>
        <Setter Property="Foreground" Value="{ThemeResource RadioButtonForeground}"/>
        <Setter Property="BorderBrush" Value="{ThemeResource RadioButtonBorderBrush}"/>

        <Setter Property="Padding" Value="8,6,0,0"/>
        <Setter Property="HorizontalAlignment" Value="Left"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
        <Setter Property="MinWidth" Value="120"/>
        <Setter Property="UseSystemFocusVisuals" Value="True"/>
        <Setter Property="FocusVisualMargin" Value="-7,-3,-7,-3"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="RadioButton">
                    <Grid x:Name="RootGrid" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="PointerOver">
                                    <VisualState.Setters>
                                        <Setter Target="ContentPresenter.Foreground" Value="Purple" />
                                    </VisualState.Setters>

                                </VisualState>
                                <VisualState x:Name="Pressed">

                                </VisualState>
                                <VisualState x:Name="Disabled">

                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="CheckStates">
                                <VisualState x:Name="Checked">
                                    <VisualState.Setters>
                                        <Setter Target="FocusContentPresenter.FontWeight" Value="Bold" />
                                        <Setter Target="ContentPresenter.FontWeight" Value="Bold" />
                                        <Setter Target="FocusContentPresenter.(UIElement.Opacity)" Value="1" />
                                        <Setter Target="ContentPresenter.(UIElement.Opacity)" Value="0" />
                                    </VisualState.Setters>
                                </VisualState>
                                <VisualState x:Name="Unchecked"/>
                                <VisualState x:Name="Indeterminate"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" Grid.Column="1" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" TextWrapping="Wrap" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        <ContentPresenter x:Name="FocusContentPresenter" Opacity="0" Content="{TemplateBinding Content}" ContentTransitions="{TemplateBinding ContentTransitions}" ContentTemplate="{TemplateBinding ContentTemplate}" />

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <RadioButton Content="RadioButton" GroupName="Menu" HorizontalAlignment="Left" Margin="10,165,0,0" VerticalAlignment="Top" Style="{StaticResource RadioButtonStyle}"/>
    <RadioButton Content="RadioButton" GroupName="Menu" HorizontalAlignment="Left" Margin="10,235,0,0" VerticalAlignment="Top" Style="{StaticResource RadioButtonStyle}"/>
    <RadioButton Content="RadioButton" GroupName="Menu" HorizontalAlignment="Left" Margin="10,94,0,0" VerticalAlignment="Top" Style="{StaticResource RadioButtonStyle}" />
</Grid>

Answer 1

除了一些小的填充问题外，我想你几乎已经完成了。

<Style x:Key="RadioButtonStyle" TargetType="RadioButton">
    <Setter Property="Background" Value="{ThemeResource RadioButtonBackground}" />
    <Setter Property="Foreground" Value="{ThemeResource RadioButtonForeground}" />
    <Setter Property="BorderBrush" Value="{ThemeResource RadioButtonBorderBrush}" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="MinWidth" Value="0" />
    <Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="FocusVisualMargin" Value="-7,-3,-7,-3" />
    <Setter Property="Padding" Value="16,12" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="RadioButton">
                <Grid x:Name="RootGrid" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter Target="ContentPresenter.Foreground" Value="Purple" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                            </VisualState>
                            <VisualState x:Name="Disabled">
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <VisualState.Setters>
                                    <Setter Target="FocusContentPresenter.FontWeight" Value="Bold" />
                                    <Setter Target="ContentPresenter.FontWeight" Value="Bold" />
                                    <Setter Target="FocusContentPresenter.(UIElement.Opacity)" Value="1" />
                                    <Setter Target="ContentPresenter.(UIElement.Opacity)" Value="0" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Unchecked" />
                            <VisualState x:Name="Indeterminate" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>

                    <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" TextWrapping="Wrap" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" />
                    <ContentPresenter x:Name="FocusContentPresenter" Opacity="0" Content="{TemplateBinding Content}" ContentTransitions="{TemplateBinding ContentTransitions}" ContentTemplate="{TemplateBinding ContentTemplate}" Margin="{TemplateBinding Padding}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

防止 PointerOver 更改 Checked 按钮的文本颜色

Keep PointerOver from changing text color of Checked button

xaml

button

radio-button

visualstates

uwp