Chapter 8 Advanced UI Concepts

Combining Basic Animations

It is entirely possible to combine the basic animations to provide much more complex animations. There are two main ways of achieving this.

Chaining Animations

You can chain animations together into a sequence. A common example here is to provide the appearance of a tile being flipped over and giving a 3D effect to the user. The key detail when chaining animations is that you await each animation method call to make sure that one animation has finished before the next one begins.

await frame.RotateXTo(90, 100);

frame.Content.IsVisible = tileViewModel.IsSelected;

await frame.RotateXTo(0, 100);

Concurrent Animations

In a similar way to chaining, you can perform multiple animations concurrently by simply not awaiting each method call or alternatively awaiting all of the calls.

AddWidgetFrame.Scale = 0;

AddWidgetFrame.IsVisible = true;

AddWidgetFrame.Opacity = 0;

await Task.WhenAll( AddWidgetFrame.FadeTo(1), AddWidgetFrame.ScaleTo(1, 500));

In fact, this animation looks like a very good contender for your actual implementation in the ShowOverlayTriggerAction implementation.

245