首页 > 解决方案 > 如何在不同的重组中保持 Lottie 动画进度

问题描述

我正在尝试使用 Lottie compose 在 compose 中播放动画。但是对于所有重组,动画都是从一开始就开始的。我希望保持当前播放并且不为每个重组重新启动动画。这是我当前的代码

@Composable
fun Loader() {
    val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.main))
 LottieAnimation(composition)
}

标签: androidandroid-jetpack-composelottie

解决方案


您需要在可组合功能之外保存动画进度,这将被重新组合

  @Composable
fun ParentComposable() {
    val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.main))
    val animationProgress by animateLottieCompositionAsState(composition = composition)

    ChildComposable(animationProgress = animationProgress, composition = composition)
}

@Composable
fun ChildComposable(animationProgress: Float, composition: LottieComposition?) {
    ...
    Loader(progress = animationProgress, composition = composition)
    ...
}

@Composable
fun Loader(animationProgress: Float, composition: LottieComposition?) {
    ...
    LottieAnimation(composition, animationProgress)
    ...
}

推荐阅读