Jetpack Compose——AnimatedVisibility的简单使用

首先来看看参数:

ColumnScope.AnimatedVisibility(
    visible: Boolean,//是否可见
    modifier: Modifier = Modifier,//布局修饰
    enter: EnterTransition = fadeIn() + expandVertically(),//进入动画,默认为垂直展开时淡入  
    exit: ExitTransition = fadeOut() + shrinkVertically(),//退出动画,默认情况下垂直收缩时淡出  
    label: String = "AnimatedVisibility",
    content: @Composable AnimatedVisibilityScope.() -> Unit//根据可见值显示或消失的内容
)

使用:

    val visible = remember {
        mutableStateOf(false)
    }
    Column(
        Modifier
            .fillMaxSize()
            .padding(20.dp)
    ) {
        Text(
            text = if (visible.value) "出场动画" else "入场动画",
            modifier = Modifier.clickable { visible.value = !visible.value })
        AnimatedVisibility(visible = visible.value) {
            Text(text = "Compose is coming", fontSize = 30.sp)

        }
    }

效果如图:

Jetpack Compose——AnimatedVisibility的简单使用_第1张图片

 

你可能感兴趣的:(Compose,动画,AnimatedVisibil,Compose)