/maui-animations

.NET MAUI Animations — API Reference

Built-in ViewExtensions

All animation methods are extension methods on VisualElement and return Task<bool> for await chaining.

• length defaults to 250 ms. easing defaults to Easing.Linear.
• Call view.CancelAnimations() to stop all running animations on that view.

Composite Animations

// Parallel – all run at the same time
await Task.WhenAll(
    view.FadeTo(1, 500),
    view.ScaleTo(1.5, 500),
    view.RotateTo(360, 500));

// Sequential – one after the other
await view.FadeTo(0, 250);
await view.TranslateTo(100, 0, 500);
await view.FadeTo(1, 250);

Custom Animation Class

Use Animation for fine-grained control with child animations and timing ratios.

var parent = new Animation();

// Child animations with begin/end ratios (0.0–1.0)
parent.Add(0.0, 0.5, new Animation(v => view.Opacity = v, 0, 1));
parent.Add(0.5, 1.0, new Animation(v => view.Scale = v, 1, 2, Easing.SpringOut));

// Commit to run
parent.Commit(
    owner: view,
    name: "MyAnimation",
    rate: 16,        // ms per frame
    length: 1000,    // total duration ms
    easing: Easing.Linear,
    finished: (v, cancelled) => { /* cleanup */ },
    repeat: () => false);  // return true to loop

Constructor

new Animation(
    callback: v => view.Scale = v,  // Action<double>
    start: 0.0,
    end: 1.0,
    easing: Easing.CubicInOut);

Cancelling

view.AbortAnimation("MyAnimation");

AnimationExtensions.Animate

Animate any property on any object:

view.Animate<double>(
    name: "opacity",
    transform: v => v,       // Func<double, T>
    callback: v => view.Opacity = v,
    rate: 16,
    length: 500,
    easing: Easing.SinInOut,
    finished: (v, cancelled) => { });

Easing Functions

Custom Easing

var customEase = new Easing(t => t * t * t);
await view.ScaleTo(2, 500, customEase);