Android Jetpack Compose 可组合函数 @Composable

Android Jetpack Compose 里可组合函数这个名字太唬人，一眼看上去，一头雾水。

Composable 的英文翻译

可组合函数，英文原文为 Composable Function。

我一直以为 Compose 只有“写作”的意思，原来其还有“组成”的意思。所以，Composable 可以翻译为“可组合”。

代码中定义 APP 的 UI。

函数前，加上注解 @Composable。例如，使用 Android Studio 中自带的 Empty Compose Activity template 创建的 App，自带一个可组合函数 Greeting。

@Composable
fun Greeting(name: String) {
    Text(text = "Hello $name!")
}

其定义了一个文本组件。

Android Jetpack Compose 一个吸引我的地方是，可以不用启动模拟器就能预览 UI 组件。

方法是，在需要预览的 Composable Function 前加上注解 @Preview。

注意，对于需要传递参数的 Composable Function，需要封装一层，改成无参数化之后，才能预览。例如：

@Preview
@Composable
fun PreviewGreeting() {
    Greeting("Zhongwei Sun")
}

添加 @Preview 之后，代码编辑区域右侧会自动出现预览区域。如图：

点击刷新图标，可以更新改动。