Closed CotunaAurelian closed 6 years ago
It probably has to do with the asynchronous parsing of json.
You can use LottieComposition.Factory
(deprecated and replaced with LottieCompositionFactory
in the soon to be released 2.6.0) to parse the composition ahead of time.
Hello.
I have the same problem; and use LottieComposition.Factory
before playAnimation. It seemed that flicking time is shorter now, but it`s still flicking between two animation.
Hello. I have the same problem; and use
LottieComposition.Factory
before playAnimation. It seemed that flicking time is shorter now, but it`s still flicking between two animation.
I just update lottie 2.5.5 to 2.7.0 and solve the problem
Thanks a lot, this is how I solved this issue on our project:
private val animationLoadedListener = LottieListener<LottieComposition> { composition ->
lottie_animation.setComposition(composition)
// custom method to set repeatcount etc.
lottie_animation.playFromStartThenLoop()
}
private fun setLottieAnimation(index: Int) {
val task = when (index) {
0 -> {
lottie_animation.imageAssetsFolder = "lottie/welcome_1"
LottieCompositionFactory.fromRawRes(this, R.raw.welcome_1)
}
1 -> {
lottie_animation.imageAssetsFolder = "lottie/welcome_2"
//lottie_animation.setAnimation(R.raw.welcome_2)
LottieCompositionFactory.fromRawRes(this, R.raw.welcome_2)
}
/// more cases
}
task.addListener(animationLoadedListener)
task.addFailureListener { Timber.e(it) }
}
Have the same issue but your code doesn't seem to work @carstenhag. Maybe, I did it wrong, so could you give some explanation to your code?
Sure. Trivially (without making use of tasks/listeners) which is what we did previously, the animation was loaded this way:
private fun setLottieAnimation(index: Int) {
when (index) {
0 -> {
lottie_animation.imageAssetsFolder = "lottie/welcome_1"
lottie_animation.setAnimation(R.raw.welcome_1)
}
// ...
My guess is that it flickered with that because it first disabled the old animation, then had to load the new animation from disk and could only then start playing the 2nd animation.
So the code from https://github.com/airbnb/lottie-android/issues/858#issuecomment-634673371 loads the new animation files asynchronously with LottieCompositionFactory.fromRawRes
and task.addListener(animationLoadedListener)
. In the animationLoadedListener we then assign the loaded animation to the Lottie Animation View. Thus, it won't flicker.
@carstenhag, where should you call "setLottieAnimation()"?
On your on tap click listener, or on any other type of listener which provides you the index of the animation or the animation directly.
I changed the setAnimation to setComposition so that it preloads the lottie files before actually showing them.
so instead of:
setAnimation(R.raw.animation)
use:
LottieCompositionFactory.fromRawResSync(requireContext(), R.raw.animation)?.let { result ->
result.value?.let { composition -> setComposition(composition) }
}
That stopped the flickering for me. I also used an AnimationListener for the loop.
private fun setLottieAnimation(lottieView: LottieAnimationView) {
lottieView.apply {
var firstAnimation = true
val loopListener: Animator.AnimatorListener = object : AnimatorListenerAdapter() {
override fun onAnimationRepeat(animation: Animator?) {
if (firstAnimation) {
firstAnimation = false
LottieCompositionFactory.fromRawResSync(requireContext(), R.raw.animation_2)?.let { result ->
result.value?.let { it -> setComposition(it) }
}
repeatCount = LottieDrawable.INFINITE
playAnimation()
}
}
}
LottieCompositionFactory.fromRawResSync(requireContext(), R.raw.animation_1)?.let { result ->
result.value?.let { it -> setComposition(it) }
}
repeatCount = 1
addAnimatorListener(loopListener)
}
}
Can lottie keep last frame on the screen when loading new animation?
Hello guys I have a question. I am adding
LottieAnimationView
to aTabBar
. When I select a tab, I have to change theJSON
to another one that is coloured (to highlight the selected tab). The animation won't start right away, it will be triggered at some point after an event, so I can't play the animation right after it has been drawn in order to force frame redrawing mechanism.When I do this, I can see that the
LottieAnimationView
flickers, and then load the newJSON
file with the highlighted image.I suspect that this is due to a
requestLayout
call, that will remeasure and redraw the wholeLottieAnimationView
and when this happens theJSON
File is parsed asynchronously.Is there a way I can switch the animation on the fly without having that weird flicker?