在 Aero 上的 WPF 中覆盖按钮背景

Question

所以，愿望很简单，将按钮的背景更改为浅绿色，当鼠标光标悬停在其上时将其背景更改为绿色，当按下按钮时将其背景更改为深绿色。以下 XAML 是我的第一次尝试：

<Window x:Class="ButtonMouseOver.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
  <Grid>
    <Button Background="LightGreen">
      Hello
      <Button.Style>
        <Style TargetType="Button">
          <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="true">
              <Setter Property = "Background" Value="Green"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="true">
              <Setter Property = "Foreground" Value="DarkGreen"/>
            </Trigger>
          </Style.Triggers>
        </Style>
      </Button.Style>
    </Button>
  </Grid>
</Window>

但是，可惜这不起作用。我们距离目标仅完成了 1/3。是的，该按钮会变成浅绿色，但是一旦您将鼠标悬停在其上或按下它，您就会获得相应按钮状态的标准 Aero 镀铬效果。不想放弃，我尝试了以下放荡的行为：

...
    <Button xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
            Background="LightGreen">
      Hello
      <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
          <Microsoft_Windows_Themes:ButtonChrome SnapsToDevicePixels="true" 
            x:Name="Chrome" Background="{TemplateBinding Background}" 
            BorderBrush="{TemplateBinding BorderBrush}" RenderDefaulted="{TemplateBinding IsDefaulted}" 
            RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"
            >
            <ContentPresenter Margin="{TemplateBinding Padding}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          RecognizesAccessKey="True"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Microsoft_Windows_Themes:ButtonChrome>
        </ControlTemplate>
      </Button.Template>
      <Button.Style>
        <Style TargetType="Button">
          <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="true">
              <Setter Property = "Background" Value="Green"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="true">
              <Setter Property = "Foreground" Value="DarkGreen"/>
            </Trigger>
          </Style.Triggers>
        </Style>
      </Button.Style>
    </Button>
...

现在我们已经从 Aero.NormalColor.xaml 中取出了整个该死的控件模板。唉，这并没有改变什么。然后，我从 Microsoft_Windows_Themes:ButtonChrome 元素中删除两个属性（RenderPressed 和 RenderMouseOver）。仍然没有任何变化。然后，我删除了 Button 的 Background 属性的设置，只留下了PresentationFramework.Aero 程序集的命名空间声明：

...
<Button xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">
  Hello
...

最后，我们取得了进展。我们已经从 1/3 的需求增加到了 2/3，IsMouseOver 和 IsPressed 可以工作，但在按钮的正常状态（没有鼠标悬停或按下）期间没有浅绿色背景，因为我已经删除了按钮的背景属性，以应用其他两个状态并使其可见。现在，在这个疯狂的 XAML 无法为我们提供正常按钮状态的浅绿色背景之后，我修改了样式以将背景颜色也放入其中：

  <Button xmlns...
    <ControlTemplate...
    ...
    </ControlTemplate>
    <Button.Style> 
      <Style TargetType="Button">
        <!-- ##### Normal state button background added ##### -->
        <Setter Property="Background" Value="LightGreen" />
        <!-- ################################################ -->
        <Style.Triggers>
          <Trigger Property="IsMouseOver" Value="true">
            <Setter Property = "Background" Value="Green"/>
          </Trigger>
          <Trigger Property="IsPressed" Value="true">
            <Setter Property = "Background" Value="DarkGreen"/>
          </Trigger>
        </Style.Triggers>
      </Style>
    </Button.Style> 
  </Button>

最后，它按预期工作。

我是疯了，还是这些（以及更多）你必须经历的 Aero 主题，才能改变按钮在某些不同状态下的背景颜色（正常、悬停、按下）？也许，如果我不必将整个 dang ButtonTemplate 包含在那里只是为了从中删除两个属性（RenderMouseOver 和 RenderPressed），那么生活就不会那么糟糕。

谢谢你的帮助 - 我已经无能为力了。

更新：但是等等，还有更多内容。无需从控件模板中删除 RenderMouseOver 和 RenderPressed 属性，只需将它们从：更改

<Microsoft_Windows_Themes:ButtonChrome SnapsToDevicePixels="true" ...
  RenderMouseOver="{TemplateBinding IsMouseOver}"  
  RenderPressed="{TemplateBinding IsPressed}" ...

为：

<Microsoft_Windows_Themes:ButtonChrome SnapsToDevicePixels="true" ...
  RenderMouseOver="{Binding IsMouseOver}"  
  RenderPressed="{Binding IsPressed}" ...

...，也可以解决问题（忽略按钮的样式触发器）。我认为问题的根源在于模板绑定是在编译时应用的（出于性能原因），而常规绑定是在运行时应用的。因此，如果属性使用模板绑定（即，使用原始模板中的 IsMouseOver 和 IsPressed），则不会使用各个按钮的样式触发器的绑定。

说了以上所有内容，这里是在 Aero 中更改按钮背景同时保留其原始控件模板的典型示例：

<Window x:Class="ButtonMouseOver.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
  <Grid>
    <Button>
      Hello
      <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
          <Microsoft_Windows_Themes:ButtonChrome SnapsToDevicePixels="true" 
            x:Name="Chrome" Background="{TemplateBinding Background}" 
            BorderBrush="{TemplateBinding BorderBrush}" RenderDefaulted="{TemplateBinding IsDefaulted}" 
            RenderMouseOver="{Binding IsMouseOver}" RenderPressed="{Binding IsPressed}"
            >
            <ContentPresenter Margin="{TemplateBinding Padding}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          RecognizesAccessKey="True"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Microsoft_Windows_Themes:ButtonChrome>
        </ControlTemplate>
      </Button.Template>
      <Button.Style>
        <Style TargetType="Button">
          <Setter Property="Background" Value="LightGreen"/>
          <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="true">
              <Setter Property = "Background" Value="Green"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="true">
              <Setter Property = "Foreground" Value="DarkGreen"/>
            </Trigger>
          </Style.Triggers>
        </Style>
      </Button.Style>
    </Button>
  </Grid>
</Window>

这当然假设只有一个按钮具有如此样式，否则模板和样式可以移出到某处的资源部分。另外，按钮的默认状态没有触发器，但很容易将其添加到上面的示例中（不要忘记更改控件模板中的 RenderDefaulted 属性以使用 Binding 而不是 TemplateBinding）。

如果有人对如何仅针对需要更改的控件模板中的两个属性覆盖 TemplateBinding 有任何建议，而不重复 aero xaml 批发中的整个 chrome 定义，我会洗耳恭听。

Answer 1

Button 的默认模板使用 ButtonChrome，它执行自己的绘制。如果您想完全摆脱默认外观，则需要定义自己的模板，而不需要 ButtonChrome。我知道这听起来很乏味，但您只需要做一次：您可以将自定义样式放入资源字典中，然后只需使用 StaticResource 引用它即可。请注意，您还可以使用 {x:Type Button} 作为样式的键（x:Key 属性），将样式应用于应用中的所有按钮