一、Compose动画种类和选择

1.1 选择动画API

1.采用SVG：AnimatedVectorDrawable

是否第三方动画框架：Lottie动画

2.是否需要永久播放：rememberInfiniteTransition

3.布局动画

在内容不同的多个可组合项之间切换

3.1 导航过渡动画：Navigation Compose 是：composable()（已设置 enterTransition 和 exitTransition）

3.2 属性添加动画效果

组件属性动画效果：AnimatedVisibility或animateFloatAsState和Modifier.alpha()

尺寸添加动画效果：Modifier.animateContentSize

列表项动画：animateItemPlacement()（即将推出重新排序和删除功能）

4.属性集动画效果（AnimationSet）

4.1 各个属性是否完全相互独立: 支持：animate*AsState；对于文字，请使用 TextMotion.Animated

要同时开始: 支持：updateTransition，AnimatedVisibility、animateFloat、animateInt 等

不同时开始：使用挂起函数，以不同的时间调用 animateTo 的 Animatable

4.2 动画是否具有一组预定义的目标值

支持：animate*AsState；对于文字，请使用 TextMotion.Animated

手势驱动的动画：是：Animatable 人，animateTo 人，共 snapTo 人

没有状态管理的单次动画？是：AnimationState或 animate

二、属性添加动画效果

2.1 AnimatedVisibility

可见性添加动画效果。

/*** 对AnimatedVisibility动画** @author zhouronghua* @time 2024/9/21 14:25*/
@Composable
fun AnimateVisibilityView(modifier: Modifier = Modifier) {Column(modifier = modifier.fillMaxWidth()) {// 可见性状态var isVisible by remember { mutableStateOf(false) }AnimatedVisibility(visible = isVisible) {Box(modifier = Modifier.size(200.dp).background(Color.Blue))}Button(onClick = {// 切换可见性状态值isVisible = !isVisible}) {Text(text = "可见动画")}}
}

点击按钮，Box会纵向进行收起和展开，展示动画效果。

2.1.2 增加进入和淡出效果

AnimatedVisibility支持叠加进入动画效果 enter和退出动画效果 exit 

/*** 对AnimatedVisibility动画+叠加进入和退出效果** @author zhouronghua* @time 2024/9/21 14:25*/
@Composable
fun AnimateVisibilityFadeInView(modifier: Modifier = Modifier) {Column(modifier = modifier.fillMaxSize()) {// 可见性状态var isVisible by remember { mutableStateOf(false) }Button(onClick = {// 切换可见性状态值isVisible = !isVisible}) {Text(text = "可见动画")}// AnimatedVisibility叠加进入和退出效果AnimatedVisibility(visible = isVisible,enter = slideInHorizontally() + fadeIn(), // 横向滑入+淡入效果exit = slideOutHorizontally() + fadeOut(), // 横向滑出+淡出效果modifier = Modifier.fillMaxWidth().weight(1f)) {Box(modifier = Modifier.background(Color.Blue))}}
}