I created a UserControl with a complex rectangle in wpf c#, and I want to trigger the animation with a datatrigger which is boud to a property. If I use eventtrigger within the rectangle, it can work as expected, but if I switch to datatrigger, it failed to animate the rectangle... For the animation, credit @Val who posted WPF moving arrow with direction change
- I've tried including the storyboard within < Rectangle.Resource>, and use _storyboard.begin() in code, but failed animate it.
- I've tried including the storyboard inside a which contains a datatrigger that bound to a property named AnimationStart. And also I tried putting the < Style> both inside < UserControl.Resource> and < Rectangle.Resource>, but neither worked.
- I also implemented either INotifyPropertyChanged or DependencyProperty for AnimationStart, but still none of them worked.
- the DependencyProperty: IndicationPoints, LineBackgroundColor, LineBackColor works properly.
now the xaml is as follows
<UserControl.Resources>
<Style x:Key="animationStyle" TargetType="{x:Type Rectangle}">
<Style.Triggers>
<DataTrigger Binding="{Binding AnimationStart}" Value="Start">
<DataTrigger.EnterActions>
<BeginStoryboard x:Name="StartAnimation">
<Storyboard>
<DoubleAnimation
From="0"
To="10"
RepeatBehavior="Forever"
Storyboard.TargetProperty="(Rectangle.Fill).(VisualBrush.Transform).(TranslateTransform.X)"
Duration="0:0:0.1" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
</DataTrigger>
<DataTrigger Binding="{Binding AnimationStart}" Value="Stop">
<DataTrigger.EnterActions>
<StopStoryboard x:Name="StopAnimation" BeginStoryboardName="StartAnimation"/>
</DataTrigger.EnterActions>
</DataTrigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
<Rectangle x:Name="rectangleLine" Style="{StaticResource animationStyle}" Width="auto" Height="auto" Margin="0">
<Rectangle.RenderTransform>
<RotateTransform Angle="0" />
</Rectangle.RenderTransform>
<Rectangle.Fill>
<VisualBrush TileMode="Tile" Viewport="0,0,10,8" ViewportUnits="Absolute" Viewbox="0,0,8,8" ViewboxUnits="Absolute">
<VisualBrush.Transform>
<TranslateTransform X="0" Y="0" />
</VisualBrush.Transform>
<VisualBrush.Visual>
<Grid x:Name="gridMoving">
<Polygon x:Name="polygonMovingBack" Fill="{Binding LineBackColor}" Points="0,0 8,0 8,8 0,8" />
<Polygon x:Name="polygonMoving" Fill="{Binding LineBackgroundColor}" Points="{Binding IndicationShape}" />
</Grid>
</VisualBrush.Visual>
</VisualBrush>
</Rectangle.Fill>
<Rectangle.Resources>
<Storyboard x:Key="startAnimation">
<DoubleAnimation
From="0"
To="10"
RepeatBehavior="Forever"
Storyboard.TargetProperty="(Rectangle.Fill).(VisualBrush.Transform).(TranslateTransform.X)"
Duration="0:0:0.1" />
</Storyboard>
</Rectangle.Resources>
<!--<Rectangle.Triggers>
<EventTrigger RoutedEvent="Control.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
From="0"
To="10"
RepeatBehavior="Forever"
Storyboard.TargetProperty="(Rectangle.Fill).(VisualBrush.Transform).(TranslateTransform.X)"
Duration="0:0:0.1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Rectangle.Triggers>-->
</Rectangle>
and the code behind
public PointCollection IndicationPoints
{
get
{
return (PointCollection)GetValue(IndicationPointsProperty);
}
set
{
SetValue(IndicationPointsProperty, value);
}
}
public SolidColorBrush LineBackgroundColor
{
get
{
return (SolidColorBrush)GetValue(LineBackgroundColorProperty);
}
set
{
SetValue(LineBackgroundColorProperty, value);
}
}
public SolidColorBrush LineBackColor
{
get
{
return (SolidColorBrush)GetValue(LineBackColorProperty);
}
set
{
SetValue(LineBackColorProperty, value);
}
}
public string AnimationStart {
get => _animationStart;
set {
_animationStart = value;
NotifyPropertyChanged("AnimationStart");
} }
private string _animationStart;
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(string info)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(info));
}
}
public static readonly DependencyProperty IndicationPointsProperty
= DependencyProperty.Register("IndicationPoints", typeof(PointCollection), typeof(UI_MovingLine), new PropertyMetadata(new PointCollection(new List<Point> { new Point(0,0), new Point(4, 0), new Point(8, 4), new Point(4, 8), new Point(0, 8), new Point(4, 4) }), new PropertyChangedCallback(OnIndicationPointsChanged)));
public static readonly DependencyProperty LineBackgroundColorProperty
= DependencyProperty.Register("LineBackgroundColor", typeof(SolidColorBrush), typeof(UI_MovingLine), new PropertyMetadata(new SolidColorBrush(Colors.Gray), new PropertyChangedCallback(OnLineBackgroundColorChanged)));
public static readonly DependencyProperty LineBackColorProperty
= DependencyProperty.Register("LineBackColor", typeof(SolidColorBrush), typeof(UI_MovingLine), new PropertyMetadata(new SolidColorBrush(Colors.Gray), new PropertyChangedCallback(OnLineBackColorChanged)));
private static void OnIndicationPointsChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var control = d as UI_MovingLine;
control.OnIndicationPointsChanged(e);
}
private void OnIndicationPointsChanged(DependencyPropertyChangedEventArgs e)
{
polygonMoving.Points = (PointCollection)e.NewValue;
}
private static void OnLineBackgroundColorChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var control = d as UI_MovingLine;
control.OnLineBackgroundColorChanged(e);
}
private void OnLineBackgroundColorChanged(DependencyPropertyChangedEventArgs e)
{
polygonMoving.Fill = (SolidColorBrush)e.NewValue;
}
private static void OnLineBackColorChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var control = d as UI_MovingLine;
control.OnLineBackColorChanged(e);
}
private void OnLineBackColorChanged(DependencyPropertyChangedEventArgs e)
{
polygonMovingBack.Fill = (SolidColorBrush)e.NewValue;
}
public UI_MovingLine()
{
InitializeComponent();
gridMoving.DataContext = this;
polygonMoving.DataContext = this;
LineMovingToNomal();
}
public void LineMovingToNomal()
{
try
{
_transmitLineStatus = PowerSystem.TransmitLineStatus.TLS_NORMAL;
IndicationPoints = new PointCollection(new List<Point> { new Point(0, 0), new Point(4, 0), new Point(8, 4), new Point(4, 8), new Point(0, 8), new Point(4, 4) });
LineBackgroundColor = new SolidColorBrush(Colors.DodgerBlue);
LineBackColor = new SolidColorBrush(Colors.White);
AnimationStart = "Start";
}
catch
{
}
}
