XAML C # WPF Best Effective Way to Order an Animated Sequence

Question

I would like to make a sequence of animations on the label, for example, first make opaque animations from values ​​from 0 to 1 and vice versa, and only at the end of the opacity animation, and not before the foreground animation. I would like to do this in XAML code, and then start and end the animation with C # code. What is the best and most effective way to do this?

All answers are welcome!

Thanks in advance.

Answer 1

The easiest way is to define the entire animation in one storyboard with the appropriate BeginTime and Duration properties. Thus, the entire animation can be started and stopped as a unit, but you can have different sequences.

For example:

 <Storyboard Duration="0:00:06"> <DoubleAnimation Duration="0:0:4" Storyboard.TargetName="gear1RotateTransform" Storyboard.TargetProperty="Angle" From="-600" To="0"/> <DoubleAnimation Duration="0:0:4" Storyboard.TargetName="gear2RotateTransform" Storyboard.TargetProperty="Angle" From="600" To="0"/> <DoubleAnimation Duration="0:0:4" Storyboard.TargetName="gear3RotateTransform" Storyboard.TargetProperty="Angle" From="-600" To="0"/> <DoubleAnimation BeginTime="0:0:1" Duration="0:00:02" Storyboard.TargetName="firstLetter" Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"/> <DoubleAnimation BeginTime="0:0:2" Duration="0:00:02" Storyboard.TargetName="secondLetter" Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"/> <DoubleAnimation BeginTime="0:0:3" Duration="0:00:02" Storyboard.TargetName="thirdLetter" Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"/> <DoubleAnimation BeginTime="0:0:4" Duration="0:00:02" Storyboard.TargetName="siteLink" Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"/> <DoubleAnimation BeginTime="0:0:4" Duration="0:00:02" Storyboard.TargetName="siteLinkTop" Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"/> </Storyboard> 

This storyboard changes the values ​​by 3 rotational transforms within the first 4 seconds, but the opacity in the firstLetter element firstLetter not begin to change until after one second passes, and it only works for 2 seconds. The siteLink and siteLinkTop do not change their opacity until after 4 seconds (and the animation of the rotation of the transfer ends).