jetpack compose Lottie addAnimataionListener

Question

我想在 Jetpack Compose 中使用 Lottie。这是我的代码

val logoAnimationComposition by rememberLottieComposition(
    spec = LottieCompositionSpec.RawRes(
        resId = R.raw.twitter_logo_motion
    )
)
val logoAnimationProgress by animateLottieCompositionAsState(
    composition = logoAnimationComposition,
    isPlaying = true
)
LottieAnimation(
    modifier = Modifier.size(
        size = logoSize
    ),
    composition = logoAnimationComposition,
    progress = logoAnimationProgress
)

我需要知道这个动画什么时候结束。

我可以用我从我们的 ui 设计师那里知道的动画持续时间来处理它但这不是一个好方法。

并且文档没有说明任何相关内容。

我能做什么？

Answer 1

在 Compose 中，我们不使用侦听器，而是必须读取状态并对它的变化做出反应。

您需要从 animateLottieCompositionAsState 中删除委派，然后您可以访问更多信息，例如您可以检查 isAtEnd。

使用简单的 if 您可以显示其他视图或使用 side effects:

做一些工作

val logoAnimationState = animateLottieCompositionAsState(
    composition = logoAnimationComposition,
    isPlaying = true
)
LottieAnimation(
    modifier = Modifier.size(
        size = logoSize
    ),
    composition = logoAnimationComposition,
    progress = logoAnimationState.progress
)
if (logoAnimationState.isAtEnd) {
    LaunchedEffect(Unit) {
        // to your job
    }
}

jetpack compose Lottie addAnimataionListener

jetpack compose Lottie addAnimataionListener

android

kotlin

lottie

android-jetpack-compose