airbnb / lottie-ios

An iOS library to natively render After Effects vector animations
http://airbnb.io/lottie/
Apache License 2.0
25.78k stars 3.75k forks source link

difference in rendering between .coreAnimation and .mainThread #2060

Open mobiletoly opened 1 year ago

mobiletoly commented 1 year ago

Hi When I use

LottieConfiguration.shared.renderingEngine = .mainThread

configuration - then animation seems to be fine. But when switch to newer .coreAnimation then animation is off. Recordings and lottie JSON files are attached.

Which Version of Lottie are you using?

Lottie 4.2.0

Expected Behavior

For .coreAnimation not to mess up the animation (video is attached)

https://github.com/airbnb/lottie-ios/assets/5142474/aae28ddf-83b3-4ce2-a929-61405da1e646

Actual Behavior

Video is attached

https://github.com/airbnb/lottie-ios/assets/5142474/42831d77-cf08-446a-8b98-c84012897f8b

Animation JSON

data.json.zip

calda commented 1 year ago

Are you testing with renderingEngine: .coreAnimation or renderingEngine: .automatic?

It's expected that renderingEngine: .coreAnimation will sometimes be incorrect. You should prefer using renderingEngine: .automatic, which falls back to the Main Thread rendering engine if it detects the Core Animation rendering engine doesn't support the animation.

mobiletoly commented 1 year ago

yes, I forgot to mention that tested with .automatic as well - same wrong result.

qingqingqingli commented 1 year ago

Just wanna add to this. I'm also experiencing this issue. coreAnimation mode does not render the animation smoothly.

calda commented 1 year ago

This appears to be an issue with how Core Animation itself is interpolating the transform keyframes. If we force this animation to use the expensive "manual interpolation" codepath then the legs are positioned correctly. This introduces other issues, and I'm also not sure how to detect this case dynamically (e.g. we wouldn't want to just "always" use the expensive codepath, because that would hurt performance for all other animations).

For now, using the main thread rendering engine is a good workaround.