Apply Lottie Animations In Xamarin.Android

Lottie is a library created by Airbnb. I saw people were frustrated because Lottie was not working for them. So, in this post, I will try to explain how to make it work.

Lottie is a library created by Airbnb. It provides a good animation for Andorid as well as iOS in Xamarin. A special thanks to Martijn van Dijk for this.This awesome library is also available on Xamarin.

I saw people were frustrated because Lottie was not working for them. So in this post I will try to explain how to make it work.

For the first step, we will configure Xamarin.Android step by step.

Install the Lottie Xamarin.Android project.



Add your View code in your XAML.

Code

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white">
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="32dp">
        <com.airbnb.lottie.LottieAnimationView
            android:id="@+id/animation_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            app:lottie_fileName="Logo/video_cam.json"
            app:lottie_loop="true" />
    </FrameLayout>
</LinearLayout>

Write the code to play Animation in CS file.

Code

using Android.App;
using Android.OS;
using Com.Airbnb.Lottie;

namespace demo
{
    [Activity (Label = "demo", MainLauncher = true, Icon = "@mipmap/icon")]
    public class MainActivity : Activity
    {
        private LottieAnimationView animationView;

        protected override void OnCreate (Bundle savedInstanceState)
        {
            base.OnCreate (savedInstanceState);
            SetContentView (Resource.Layout.Main);
            this.animationView = FindViewById<LottieAnimationView> (Resource.Id.animation_view);
        }
        protected override void OnStop ()
        {
            base.OnStop ();
            this.animationView.CancelAnimation ();
        }

        protected override void OnStart ()
        {
            base.OnStart ();
            this.animationView.Progress = 0f;
            this.animationView.PlayAnimation ();
        }
    }
}

Place a JSON file in the Assets foler. The main point here is to check if the build action in Android asset is checked or not.



Compile your Android project. Yes, it is working here.

Feel free to comment if you are not able to configure it.

• Source Code