我如何改变一个图像悬停在WPF背后的代码动态

本文关键字:WPF 悬停 动态 代码 图像 背后 何改变 改变 一个 | 更新日期: 2023-09-27 18:15:23

如何动态更改WPF中悬停在上方的图像我从数据库读取图像,也读取悬停图像如何为图像源和悬停源编写代码?

我如何改变一个图像悬停在WPF背后的代码动态

您可以利用MouseEnterMouseLeave事件并在代码后面更改Image.Source,但是当IsMouseOvertrue时,为什么不使用Triggers来更改Image.Source呢?这样,当鼠标离开控件时,您将不必处理状态,因为它将简单地重新评估您的样式并恢复到以前的图像源。

触发的例子:

<ContentControl>
   <ContentControl.Resources>
      <BitmapImage UriSource="ad.png" x:Key="ImgBtnLightbulbOff"/>
      <BitmapImage UriSource="ae.png" x:Key="ImgBtnLightbulbOn"/>
   </ContentControl.Resources>
   <ContentControl.Template>
      <ControlTemplate TargetType="{x:Type ContentControl}">
         <Image Source="{StaticResource ImgBtnLightbulbOff}" x:Name="PART_Image"/>
         <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
               <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource ImgBtnLightbulbOn}"/>
            </Trigger>
         </ControlTemplate.Triggers>
      </ControlTemplate>
   </ContentControl.Template>
</ContentControl>

Image必须包装在其他控件中,因为IsMouseOver触发器不能单独改变Image上的Source。我使用Resource图像,但它们可以从任何地方拍摄,例如数据绑定。

但是如果你仍然需要在后面的代码中这样做,这里有一个例子:
XAML

<Image Source="{StaticResource ImgBtnLightbulbOff}" 
   MouseEnter="Image_MouseEnter" 
   MouseLeave="Image_MouseLeave"/>
代码:

private void Image_MouseLeave(object sender, MouseEventArgs e)
{
   var img = sender as Image;
   img.Source = (ImageSource)img.FindResource("ImgBtnLightbulbOff");
}
private void Image_MouseEnter(object sender, MouseEventArgs e)
{
   var img = sender as Image;
   img.Source = (ImageSource)img.FindResource("ImgBtnLightbulbOn");
}