WPF DataTrigger 对任何数据(绑定)更改 [英] WPF DataTrigger on any data (binding) change
问题描述
每当我的图像源发生变化时,我都想开始一个故事板.我已经实现了 INotifyPropertyChanged.
I want to begin a storyboard, every time my Image source changes. I have implemented INotifyPropertyChanged.
谁能帮我实现这个目标?
Can anyone help me achieve this?
谢谢,
<Image Name="pic" HorizontalAlignment="Center" VerticalAlignment="Center" Source="{Binding ElementName=uc, Path=Image}">
<Image.Resources>
<Storyboard x:Key="picStory" x:Name="picStory">
<DoubleAnimation
Storyboard.TargetProperty="(Image.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)"
From="0" To="20" Duration="0:0:0.7" />
<DoubleAnimation Storyboard.TargetProperty="(Image.RenderTransform).(TransformGroup.Children)[1].(TranslateTransform.Y)" From="100" To="0" Duration="0:0:0.7" />
</Storyboard>
</Image.Resources>
<Image.Style>
<Style TargetType="{x:Type Image}" BasedOn="{StaticResource {x:Type Image}}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Source}">
<DataTrigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource picStory}"/>
</DataTrigger.EnterActions>
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
<Image.RenderTransform>
<TransformGroup>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
绑定到uc"的代码:
private BitmapImage image;
public BitmapImage Image
{
get { return image; }
set
{
image = value;
OnPropertyChanged("Image");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null) PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
}
推荐答案
您可以通过构建一个非常基本的自定义控件(它继承自 Image)以另一种简单的方式实现此目的.
you can achieve this in another simple way by building a very basic custom control, which inherits from Image.
这里是MyImage"的代码:
Here the code for "MyImage":
public class MyImage : Image
{
public static readonly RoutedEvent ImageUpdatedEvent =
EventManager.RegisterRoutedEvent("ImageUpdated", RoutingStrategy.Bubble, typeof(RoutedEventHandler), typeof(MyImage));
public event RoutedEventHandler ImageUpdated
{
add { this.AddHandler(ImageUpdatedEvent, value); }
remove { this.RemoveHandler(ImageUpdatedEvent, value); }
}
public static readonly DependencyProperty MyImageSourceProperty = DependencyProperty.Register(
"MyImageSource",
typeof(ImageSource),
typeof(MyImage),
new PropertyMetadata(null, new PropertyChangedCallback(OnMyImageSourceChanged)));
public ImageSource MyImageSource
{
get { return (ImageSource)GetValue(MyImageSourceProperty); }
set
{
Source = value;
SetValue(MyImageSourceProperty, value);
}
}
private static void OnMyImageSourceChanged(DependencyObject obj, DependencyPropertyChangedEventArgs args)
{
MyImage img = obj as MyImage;
img.Source = args.NewValue as ImageSource;
img.RaiseEvent(new RoutedEventArgs(ImageUpdatedEvent));
}
}
MyImage 控件有它自己的图像源属性和一个名为ImageUpdated"的路由事件,稍后会触发故事板.我已经简化了您的图片代码:
The MyImage control has it's own image source property and an own routed event called "ImageUpdated", which will later cause the storyboard to be triggerd. I have simplified your image code:
<Button Click="Button_Click" Grid.Row="0">Set Image through view model</Button>
<local:MyImage Grid.Row="1" x:Name="pic" MyImageSource="{Binding MySource}">
<Image.Triggers>
<EventTrigger RoutedEvent="local:MyImage.ImageUpdated">
<BeginStoryboard >
<Storyboard >
<DoubleAnimation Storyboard.TargetProperty="(Image.Opacity)" From="0" To="1" Duration="0:0:1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</local:MyImage>
按钮为绑定的视图模型的图像源属性设置一个新值,它实现了INotifyPropertyChanged:
The button sets a new value for the image source property of the bound viewmodel, which implements INotifyPropertyChanged:
private void Button_Click(object sender, RoutedEventArgs e)
{
int randomValue = new Random(DateTime.Now.Second).Next(0, 2);
if (randomValue == 0)
{
_viewModel.MySource = new BitmapImage(new Uri(@"test.bmp", UriKind.Relative));
}
else
{
_viewModel.MySource = new BitmapImage(new Uri(@"test2.bmp", UriKind.Relative));
}
}
viewmodel 中的 setter 使用属性更改模式更新 MyImage:
The setter in the viewmodel updates the MyImage with property changed pattern:
public ImageSource MySource
{
get { return _mySource; }
set
{
_mySource = value;
RaisePropertyChanged("MySource");
}
}
在我的示例中,不透明度属性是动画的.
In my example, the opacity property is animated.
希望对你有帮助
一月
这篇关于WPF DataTrigger 对任何数据(绑定)更改的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!