Adobe After Effects Animation On Android
Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations exported as json with Bodymovinand renders them natively on mobile!
Link:- http://airbnb.io/lottie/
Github:- https://github.com/airbnb/lottie-android
dependencies {
...
implementation "com.airbnb.android:lottie:$lottieVersion"
...
}
Lottie supports API 16 and above.
Lottie animations can load animations from:
- A json animation in
src/main/res/raw
. - A json file in
src/main/assets
. - A zip file in
src/main/assets
. - A url to a json or zip file.
- A json string. The source can be from anything including your own network stack.
- An InputStream to either a json file or a zip file.
simplest way is to include the animation file from res/raw to xml code
<com.airbnb.lottie.LottieAnimationView
android:id="@+id/animation_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:lottie_rawRes="@raw/hello_world"
// or
app:lottie_fileName="hello_world.json"
// Loop indefinitely
app:lottie_loop="true"
// Start playing as soon as the animation is loaded
app:lottie_autoPlay="true" />
Detailed Steps:-
Bodymovin is an After Effects plugin created by Hernan Torrisi that exports After effects files as json and includes a javascript web player. We’ve built on top of his great work to extend its usage to Android, iOS, and React Native.
- Create animation in Adobe After Effects
- Export it using Bodymovin to json
- Include the exported file in android res/raw folder
- Include lottie library
- include lottie XML code
- app:lottie_rawRes=”@raw/hello_world” replace hellow world with your file name in XML code.
Library Details:-
Link:- http://airbnb.io/lottie/
Github:- https://github.com/airbnb/lottie-android
- Language : Java
- License: Apache 2.0