WPF按钮背景问题

Question

我有一个网格控件，它有25个按钮（网格只包含按钮）。并为每个按钮我这样设置相同的图像：

 ImageBrush brush = new ImageBrush(); 
    BitmapImage bitmap = new BitmapImage(); 
    bitmap.BeginInit(); 
    bitmap.UriSource = new Uri(@"pack://application:,,,/Images/notexplored.jpg", UriKind.RelativeOrAbsolute); 
    bitmap.EndInit(); 
    brush.ImageSource = bitmap; 

    foreach (UIElement uie in myGrid.Children) 
    { 
     var temp = uie as Button; 
     temp.Background = brush; 
    } 

我的问题是，现在当我将鼠标悬停在按钮我得到这个（这个问题的短视频）：https://www.dropbox.com/s/jb8fb29lrpimue5/ButtonIssue.avi

哪有我改正这个？将图像作为背景应用到按钮后，如果我将鼠标悬停在按钮上，我不想看到默认的按钮背景（看起来&感觉）而不是应用的图像。

Answer 1

为了便于重新创建示例，我在此将'StackPanel'作为容器。如果你不需要动态设置图片，那么我希望应用如下所示的样式应该看起来像你期望的那样看起来像&的按钮，同时仍然允许使用事件等，与使用典型的WPF按钮。

<StackPanel x:Name="sp"> 
     <StackPanel.Resources> 
      <Style TargetType="{x:Type Button}" x:Key="btnWithImageBgStyle"> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type Button}"> 
          <Border CornerRadius="5" BorderBrush="{TemplateBinding BorderBrush}" > 
           <Border.Background> 
            <ImageBrush ImageSource="pack://application:,,,/Tulip.jpg"/> 
           </Border.Background> 
           <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" /> 
          </Border> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </StackPanel.Resources> 
     <Button x:Name="btn1" Width="100" Height="50" Content="Button1!" Style="{StaticResource btnWithImageBgStyle}" Click="btn1_Click"/> 
     <Button x:Name="btn2" Width="100" Height="50" Content="Button2!" Style="{StaticResource btnWithImageBgStyle}"/> 
     <Button x:Name="btn3" Width="100" Height="50" Content="Button3!" Style="{StaticResource btnWithImageBgStyle}"/> 

Answer 2

而不是设置背景，只需添加一个新的图像作为按钮的Content。一个小例子：

var b = new Button(); 

var bitmap = new BitmapImage(); 
bitmap.BeginInit(); 
bitmap.UriSource = new Uri(@"pack://application:,,,/floor.png", UriKind.RelativeOrAbsolute); 
bitmap.EndInit(); 

var img = new Image {Source = bitmap}; 

b.Content = img; 

Answer 3

你必须改变按钮的控件模板，以便它确实不再对MouseOver事件作出响应。最简单的解决办法是这样的

<Window.Resources> 
    <Style TargetType="{x:Type Button}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <ContentPresenter /> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 

这是适用于每一个驻留在窗口内的按钮隐式风格。在控件模板中，您可以更改按钮的外观以及它在状态更改时的行为方式（例如，当鼠标位于按钮上方时）。

通常情况下，控制模板会有更多的代码，但在这个例子中，你只是想要一个显示某些东西的按钮，但是当鼠标移出或者当它结束时可以看到所有其他行为的东西被点击。您可以在MSDN上查看WPF中按钮的默认模板：http://msdn.microsoft.com/en-us/library/ms753328.aspx

我绝对建议您在WPF中了解更多关于样式和模板的信息。这是一个很好的起点：http://msdn.microsoft.com/en-us/library/ms745683.aspx

如果您有任何问题，请随时发表评论。

Answer 4

如果您只是需要显示图像并响应点击，按钮会过度杀伤。您只能使用ContentControl。