jetpack compose是google推出的用于构建原生界面的新android 工具包，它可简化并加快 android上的界面开发。jetpack compose是一个声明式的ui框架，随着该框架的推出，标志着android 开始全面拥抱声明式ui开发。jetpack compose存在很多优点：代码更加简洁直观、应用开发效率显著提升、kotlin api功能直观、预览工具强大等。
为了获得更好的开发体验，笔者这里使用的是android studio canary版本，这样可以无需配置一些设置和依赖。（下载地址）
打开工程，新建empty compose activity 模版，需要注意的是根目录下的build.gradle，相关的依赖com.android.tools.build和org.jetbrains.kotlin版本需要对应，否则可能出现出错的情形，这里使用的是：
这样就完成了项目的新建。
jetpack compose提供了一些功能强大且可扩展的 api，可用于在应用界面中轻松实现各种动画效果。下文将会对jetpack compose animations的常用方法进行介绍。
jetpack compose动画是通过对状态的监听，即监听状态值的变化，使ui能实现自动更新。可组合函数可以使用 remember或者 mutablestateof监听状态值的变化。如果状态值是不变的，remember函数会在每次重新组合中保持该值；如果状态是可变的，它会在值发生变化的时候触发重组，mutablestateof将得到一个mutablestate对象，它是一个可观察类型。
这种重组是创建状态驱动动画的关键。利用重组，它们会在可组合组件的状态发生任何变化时被触发。compose动画是由state驱动的，动画相关的api也较容易上手，能比较容易创造出漂亮的声明式动画。
首先看下函数定义:
可以看出默认的动画是淡入放大、淡出收缩，实际中通过传入不同函数实现各种动效。
随着可见值的变化，animatedvisibility可为其内容的出现和消失设置动画。如下代码，可以通过点击button，控制图片的出现和消失。
通过监听visible的变化，可实现图片的可见性动画，效果如小图所示；
先看下函数的定义：
可以为布局大小动画设置动画速度和监听值。
由函数的定义可以看出这个函数本质上就modefier的一个扩展函数。可以通过变量size监听状态变化实现布局大小的动画效果，代码如下：
通过button的点击，监听size值的变化，利用animatecontentsize（）实现动画效果，具体动效如下图所示：
crossfade可以通过监听状态值的变化，使用淡入淡出的动画在两个布局之间添加动画效果，函数自身就是一个composable，代码如下：
同样通过监听fadestatus的值，实现布局切换的动画，具体的动效如图所示：
为单个值添加动画效果。只需提供结束值（或目标值），该 api 就会从当前值开始向指定值播放动画。
jetpack compose 提供了很多内置函数，可以为不同类型的数据制作动画，例如：animatecolorasstate、animatedpasstate、animateoffsetasstate等，这里将介绍下animatefooasstate的使用，代码如下：
动画效果如下图所示：
transition 可同时追踪一个或多个动画，并在多个状态之间同步这些动画。具体的代码如下：
其中，imageposition、changeposition分别为定义的枚举类、自定义函数。
动画的如下图所示：
jetpack compose 已将动画简化到只需在我们的可组合函数中创建声明性代码的程度，只需编写希望 ui 动画的方式，其余部分由 compose 管理。最后，这也是是 jetpack compose 的主要目标：创建一个声明式 ui 工具包来加速应用程序开发并提高代码可读性和逻辑性。
jetpack compose提供的声明式ui工具包，能做到使用更少的代码实现更多的功能，且代码的可读性和逻辑性也大大提高了。
作者：vivo互联网游戏客户端团队-ke jie