一、animateContentSize修饰符可为大小变化添加动画效果
如果想为容器大小变化添加动画和使用该修饰符，用法如下：
modifier = Modifier.animateContentSize()当然了，如果想修改动画类型和处理动画结束监听事件，我们可以为其指定animationSpce和finishedListener，finishedListener回调有initialValue（动画开始前的初始值）和targetValue（动画结束后的目标值）两个参数。下面写个简单的例子：
@Composable
fun compose_animateContentSize(){
var message by remember { mutableStateOf("Hello") }
Column() {
Button(onClick = { message += message}) {
Text("change")
}
Box(
modifier = Modifier
.background(Color.Blue)
.animateContentSize(
animationSpec = tween(),
finishedListener = { initialValue, targetValue ->
Log.e("animateContentSize","初始值："+initialValue.width + "," + initialValue.height);
Log.e("animateContentSize","目标值："+targetValue.width + "," + targetValue.height);
}
)
) {
Text(text = message, color = Color.White)
}
}
}二、Crossfade可使用淡入淡出动画在两个布局之间添加动画效果
这里需要注意的是Crossfade不是修饰符，而是可组合函数，里面有targetState和content必传参数，targetState用于指定当前布局状态，content是显示的内容；有modifier和animationSpec两个可选参数，modifier用于修饰Crossfade，animationSpec用于指定动画类型，使用如下：
@Composable
fun compose_crossfade() {
var currentPage by remember { mutableStateOf(1) }
Column {
Button(onClick = { currentPage = if (currentPage == 1) 2 else 1 }) {
Text("change")
}
Crossfade(
targetState = currentPage,
modifier = Modifier
.fillMaxSize()
.background(if (currentPage == 1) Color.White else Color.Blue),
animationSpec = spring()
) { screen ->
when (screen) {
1 -> Text("这是第一个页面", color = Color.Black)
2 -> Text("这是第二个页面", color = Color.White)
}
}
}
}
