Use Fluent APIs to process animations in WPF.
Add namespace using.
using EleCho.FluentAnimation.WpfCall the extension method FluentAnimator, it returns a FluentAnimator instance for processing animations.
element.FluentAnimator();Call AnimateBy, AnimateTo, AnimateFromBy, AnimateFromTo methods to process an animation, then call Start method to start these animations.
element.FluentAnimator()
.AnimateTo(ele => ele.Width, 100)
.AnimateTo(ele => ele.Height, 100)
.Start();You can also directly use some wrapped methods for commonly used attributes, such as AnimateWidthTo, AnimateHeightTo.
element.FluentAnimator()
.AnimateWidthTo(100)
.AnimateHeightTo(100)
.Start();You can use methods such as WithDuration, WithEasingFunction to configure all animations.
element.FluentAnimator()
.AnimateWidthTo(100)
.AnimateHeightTo(100)
.WithDuration(200) // 200ms
.WithEasingFunction(
new CircleEase() { EasingMode = EasingMode.EaseOut })
.Start();You can use Delay or Then to control the order of execution of animations.
element.FluentAnimator()
.AnimateWidthTo(100)
.Delay(100) // delay for 100ms
.AnimateHeightTo(100)
.WithDuration(200) // 200ms
.Start();
element.FluentAnimator()
.AnimateWidthTo(100, TimeSpan.FromMilliseconds(200)) // to use continue, you must specify the duration
.Then() // delay for the duration of the previous animation
.AnimateHeightTo(100, TimeSpan.FromMilliseconds(200)) // run the current animation
.Start();Animation with attached property.
element.FluentAnimator()
.AnimateTo(Canvas.LeftProperty, (double)200)
.WithDuration(200)
.Start();Animation with nesting properties.
element.FluentAnimator()
.AnimateTo(ele => ((SolidColorBrush)ele.Background).Color, Colors.Pink)
.WithDuration(200)
.Start();