Jetpack Compose中Lottie文件在LazyColumn内无法加载如何解决？

排查步骤 #

• 首先检查LazyColumn中动画项的复用回收逻辑：LazyColumn默认会回收滚出屏幕的Composable节点，如果你的Lottie动画状态没有绑定到唯一的item key上，回收后重新挂载时会丢失动画加载状态，而Column是一次性加载所有子节点不会回收，所以不会触发这个问题。
• 检查LottieComposition的加载方式：如果使用的是rememberLottieComposition 没有传入稳定的key参数，或者key和item的唯一标识不绑定，LazyColumn滚动复用item时会重复触发加载，甚至加载错误的动画资源。
• 检查动画项的大小约束：LazyColumn默认对子项的测量约束和Column不同，如果你的Lottie动画没有指定明确的modifier.size() 等尺寸参数，LazyColumn的懒加载测量逻辑可能会给动画分配0尺寸，导致不可见，而Column的测量逻辑会优先满足子项的固有尺寸，所以可以正常展示。
• 检查动画的自动播放配置：如果你的animateLottieCompositionAsState 没有传入正确的restartOnPlay、iterations 参数，或者播放状态没有和item的可见性绑定，item被回收重新显示时不会自动触发播放，看起来就像没有加载成功。

对应解决方案 #

• 给LazyColumn的每个item绑定唯一key：在LazyColumn的items方法中传入key参数，每个item的key和对应的数据/动画资源唯一绑定，避免复用逻辑混乱：

LazyColumn {
    items(animationList, key = { it.id }) { item ->
        // Lottie动画项实现代码
    }
}

• 给Lottie加载逻辑绑定item级别的稳定key：调用rememberLottieComposition时把当前item的唯一标识或者动画资源id作为key传入，确保复用item时加载的是对应正确的动画：

val composition by rememberLottieComposition(
    key1 = item.animationResId,
    spec = LottieCompositionSpec.RawRes(item.animationResId)
)

• 给Lottie组件明确指定尺寸：不要使用无约束的wrapContentSize类尺寸配置，明确设置modifier.size(200.dp)或者modifier.fillMaxWidth().height(200.dp)，确保LazyColumn测量时能给动画分配正确的显示空间。
• 配置动画自动重启逻辑：调用animateLottieCompositionAsState时设置restartOnPlay = true，或者监听item的可见性状态，item进入视口时重置播放状态：

val progress by animateLottieCompositionAsState(
    composition = composition,
    iterations = LottieConstants.IterateForever,
    restartOnPlay = true
)

内容的提问来源于stack exchange，提问作者user14004870