一、缘起

还记得第一次听说Jetpack Compose是在今年9月初在上海举办的Google开发者大会上,当时还拍照想着回家之后查下这是什么新技术，看起来感觉很厉害的样子。

因为之前我很关注Jetpack的所有组件，当时心想为什么从来没有听过这个组件？

后面查阅资源也确实Google并没有发布出来，甚至那个时候官网都查不到任何资料，更别说有alpha版本了。

就在前几天官网上线了Jetpack Compose的最新动态。没错，我们终于可以当第一批吃螃蟹的人了，冲鸭！！！

二、Jetpack Compose 介绍

在开始使用之前我们先简单看下官网对Jetpack Compose的简单介绍。

Jetpack Compose是一个现代工具包，旨在简化UI开发。它结合了响应式编程模型和Kotlin编程语言的简洁性和易用性。它是完全声明性的，它允许通过调用可组合函数来描述UI。然后，框架在后台进行UI优化，当基础状态发生变化时，该框架会自动为您更新视图层次结构。

Google推出Jetpack Compose其主要还是为了简化开发者的UI开发。Jetpack Compose提供了一系列的函数可以实现以往我们通过layout布局实现的页面。简单看下官网的代码示例：

@Composable
fun NewsStory() {
    val image = +imageResource(R.drawable.header)

    Column(
        crossAxisSize = LayoutSize.Expand,
        modifier=Spacing(16.dp)
        ) {
        Container(expanded = true, height = 180.dp) {
            DrawImage(image)
        }

        Text("A day in Shark Fin Cove")
        Text("Davenport, California")
        Text("December 2018")
    }
}

运行效果：

可以看出实现的代码还是挺简洁的。而且这个写法和函数控件名跟Flutter都及其相似，Column纵向布局命名和属性crossAxisSize都一模一样，果然是一个爹生的🤣。

三、如何体验Jetpack Compose

目前Jetpack Compose只在Android Studio 4.0预览版提供，猜测是因为Jetpack Compose需要编译器生成一些代码配合使用。Android Studio 4.0预览版可以通过官网预览版下载。但是有一个坑需要注意，不知道什么原因网站语音为中文环境，点击下载按钮无响应，尝试了很多次之后都无果。最后偶然发现通过网页的右上角语言切换成English就可以正常下载了，不懂Google这是什么操作。

下载完成之后正常打开Android Studio 4.0即可，点击Start a New Android Studio Project,到下图这个页面。默认是选择Empty Activity的，我们需要手动选择Empty Compose Activity，然后就是无脑下一步下一步了，有一点需要注意由于Jetpack Compose不适用于较低的SDK版本，因此请确保minimumSdkVersion至少为21。

项目新建完成之后进入需要下载最新的gradle-wrapper,有些老哥可能通过AS下载gradle很慢，可以通过去Gradle下载手动下载到本地，然后参考Android Studio中手动下载gradle配置下就ok了，之后就可以愉快的体验Jetpack Compose了。

溜了溜了，我继续去探索Jetpack Compose了，老哥们也可以上车了。后续会出一些Demo讲解实际运用。

参考

Jetpack Compose Basics