snippets
snippets copied to clipboard
The following code may encounter issues when using AnimatedVisibility, as the animation is very uneven
@Preview
@Composable
fun AnimatedVisibilityCookbook() {
var visible1 by remember {
mutableStateOf(true)
}
var visible2 by remember {
mutableStateOf(true)
}
Row(
modifier = Modifier.padding(top = 20.dp).fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(6.dp)
) {
Button(
modifier = Modifier,
onClick = {
visible1 = !visible1
},
shape = RoundedCornerShape(6.dp),
colors = ButtonDefaults.buttonColors(containerColor = Color.White),
contentPadding = PaddingValues(horizontal = 8.dp)
) {
Text(
text = "text",
color = Color.Black,
textAlign = TextAlign.Center
)
}
AnimatedVisibility(
modifier = Modifier.weight(1f),
visible = visible1
) {
Button(
modifier = Modifier,
onClick = { },
shape = RoundedCornerShape(6.dp),
colors = ButtonDefaults.buttonColors(containerColor = Color.White),
contentPadding = PaddingValues(horizontal = 8.dp)
) {
Text(
text = "text1",
color = Color.Black,
textAlign = TextAlign.Center
)
}
}
AnimatedVisibility(
modifier = Modifier.weight(1f),
visible = visible2
) {
Button(
modifier = Modifier,
onClick = { },
shape = RoundedCornerShape(6.dp),
colors = ButtonDefaults.buttonColors(containerColor = Color.White),
contentPadding = PaddingValues(horizontal = 8.dp)
) {
Text(
text = "text2",
color = Color.Black,
textAlign = TextAlign.Center
)
}
}
}
}
Could you attach a video of what you are seeing as an issue here?
actual effect: https://github.com/user-attachments/assets/271c12e6-4bcd-43c9-9866-06792ec3f473
expected effect: https://github.com/user-attachments/assets/c747243d-bf16-45c8-a8f4-43276e81042c
Thanks, is there an error with one of the snippets? If you have the expected effect could you point to what snippet is causing this issue?