How do I play a complex animation using coroutine on switching to a particular state?
@Composable
fun SomeView(viewModel: SomeViewModel) {
val state by viewModel.stateFlow.collectAsState()
val scope = rememberCoroutineScope()
...
val shutterAlpha by remember { mutableStateOf(0f) }
Box(modifier = Modifier
.fillMaxSize()
.alpha(shutterAlpha)
.background(Color.Black)
)
val transition = updateTransition(targetState = state, label = "label")
<on transitioning to CaptureState> { // need actual condition check code here
scope.launch {
animate(0f, 1f, animationSpec = tween(150)) { value, _ -> shutterAlpha = value }
animate(1f, 0f, animationSpec = tween(150)) { value, _ -> shutterAlpha = value }
}
}
}
LaunchedEffect is the answer:
@Composable
fun SomeView(viewModel: SomeViewModel) {
val state by viewModel.stateFlow.collectAsState()
...
val shutterAlpha by remember { mutableStateOf(0f) }
Box(modifier = Modifier
.fillMaxSize()
.alpha(shutterAlpha)
.background(Color.Black)
)
LaunchedEffect(state) {
if (state == CaptureState) {
animate(0f, 1f, animationSpec = tween(150)) { value, _ -> shutterAlpha = value }
animate(1f, 0f, animationSpec = tween(150)) { value, _ -> shutterAlpha = value }
}
}
}