WPF如何在鼠标悬停在按钮上时更改背景图像答案

【问题标题】：WPF How to change background image when mouse is over the buttonWPF如何在鼠标悬停在按钮上时更改背景图像
【发布时间】：2014-09-24 14:50:24
【问题描述】：

我已经编写了这段代码，用于在按钮中插入带有文本的背景图像。所以我有这个：

<Button Style="{StaticResource TransparentButton}"
        Grid.Column="0"
        Grid.Row="0"
        Command="{Binding Path=MovePreviousCommand}"
        Width="150">
    <Button.Content>
        <StackPanel Orientation="Horizontal">
            <Grid>
                <Image Source="./Resources/Images/bottone_indietro.png" Width="130"/>
                <Label Content="{x:Static res:Strings.GestoreWizardView_Button_MovePrevious}" 
                        HorizontalAlignment="Center" VerticalAlignment="Center" 
                        Margin="48,10,26,8" Style="{StaticResource LabelStyleButton}"
                        />
            </Grid>

        </StackPanel>
    </Button.Content>
</Button>

这是一个样式按钮

<Style TargetType="Button" x:Key="TransparentButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="Transparent">
                    <ContentPresenter/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

现在我想在鼠标悬停按钮时更改背景图像。

我们能帮帮我吗？

最好的后卫。

【问题讨论】：

是按钮的背景还是整个窗口的背景？
是按钮的背景

标签： c# wpf xaml button background-image

【解决方案1】：

如果您想要的图像位于资源文件夹中，这应该可以工作。

<Style x:Key="TransparentButton" TargetType="Button">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Margin" Value="5"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Name="border" 
                    BorderThickness="0" 
                    Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" TargetName="border">
                        <Setter.Value>
                            <ImageBrush ImageSource="Resources/image.jpg" />
                        </Setter.Value>
                    </Setter>
                </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

【讨论】：

我尝试使用你的代码，它可以工作，但背景图像在默认背景图像下，我认为这种在按钮上插入背景图像的方法是错误的 ""
确保您的图像将其构建操作设置为资源。
这里的问题是您在将原始图像添加为内容时设置了按钮背景。它需要匹配，要么作为背景，要么作为内容。
谢谢，我已经解决了我的代码问题，我更改了一个背景图像按钮，如下所示：

【解决方案2】：

为了保持紧凑：

<Image Width="130" >
    <Image.Style>
        <Style TargetType="{x:Type Image}">
            <Setter Property="Source" Value="./Resources/Images/bottone_indietro.png"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Button}}" Value="True">
                    <Setter Property="Source" Value="./Resources/Images/bottone_indietro_altro.png"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

我得到一个无害的设计时异常（运行良好），因为按钮作为祖先只在运行时被检测到。如果这是一个问题，您可以尝试this。

【讨论】：