Jetpack Compose 初体验

1、缘起

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

由于以前我很关注Jetpack的全部组件，当时心想为何历来没有听过这个组件？

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

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

2、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都如出一辙，果真是一个爹生的🤣。

3、如何体验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