Android Jetpack Compose是否支持自动动画？如何实现页面启动时文本自动动画？

Compose确实以状态驱动为核心，但要实现页面打开时自动触发动画，无需手动交互，有几种简洁的方式，对应View系统中onCreate的时机：

方法1：用LaunchedEffect触发状态式动画 #

通过remember创建动画状态，再用LaunchedEffect在Composable首次组合时自动启动动画，这是最贴合Compose设计的方案：

@Composable
fun AutoAnimatedText() {
    // 定义动画状态：从完全透明过渡到完全显示
    var isVisible by remember { mutableStateOf(false) }
    val alpha by animateFloatAsState(
        targetValue = if (isVisible) 1f else 0f,
        animationSpec = tween(durationMillis = 1000) // 对应XML动画的时长配置
    )

    // 页面启动时自动触发状态变更，启动动画
    LaunchedEffect(Unit) {
        isVisible = true
    }

    Text(
        text = "自动播放的动画文本",
        modifier = Modifier.alpha(alpha),
        fontSize = 24.sp
    )
}

方法2：用AnimatedVisibility实现进入动画 #

如果是类似"进场动画"的场景，可结合AnimatedVisibility和LaunchedEffect快速实现：

@Composable
fun EnterAnimatedText() {
    var isVisible by remember { mutableStateOf(false) }

    LaunchedEffect(Unit) {
        isVisible = true
    }

    AnimatedVisibility(
        visible = isVisible,
        enter = fadeIn(tween(1000)) + slideInHorizontally(initialOffsetX = { -it }),
        exit = fadeOut()
    ) {
        Text(
            text = "带滑动效果的进场文本",
            fontSize = 24.sp
        )
    }
}

方法3：复用原有XML动画（兼容旧资源） #

如果想继续使用R.anim.example这类已有的XML动画资源，可通过AndroidView包装原生TextView实现：

@Composable
fun ReuseXmlAnimationText() {
    AndroidView(factory = { context ->
        TextView(context).apply {
            text = "复用XML动画的文本"
            textSize = 24f
            // 逻辑和View系统中完全一致，在View创建时启动动画
            val animation = AnimationUtils.loadAnimation(context, R.anim.example)
            startAnimation(animation)
        }
    })
}

核心说明 #

• LaunchedEffect(Unit)：因为Unit是固定常量，所以只会在Composable首次渲染时执行一次，完全对应onCreate的触发时机。
• 状态驱动：所有动画都通过变更状态触发，符合Compose的核心设计原则。
• 自定义动画：如果需要更复杂的效果，可替换animationSpec为spring()（弹性动画）、repeatable()（重复动画）等自定义配置。

内容的提问来源于stack exchange，提问作者Mr.Droid