Раскадровка кнопок WPF с изображением для MouseOver
-
23-09-2019 - |
Вопрос
У меня есть следующий xaml для изменения изображения кнопки WPF, когда мышь находится на кнопке.Это дает ошибку ниже.Любая помощь приветствуется...
Объект анимации «System.Windows.Media.Animation.DoubleAnimation» нельзя использовать для анимации свойства «Source», поскольку он имеет несовместимый тип «System.Windows.Media.ImageSource».
<Style TargetType="{x:Type local:ButtonControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:ButtonControl}">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="img"
Storyboard.TargetProperty="Source"
To="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=MouseOverImage}"
/>
</Storyboard>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border>
<Image x:Name="img"
Source="pack://application:,,,/Recipe_06_13;component/Resources/normal.bmp"
/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Решение
DoubleAnimation используется для анимации свойства зависимости типа double.Следовательно, его нельзя использовать для «анимации» источника изображения.Чтобы добиться того, что вы делаете, я бы поступил немного по-другому.Я бы привязал источник изображения к свойству кода и зафиксировал события MouseEnter и MouseLeave, чтобы изменить это свойство.
XAML
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="336" Width="354">
<Grid x:Name="myGrid">
<Image
x:Name="myImage"
Stretch="UniformToFill"
Source="{Binding MyImageSource}"
VerticalAlignment="Top" />
</Grid>
</Window>
Код позади:
namespace WpfApplication1
{
using System.ComponentModel;
using System.Windows;
using System.Windows.Input;
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class Window1 : Window, INotifyPropertyChanged
{
public Window1()
{
this.MyImageSource = "/image_normal.png";
InitializeComponent();
this.DataContext = this;
myImage.MouseEnter += new MouseEventHandler(myGrid_MouseEnter);
myImage.MouseLeave += new MouseEventHandler(myGrid_MouseLeave);
}
private string _myImageSource;
public string MyImageSource
{
get
{
return _myImageSource;
}
set
{
if (_myImageSource != value)
{
_myImageSource = value;
if (PropertyChanged != null)
{
PropertyChanged.Invoke(this, new PropertyChangedEventArgs("MyImageSource"));
}
}
}
}
void myGrid_MouseLeave(object sender, MouseEventArgs e)
{
this.MyImageSource = "/image_normal.png";
}
void myGrid_MouseEnter(object sender, MouseEventArgs e)
{
this.MyImageSource = "/image_hover.png";
}
#region INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
#endregion
}
}
Не связан с StackOverflow