更改单选按钮按下的颜色 [英] Changing Radio Button Pressed Color

问题描述

如何更改单选按钮选中的颜色，我看到的只有前景色和背景色设置。

---

Martin Autry

How can a radio button checked color be changed, all I see available is foreground and background color settings.

---

Martin Autry

推荐答案

更改控制状态行为的标准方法是自定义模板。您可以在以下网址找到RadioButton模板：https：//msdn.microsoft.com/en-us/library/windows/apps/mt299147.aspx

The standard way to change control state behavior is to customize the template. You can find the RadioButton template at https://msdn.microsoft.com/en-us/library/windows/apps/mt299147.aspx

检查外观是否在CheckedStates VisualState中处理：

Check appearance is handled in the CheckedStates VisualState:

          <VisualStateGroup x:Name="CheckStates">
            <VisualState x:Name="Checked">
              <Storyboard>
                <DoubleAnimation Storyboard.TargetName="CheckGlyph"
                                 Storyboard.TargetProperty="Opacity"
                                 To="1"
                                 Duration="0" />
                <DoubleAnimation Storyboard.TargetName="OuterEllipse"
                                 Storyboard.TargetProperty="Opacity"
                                 To="0"
                                 Duration="0" />
                <DoubleAnimation Storyboard.TargetName="CheckOuterEllipse"
                                 Storyboard.TargetProperty="Opacity"
                                 To="1"
                                 Duration="0" />
              </Storyboard>
            </VisualState>
            <VisualState x:Name="Unchecked" />
            <VisualState x:Name="Indeterminate" />
          </VisualStateGroup>

默认情况下，它显示CheckGlyph和CheckOuterEllipse（不透明度为1）并隐藏OuterEllipse（不透明度为0）

By default this shows the CheckGlyph and CheckOuterEllipse (Opacity to 1) and hides the OuterEllipse (Opacity to 0)

现在可见的项目在同一模板中定义如下：

The now visible items are defined in the same template a bit below:

          <Ellipse x:Name="CheckOuterEllipse"
                    Width="20"
                    Height="20"
                    UseLayoutRounding="False"
                    Stroke="{ThemeResource SystemControlHighlightAltAccentBrush}"
                    Fill="{ThemeResource SystemControlHighlightTransparentBrush}"
                    Opacity="0"
                    StrokeThickness="{ThemeResource RadioButtonBorderThemeThickness}" />
          <Ellipse x:Name="CheckGlyph"
                    Width="10"
                    Height="10"
                    UseLayoutRounding="False"
                    Opacity="0"
                    Fill="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />

要仅更改RadioButton中的颜色，请更新模板以使用自定义的Fill和Stroke画笔。而不是对它们进行硬编码，将它们设置为新的Brush资源以适合您的应用主题，并在高对比度模式下回退到默认值。

To change just the colours in the RadioButton update the template to use your customized Fill and Stroke brushes. Rather than hard-coding them in place, set those to a new Brush resource to fit your app theme and fall back to defaults in high contrast modes.

- Rob

这篇关于更改单选按钮按下的颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！