Using Lottie Animations

A step-by-step tutorial to adding animations to your Swift app

Kacey Jimenez
Jul 8, 2019 · 2 min read

With the release of Lottie, Airbnb has made it so simple to incorporate animations into your Swift projects. In this piece, I will show you step-by-step how you can add beautiful animations into your next application.

Importing Lottie

First things first, we will need to import Lottie. We can do this through the terminal; if you haven’t set Pods up yet do so by typing the following command:

Once that command finishes, you can open up the Podfile using Vim or using TextEdit. Once it is open, copy the following code into your Podfile:

After you finish saving the Podfile, install the Lottie framework with the following command:

Now we are ready to use Lottie in our application. From this point forward, when you open your app, you will need to open up the xcworkspace file.

Adding Animations

Let’s start setting up our storyboard in Xcode.

  1. Drag a view to the canvas.
  2. Type in AnimationView for the custom class of the view.
  3. Control-drag the view to the ViewController file and make an IBOutlet connection and call it AVView.

Now you can either use an existing animation from (which I will be using for this piece) or you can make your own using After Effects. Once you find your desired animation, download it and drag the JSON file into your project from the finder. We will now need to navigate to our ViewController file and import Lottie at the top of the file. In the ViewDidLoad() you will want to enter the following code:

In the code above, we are essentially making a reference to our Lottie JSON file and setting its content mode to whatever we desire. From there, it adds the animation as a subview to our view that we created in the storyboard, then we set its loop mode to either continually loop the animation or play it only once. Now you can run your application and see your Lottie animation come alive!

Better Programming

Advice for programmers.

Kacey Jimenez

Written by

iOS Developer | Scrum Master in Charlotte, NC

Better Programming

Advice for programmers.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade