search

airbnb / lottie-android

Render After Effects animations natively on Android and iOS, Web, and React Native
http://airbnb.io/lottie/
Apache License 2.0
35.03k stars 5.41k forks source link

Rendering bug while using Jetpack Compose LottieAnimation for some animation jsons #1803

Closed hongwei-bai closed 3 years ago

hongwei-bai commented 3 years ago

Hey I am using Lottie for long time, and it's awesome. However, I have a few problems recently while migrating my codebase to Jetpack Compose. The Lottie animation is from here: https://lottiefiles.com/14429-tv It works perfectly on xml layout. But it doesn't while using Jetpack Compose LottieAnimation. Some of the graphs are missing. For example: the face of the person is missing, similar things happen to a few other elements. image

The normal one: image

My Lotte-Compose version is 'com.airbnb.android:lottie-compose:1.0.0-beta03-1', and I even tried to downgrade but still not working. Lottie version is: com.airbnb.android:lottie:3.7.0 Jetpack Compose version: ext.compose_version = "1.0.0-beta05"

Steps to reproduce the behavior:

  1. Using xml layout Lottie animation for: https://lottiefiles.com/14429-tv, it works perfectly!
  2. In the same App, using LottieAnimation in Jetpack Compose, it doesn't render correctly.

Hope you get a chance to have a look at. Much appreciated! bhw

apoehlmann commented 3 years ago

I have the same issue without lottie-compose. We are using the lottie version 3.7.0 and could see the issue only on some devices.

gpeal commented 3 years ago

@hongwei-bai try disabling merge paths @apoehlmann Try using the software render mode (set via XML attr or a method on LottieAnimationView/LottieDrawable)

hongwei-bai commented 3 years ago

@gpeal , thanks! disabling merge paths works!