Xamarin Forms Lottie Animations

What is Lottie ?

Lottie is an iOS, Android, and Xamarin.Forms Native library that renders After Effects animations in real time,allowing apps to use animations as easily as they use static images with the Json file.

Why Lottie?

• This tool or library is very effective and flexible to use.
• Make your animation efficient in any way.
• Small Jason File Size.
• To use the Lite Library is terrible and easy, now also available on Xamarin form. Below I'm  mentioned important URL To check the Git Repository, I want to very thank Martijn van Dijk
https://github.com/martijn00/LottieXamarin 

NuGet package:https://www.nuget.org/packages/Com.Airbnb.Xamarin.Forms.Lottie/2.3.4

Available on NuGet! 

Install-Package Com.Airbnb.Xamarin.Forms.Lottie -Version 2.3.4 

Now i am Install the Lottie Package in all your projects:

 

Here initialize Lottie plugin in both project Android(In MainActivity) and Ios(In AppDelegate) using AnimationViewRenderer.Init(); 
you initialize Lottie plugin in Android Project in MainActivity.

you initialize Lottie plugin in Ios Project AppDelegate.

  

Now we use json, if you don’t have one you can choose  JSON file from here:https://www.lottiefiles.com/

Now you add json in iOS  project and make sure you have the build action in Bundle Resource
select animation json and right, click then click on property.

In Android, add your json and make sure you have the build action in Android Asset.

select animation json and right click, then click on the property. 

Now we write code in xaml and Add the reference  

xmlns:forms=“clr-namespace:Lottie.Forms;assembly=Lottie.Forms“

TADAA!,

you should have your animation working!!

 

Lottie Animation In Android

  Click Here to Complete Source

Lottie Animation in Ios

Click Here to Complete Source Code