Hello,
Is it possible to show a different animation if a certain condition is met? Like this but then I cant access the composition var.
@Composable
fun MyUI() {
when(generate_figure()) {
1 -> {
val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_1)
)
}
2 -> {val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_2))
}
3 -> {val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_3))
}
4 -> {val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_4))
}
5 -> {val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_5))
}
else -> {val composition by rememberLottieComposition(
LottieCompositionSpec.RawRes(resId = R.raw.dice_6))
}
}
var isPlaying by remember {
mutableStateOf(false)
}
val progress by animateLottieCompositionAsState(
composition = composition,
isPlaying = isPlaying,
iterations = 1
)
// whenever progress is changed
// this block is called
LaunchedEffect(key1 = progress) {
// start of animation
// end of animation
if (progress == 1f) {
isPlaying = false
}
}
// render the animation
LottieAnimation(
composition = composition,
progress = { progress }
)
Column(
modifier = Modifier.fillMaxSize(),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
Button(
onClick = {
isPlaying = true
}
)
}
}