C# 鼠标悬停时更改按钮图像

我有以下XAML代码：

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="480" Width="640" ResizeMode="NoResize">
    <Window.Background>
        <SolidColorBrush x:Name="WindowBrush" Color="#202020" />
    </Window.Background>
    <Window.Resources>
        <Style TargetType="Button">
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="Background">
                <Setter.Value>
                    <ImageBrush ImageSource="Resources/button.png"/>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background">
                        <Setter.Value>
                            <ImageBrush ImageSource="Resources/button-hover.png"/>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="285*"/>
            <ColumnDefinition Width="349*"/>
        </Grid.ColumnDefinitions>
        <Button Content="Button" HorizontalAlignment="Left" Height="28" Margin="21,20,0,0" VerticalAlignment="Top" Width="79" BorderThickness="1"/>
    </Grid>
</Window>

当然，我在我的项目中有两张图片-

button.png

和

button hover.png

。 但当光标位于我的按钮上时，它将应用默认的Windows样式，而不是我的

按钮hover.png

图像。 我的错在哪里？

---

谢谢。

这是一个示例样式：

<Style TargetType="Button">
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="Button">
            <Grid>
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualState x:Name="Normal"/>
                        <VisualState x:Name="Disabled"/>
                        <VisualState x:Name="MouseOver">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="mouseOverBackgroundImage" Storyboard.TargetProperty="Opacity" Duration="0:0:0.1" To="1"/>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="Pressed">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="pressedBackgroundImage" Storyboard.TargetProperty="Opacity" Duration="0:0:0.1" To="1"/>
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
                <Image Name="normalBackgroundImage" Source="{TemplateBinding local:BackgroundImages.NormalBackgroundImage}"/>
                <Image Name="mouseOverBackgroundImage" Source="{TemplateBinding local:BackgroundImages.MouseOverBackgroundImage}" Opacity="0"/>
                <Image Name="pressedBackgroundImage" Source="{TemplateBinding local:BackgroundImages.PressedBackgroundImage}" Opacity="0"/>
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Grid>
        </ControlTemplate>
    </Setter.Value>
</Setter>

对于触发器，请尝试类似的方法。我不确定这一点：（只需将图像添加到项目中的/Images文件夹中）

---

您可以为“正常”、“鼠标悬停”和“按下”（可能更多）状态的背景图像定义附加属性。您可以将这些附加属性用于控件模板中单独图像控件的Sourceproperty，并在VisualState更改时修改例如图像的不透明度。

确保只能在XAML中完成此操作。但首先，如果您想使用

VisualStateManager

，您必须回答一个问题。您使用的是.NET4还是更高版本？这就是原因。@WasimAbu Nassar好的，太好了。我只是描述一下，因为我希望ling.s能提供一个例子。您可以使用多个相互重叠的

图像，但只有一个可见，而另一个不可见。这可以通过将
不透明度
从0更改为1来轻松实现，反之亦然。如果按下或悬停按钮，您忘记添加将正常背景的不透明度更改为0的代码。如果没有这个，就存在混合图像的bug。无论如何，谢谢。只有这段代码100%在没有bug的情况下工作，按钮有3个图像。
<Button local:BackgroundImages.NormalBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Tulips.jpg"
    local:BackgroundImages.MouseOverBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"
    local:BackgroundImages.PressedBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Penguins.jpg"
    Content="Hello"/>

public static class BackgroundImages
{
public static readonly DependencyProperty NormalBackgroundImageProperty =
    DependencyProperty.RegisterAttached("NormalBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));

public static readonly DependencyProperty MouseOverBackgroundImageProperty =
    DependencyProperty.RegisterAttached("MouseOverBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));

public static readonly DependencyProperty PressedBackgroundImageProperty =
    DependencyProperty.RegisterAttached("PressedBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));

public static ImageSource GetNormalBackgroundImage(DependencyObject obj)
{
    return (ImageSource)obj.GetValue(NormalBackgroundImageProperty);
}

public static void SetNormalBackgroundImage(DependencyObject obj, ImageSource value)
{
    obj.SetValue(NormalBackgroundImageProperty, value);
}

public static ImageSource GetMouseOverBackgroundImage(DependencyObject obj)
{
    return (ImageSource)obj.GetValue(MouseOverBackgroundImageProperty);
}

public static void SetMouseOverBackgroundImage(DependencyObject obj, ImageSource value)
{
    obj.SetValue(MouseOverBackgroundImageProperty, value);
}

public static ImageSource GetPressedBackgroundImage(DependencyObject obj)
{
    return (ImageSource)obj.GetValue(PressedBackgroundImageProperty);
}

public static void SetPressedBackgroundImage(DependencyObject obj, ImageSource value)
{
    obj.SetValue(PressedBackgroundImageProperty, value);
}
}

<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0" 
            Background="Transparent">
      <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background">
           <Setter.Value>
               <ImageBrush ImageSource="/MyProjectName;component/Images/MyImage.jpg" />
           </Setter.Value>
        </Setter>
    </Trigger>
</ControlTemplate.Triggers>