- 屏蔽作者: 掘金安东尼
- 举报
收起
查看大图
向左旋转
向右旋转
分享
9
5
- 原先打算使用flutter 开发一个社交应用,包括桌面端,项目过半了,发现第三方sdk对flutter桌面端的支持很差,打算切换到electron。大家有啥意见或建议吗? #码上掘金#4 赞 · 19 评论
- #每天一个知识点#
Jetpack Compose 基于可组合函数构建,下面用最简示例印证和解读
```kotlin
@Composable
fun Greeting(name: String) {
Text(text = "Hello $name!")
}
@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
Greeting("Compose")
}
```
它的核心是可组合函数,用`@Composable`注解标记普通Kotlin函数,和传统View的XML布局、View树模式不同。注解告诉编译器:该函数用来描述UI,可嵌套调用其他`@Composable`函数、参与重组。函数不返回View实例,只声明界面内容,属于声明式UI,描述状态对应的界面,而非命令式修改控件。
`Greeting`接收name参数,调用内置`Text`渲染文本。入参即UI状态,状态变化触发重组,函数重跑生成新UI描述。重组不是全量重绘,编译器记录调用点,只执行受状态影响分支,局部更新带来高性能。
`@Preview`给Android Studio预览使用,不会打入APK。`GreetingPreview`是预览入口,传固定参数调用Greeting,编辑器侧边直接预览,不用开模拟器;`showBackground=true`增加底色,方便看文本范围。
对比传统View:XML是静态布局,拿到控件后调用setText等命令API更新;Compose把UI写在Kotlin中,布局控件逻辑合一,省去布局解析、找控件的开销。可组合函数两点规则:只能在其他`@Composable`函数内调用;参数尽量不可变,状态单独抽取,不要在内部维护可变变量,防止重组异常。
这个小样浓缩了Compose核心:UI由可组合函数嵌套组合,入参驱动界面、状态驱动重组。Text、Button、Column等控件都是系统封装的可组合函数,业务页面就是自定义组件层层拼装,这就是Compose“组合”的含义。7 赞 · 1 评论 - 1 赞 · 2 评论