XAML Review
www.shaxam.com

Animation Controlling

Animation elements inherit several attributes from Timeline that control the speed and behavior of the animation. One of the more useful attributes is SpeedRatio, which controls the speed at which the animation moves. The attribute AutoReverse is also noteworthy. AutoReverse controls the behavior of the Timeline when it reaches the end of its Duration. Setting this value to TRue will cause the animation to reverse itself when it reaches the end of its iteration. Setting it to false will cause the animation to begin againif RepeatBehavior indicates that it should continueeither for a specified number of iterations through the animation, for a specified period of time, or forever.

RepeatBehavior is now declared as 2x and AutoReverse has been added and set to true. This animation will repeat twice, reversing itself each time. Although the animation declaration makes it appear that the Button will have a yellow background at the end of the animation, the background will actually be blue because we have set AutoReverse to true.

Modifying the behavior of an Animation using AutoReverse and RepeatDuration
xmlns="http://schemas.microsoft.com/winfx/avalon/2005"
xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005">

TargetName="myButton"
Path="(Button.Background).(SolidColorBrush.Color)">
From="Blue"
To="Yellow"
Duration="0:0:5"
AutoReverse="true"
RepeatBehavior="2x" />



Name="myButton"
Width="120"
Background="White">A Button


You can mix and match animations within a SetterTimeline to create more interesting effects.
By adding a second animation that animates the width of the Button using a DoubleAnimation. Then, coordinate the Duration of the DoubleAnimation with the Duration of the ColorAnimation and, for both animations, set the AutoReverse to true and the RepeatBehavior to Forever. This creates a Button that begins with a width of 100 and a background color of blue and then slowly expands to a width of 200 and changes its background color to yellow. Both animations then reverse themselves and repeat.

Coordinating multiple animations for a Button
xmlns="http://schemas.microsoft.com/winfx/avalon/2005"
xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005">

TargetName="myButton"
Path="(Button.Background).(SolidColorBrush.Color)">
From="Blue"
To="Yellow"
Duration="0:0:5"
RepeatBehavior="Forever"
AutoReverse="true"/>

TargetName="myButton"
Path="(Button.Width)">
From="100"
To="200"
Duration="0:0:5"
RepeatBehavior="Forever"
AutoReverse="true"/>



Name="myButton"
Width="120"
Background="White">A Button

XAML also includes elements that can transform the position of other elements. RotateTransform, SkewTransform, translateTransform, and ScaleTransform provide basic 2-D transformation capabilities that can easily be used within animations to change the position and size of other elements.

Thanks for Reading.