如何在 xaml 中为 ToggleButton 设置切换颜色？答案

【问题标题】：How to set the toggled colour for a ToggleButton in xaml?如何在 xaml 中为 ToggleButton 设置切换颜色？
【发布时间】：2018-10-20 04:21:23
【问题描述】：

所以这可能是一个非常简单的答案。在我的 UWP 应用程序中，我尝试开始使用内置的 Windows 控件，而不是我自己的由 Textblocks 周围的边框制成的按钮。我这样做是因为它更简单，但最重要的是我需要一个易于使用的切换按钮。

我了解了 CommandBar 和 AppBarToggleButton，这些似乎正是我想要的。我可以很好地设置 CommandBar 的背景颜色，但是当切换 AppBarToggleButton 时，它始终是用户的强调色。我需要能够定义它以匹配我的应用程序的品牌（绿色）。我有一种感觉，它需要我使用某种主题，因为它不在 xaml 对象的画笔属性菜单中，但从那时起我就迷路了。

这是我的代码，虽然它非常基本。

<CommandBar Background="{StaticResource MapButtonsBackgroundAcrylic}">
    <AppBarToggleButton x:Name="tog_view_mode" Icon="View" Label="View Mode" Foreground="White"/>
    <AppBarSeparator Foreground="White"/>
    <AppBarToggleButton x:Name="tog_edit_mode" Icon="Edit" Label="Edit Mode" Foreground="White"/>
</CommandBar>

这就是它给我的。我的用户强调色是蓝色。换成黑色的也不好。

由于我的应用程序中有多个切换，我想制作一个可以分配它们的单一样式，或者更改应用程序看到的强调色？我不确定这里的正确程序是什么，因为我是修改内置控件的新手。

所以我需要一种方法，当切换时，

背景为绿色，例如#FF008000
前景为白色。

谁能帮帮我？

【问题讨论】：

标签： c# xaml colors uwp

【解决方案1】：

您可以覆盖AppBarToggleButton 的样式模板来实现此目的。为此，您需要右键单击 AppBarToggleButton > 编辑模板 > 编辑副本。

然后将相关代码添加到可视状态。在您的情况下，视觉状态是“Checked”。

    <VisualState x:Name="Checked">
                  <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckedHighlightBackground" Storyboard.TargetProperty="Opacity">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="OverflowCheckGlyph" Storyboard.TargetProperty="Opacity">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Foreground">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Background">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="Your color here(green)"/>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="Foreground">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                    </ObjectAnimationUsingKeyFrames>
                    <PointerUpThemeAnimation Storyboard.TargetName="OverflowContentRoot" />
                  </Storyboard>
         </VisualState>

希望这对您有所帮助..请随时提出您可能遇到的任何问题..

【讨论】：

在这个上+1。您还可以使用{TemplateBinding <Property Name>} 从未选中状态访问任何属性，以将它们持久保存在选中状态。

【解决方案2】：

您应该在页面的Resources 部分中覆盖AppBarToggleButtonBackground 和App.xaml 中的其他画笔（如果您想应用于整个应用程序）（如果您想应用于特定页面）或在实际的切换按钮内相同（如果您想应用于单个按钮）。可用的资源键列在documentation.

【讨论】：