How to create animations on iOS using Lottie?
Take a look below to see some sample animations you can create in iOS apps with Lottie. Before using Lottie, the first thing you need is the animation data exported as JSON files. If you already have an After Effects animation, use the extension called Bodymovin to create the JSON file. What if you don’t use After Effects?
Table of Contents
Can a Lottie animation be converted to JSON?
If you have the original vector file, Adobe Illustrator, you can reformat the animation process in Adobe After Effects and export it to JSON format. There are stipulations as to whether or not the new JSON animation will convert fine (Lottie has some file limitations), but ideally everything should work without a hitch. I’m not sure?
How does Lottie work in Adobe After Effects?
Lottie works using JSON exported from Adobe After Effects and translates it into native animations for us. To get started, create an animation in Adobe After Effects. Next, use the bodymovin plugin for After Effects to export the animation as JSON. This will serve as a backing store for the animations that Lottie will load from code.
What is Lottie and how does it work?
Developed by Airbnb, Lottie is an iOS, macOS, Android, and React Native library that renders After Effects animations in any native app. Animations are exported as JSON files via an open source After Effects extension called Bodymovin.
What is the name of the animation view in Lottie?
Lottie has a class called LOTAnimationView that loads the animation data from the JSON file. To display the animation, she must create a LOTAnimationView object with the JSON file that she downloaded earlier. LOTAnimationView is a subclass of UIView, so it just implements it like any other view.
Do you need to write code to use Lottie?
You still need to write some code to create the animation, but as you’ll see later, Lottie saves you a great deal of time coding the animation. Lottie is now open source and available on GitHub. It also comes with a sample project and a set of sample animations.