Xamarin forms animation does not repeat

Question

I am trying to animate an Image in Xamarin.Forms (version 2.3.3.168). The animation is working, but it does not repeat.

public class WelcomePage : ContentPage
{
    Image img;

    public WelcomePage()
    {
        img = new Image
        {
            Source = "img.png",
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center,
        };

        Content = new StackLayout
        {
            VerticalOptions = LayoutOptions.Center,
            Children = {
                img
            }
        };
    }

    protected override void OnAppearing()
    {
        base.OnAppearing();

        var a = new Animation();
        a.Add(0, 0.5, new Animation((v) =>
        {
            img.Scale = v;
        }, 1.0, 1.2, Easing.CubicInOut, () => { System.Diagnostics.Debug.WriteLine("ANIMATION A"); }));
        a.Add(0.5, 1, new Animation((v) =>
        {
            img.Scale = v;
        }, 1.2, 1.0, Easing.CubicInOut, () => { System.Diagnostics.Debug.WriteLine("ANIMATION B"); }));
        a.Commit(img, "animation", 16, 2000, Easing.Linear, (d, f) => img.Scale = 1.0, () =>
        {
            System.Diagnostics.Debug.WriteLine("ANIMATION ALL");
            return true;
        });
    }
}

After running the app for a few seconds, the following debug output is printed:

ANIMATION A
ANIMATION B
ANIMATION ALL
ANIMATION ALL
ANIMATION ALL

I am testing this as a UWP.

Answer 1

According to this thread on the Xamarin forums, others seem to be have the same issue. It seems related to a private property being set in each of the sub-animations.

A workaround is to recreate the animation chain each time the chain completes:

public class WelcomePage : ContentPage
{
    Image img;

    public WelcomePage()
    {
        img = new Image
        {
            Source = "circle_plus.png",
            HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.Center,
        };

        Content = new StackLayout
        {
            VerticalOptions = LayoutOptions.Center,
            Children = {
                img
            }
        };
    }

    protected override void OnAppearing()
    {
        base.OnAppearing();
        animate();
    }

    void animate()
    {
        var a = new Animation();
        a.Add(0, 0.5, new Animation((v) =>
        {
            img.Scale = v;
        }, 1.0, 1.2, Easing.CubicInOut, () => { System.Diagnostics.Debug.WriteLine("ANIMATION A"); }));
        a.Add(0.5, 1, new Animation((v) =>
        {
            img.Scale = v;
        }, 1.2, 1.0, Easing.CubicInOut, () => { System.Diagnostics.Debug.WriteLine("ANIMATION B"); }));
        a.Commit(img, "animation", 16, 2000, null, (d, f) =>
        {
            img.Scale = 1.0;
            System.Diagnostics.Debug.WriteLine("ANIMATION ALL");
            animate();
        });
    }
}