为什么按钮的背景变化？ [英] Why is the Button's Background changing?

问题描述

我和WPF是个新手，我甚至不知道在哪里可以找到这个问题的答案。这似乎XAML非常简单的对我说：

I'm a rank beginner with WPF and I don't even know where to look to find the answer to this question. This XAML seems very straightforward to me:

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>
    <Button>
      <Button.Style>
        <Style TargetType="{x:Type Button}">
        <Style.Triggers>
          <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Green"/>
          </Trigger>      
        </Style.Triggers>
        </Style>
      </Button.Style>
      <Button.Content>Test</Button.Content>
    </Button>
  </Grid>
</Page>

当我鼠标按钮， IsMouseOver 修改真和触发使背景变为绿色。瞬间。然后，它会变成蓝色。

When I mouse over the button, IsMouseOver changes to True and the trigger makes background turns green. For an instant. Then it turns blue.

更妙的是：如果我附上相同二传手到 IsFocused 属性，一旦我专注于按钮绿色和蓝色的背景颜色跳动

Even better: if I attach the same setter to the IsFocused property, once I focus on the button the background color throbs between green and blue.

有什么东西，在按钮的地方（我猜它以任何默认主题正在Vista下使用），它使得这样的行为。我怀疑有触发器需要设置其他属性。不过什么？

There's something, somewhere in the Button (I'm guessing it's in whatever default theme is being used under Vista) that is making it behave this way. I suspect that there's another property that the trigger needs to set. But what?

推荐答案

您需要更改的按钮 模板而非风格。内置到模板是一种叫做<一个href=\"http://msdn.microsoft.com/en-us/library/microsoft.windows.themes.buttonchrome.aspx\">ButtonChrome,那是什么原因造成的刺激性蓝色变焦效果。这里是按钮的一个非常简单的重复模板控制，从提供简单的样式采取：

You need to change the Button's Template rather than its Style. Built into the template is something called ButtonChrome, and that is what is causing the irritating blue focus effect. Here is a very simple re-templating of the Button control, taken from the provided Simple Styles:

<Style TargetType="{x:Type Button}">
   <Setter Property="SnapsToDevicePixels" Value="true"/>
   <Setter Property="OverridesDefaultStyle" Value="true"/>
   <Setter Property="MinHeight" Value="23"/>
   <Setter Property="MinWidth" Value="75"/>
   <Setter Property="Template">
     <Setter.Value>
       <ControlTemplate TargetType="{x:Type Button}">
         <Border 
           x:Name="Border"  
           CornerRadius="2" 
           BorderThickness="1"
           Background="#C0C0C0"
           BorderBrush="#404040">
           <ContentPresenter 
             Margin="2"
             HorizontalAlignment="Center"
             VerticalAlignment="Center"
             RecognizesAccessKey="True"/>
         </Border>
         <ControlTemplate.Triggers>
           <Trigger Property="IsKeyboardFocused" Value="true">
             <Setter TargetName="Border" Property="BorderBrush" Value="#202020" />
           </Trigger>
           <Trigger Property="IsDefaulted" Value="true">
             <Setter TargetName="Border" Property="BorderBrush" Value="#202020" />
           </Trigger>
           <Trigger Property="IsMouseOver" Value="true">
             <Setter TargetName="Border" Property="Background" Value="#808080" />
           </Trigger>
           <Trigger Property="IsPressed" Value="true">
             <Setter TargetName="Border" Property="Background" Value="#E0E0E0" />
             <Setter TargetName="Border" Property="BorderBrush" Value="#606060" />
           </Trigger>
           <Trigger Property="IsEnabled" Value="false">
             <Setter TargetName="Border" Property="Background" Value="#EEEEEE" />
             <Setter TargetName="Border" Property="BorderBrush" Value="#AAAAAA" />
             <Setter Property="Foreground" Value="#888888"/>
           </Trigger>
         </ControlTemplate.Triggers>
       </ControlTemplate>
     </Setter.Value>
   </Setter>
 </Style>

您可以看到，通过重新模板化的控制，你可以改变它的可视化树。在此模板的可视化树无非是一个边框包含内容presenter （这样你就可以看到按钮的内容）。我已经有效地从视觉树这种方式删除ButtonChrome。

You can see that by re-templating the control, you can change its visual tree. The visual tree in this template is nothing more than a Border that contains a ContentPresenter (so you can see the content of the button). I have effectively removed the ButtonChrome from the visual tree this way.

这篇关于为什么按钮的背景变化？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！