Jetpack Compose 使用 animateIntAsState 修改 TextField 圆角时动画不启动

你当前的写法是直接在Compose组合作用域内同步修改状态，会导致单次组合过程中状态被合并覆盖，动画初始化时没有前后状态差，因此无法触发动画：

1. 首次组合启动时，animateCornerState初始值为false，animateIntAsState的初始目标值计算为0
2. 组合未完成时就同步执行到if (!animateCornerState.value)逻辑，直接将状态改为true
3. Compose会合并单次组合内的所有状态变更，最终animateIntAsState拿到的初始值和目标值都是50，没有差值，自然不会启动动画，直接显示最终圆角效果。

你加协程延迟后正常运行，本质是靠延迟把状态修改的时机推迟到了首次组合完成、界面已经以0圆角渲染之后，此时修改状态会产生0→50的差值触发动画，但这种依赖硬编码延迟的方式不可靠，会受设备性能影响。

使用LaunchedEffect包裹状态修改逻辑即可，不需要额外加延迟：LaunchedEffect的执行时机是组合完成且首帧渲染结束之后，此时初始状态已经被Compose记录，修改状态会正常触发动画。

只需要把你代码末尾的if判断逻辑替换为以下代码即可：

LaunchedEffect(Unit) {
    animateCornerState.value = true
}

如果你的圆角动画需要绑定其他触发时机（比如用户输入完4位验证码后再触发），只需要把LaunchedEffect的key替换为对应的触发状态即可，例如LaunchedEffect(token.length == 4)。

内容的提问来源于stack exchange，提问作者Vahid