Stack Overflow
Stack Overflow

Questions tagged [lottie]

Questions regarding Airbnb's Lottie, a library for rendering After Effects animations in real-time. Use this tag for questions regarding implementations using the Android, iOS, or React-based branches of Lottie.

Lottie allows adding animation to any native app.

Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.

Site: https://airbnb.design/lottie/

836 questions
41
votes
3 answers

How to know when a Lottie animation is completed?

I have a fragment, here is the onCreateView method: @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Inflate the layout for this fragment mView =…
Tom Finet
  • 2,056
  • 6
  • 30
  • 54
24
votes
7 answers

How to add a color overlay to an animation in Lottie?

I'm using Lottie for Android to add some animations in an app. In this app the primary and accent color can be chosen via the settings. I'm using an animation with a transparent background. To make the animation fit the chosen colors I'd like to add…
SolveSoul
  • 2,448
  • 4
  • 25
  • 34
16
votes
6 answers

Lottie animation has large padding. How to resize the animation to the view, by removing the padding

I have a lottie animation file and when I put it in a view it becomes too small because of the file's internal padding. So I have used lottie_scale attribute in xml, and Also LottieComposition as mentioned in some resources like this but none were…
Ali Has
  • 598
  • 1
  • 8
  • 24
14
votes
3 answers

jQuery - Bodymovin JSON not loading

The slider and shuffle lottie animations are supposed to run from 0 to 100 and then back to 0 when toggled; like the box animation. However you can see that the slider animation disappears in the final frame and the shuffle animation seems to only…
Kyle Underhill
  • 89
  • 15
  • 43
14
votes
1 answer

Lottie.Forms - Load from EmbeddedResources

I've got a AnimationView defined in AirBnb's Lottie Framework which should load a file placed inside my Resource folder inside my Xamarin.Forms Project (the portable one)
DirtyNative
  • 2,553
  • 2
  • 33
  • 58
12
votes
1 answer

How to make a Lottie animation loop

I have successfully implemented Lottie into my program by giving it its own view. Although once called, the animation only plays once. How would I make it so the animation loops? LottieView (View with Lottie): import SwiftUI import Lottie struct…
Devin Hadley
  • 149
  • 1
  • 8
12
votes
5 answers

how can I convert a GIF to Lottie json?

As you know we can make a lottie animation by "Adobe After Effect" but I want to know how can I do it by "Photoshop"? Is there any way to convert a GIF to Lottie JSON ?
Mostafa Imani
  • 404
  • 2
  • 7
  • 18
11
votes
3 answers

Pause and Resume Lottie Animation

I'm implementing a Lottie animation and the entire animation works great! However, I would like to add a bit of code that will pause the animation after 30 frames which I can then resume after a certain amount of time. Here is the code so…
Andy Joyce
  • 2,802
  • 3
  • 15
  • 24
11
votes
4 answers

Lottie Animation Library Z Ordering Issue

I'm currently playing around with the AirBnB's Lottie library for Android, and I'm having issues with LottieAnimationView Z ordering. Regardless of whether I place the LottieAnimationView at the top of the RelativeLayout, it always appears on top…
Submersed
  • 8,810
  • 2
  • 30
  • 38
10
votes
2 answers

How to trim a Lottie file without After Effects

I have a 95-frame Lottie file and I want to trim the beginning so it starts at the 15 frame mark. It seems like there should be an easy way to do this, but I don't have After Effects. Is there some online editor or other way I can get a new .json…
Sarah
  • 181
  • 2
  • 8
10
votes
2 answers

How to use lottie animation in flutter app?

I want to animate the Lottie file in the flutter app. I tried searching every corner of the internet and failed to find any info on it. I found out that there is a flutter package "flutter_lottie.dart" and has a function to animate. There is also an…
rahul Kushwaha
  • 2,395
  • 7
  • 32
  • 64
10
votes
1 answer

How to import Json file with React lazy loading?

I want to implement lazy loading in my React app but most of the files are JSON. Few of them are loading when the viewport width is less than e.g. 768px and I don't want to load them in the Desktop app when they are not needed. Is there any way to…
Freestyle09
  • 4,894
  • 8
  • 52
  • 83
10
votes
4 answers

Lottie animation padding

I have a question for the ones of you who have experience using lottie json files. I am not so experienced using lottie so I thought maybe I am missing some obvious knowledge. When I render my animation into a view, the animation object are placed…
Madalin
  • 385
  • 1
  • 5
  • 18
10
votes
4 answers

lottie animation is playing too fast

I added demo animation to the web using lottie, but the playback speed is too fast. How do I get to normal speed? The link below is a problem animation. problem animation link : https://saybgm.github.io/Lottie_example/ My animation :…
SayBGM
  • 103
  • 1
  • 1
  • 5
9
votes
1 answer

Lottie Animation in Native Android Splash Screen

Is it possible to load a Lottie animation in the layout of my splash screen? Currently my splash screen layout is as such: background.xml
Mervin Hemaraju
  • 1,921
  • 2
  • 22
  • 71
1
2 3
…
55 56