AnimatedVisibility

Animate the appearance and disappearance of content.

Basic Usage

var toggle: Boolean by remember { mutableStateOf(false) }

Column {
    Button(onClick = {
        toggle = !toggle
    }) { Text("Click to Show & Hide") }
    AnimatedVisibility(toggle) {
        Box(
            Modifier
                .background(Color.Red)
                .size(100.dp)
        )
    }
}

Custom Enter/Exit

AnimatedVisibility(
    visible = isVisible,
    enter = fadeIn() + slideInVertically(),
    exit = fadeOut() + slideOutVertically()
) {
    Content()
}