Compose学习记录(3)： ViewModel数据驱动更新组件

1. 前面已经学习过在 Composable 函数中保存UI的状态，然后修改状态来更新UI控件的内容。如：

@Composable
fun Greeting(name: String, modifier: Modifier = Modifier) {
    val expand = rememberSaveable { mutableStateOf(false) }
    // ...使用expand控制是否展开
    // 修改expand的值 expand.value = !expand.value
}

2. 业务状态会放在ViewModel中， ViewModel的状态可能是在后台更新的，当它的属性变动时，如何通知界面更新呢。

使用ViewModel, 在gradle中添加:

implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.6.1")

ViewModel中定义会变动的属性：

class MainPageVModel : ViewModel() {
    private val _acceState = MutableStateFlow(false)
    val acceState: StateFlow<Boolean> = _acceState.asStateFlow()

    private fun onSecondCall(ix: Long) {
        // 查询后台状态，更新到 _acceState中
        val isOpenService = isAccessibilitySettingsOn(AppSession.getContext())
        _acceState.value = isOpenService
    }
}

3. 在UI界面中监听属性，即时更新界面元素
   在Activity中创建ViewMode;

private val viewModel: MainPageVModel by viewModels()

在Compose函数中访问ViewModel

val viewModel: MainPageVModel = viewModel()

在同一个Activity中创建的组件，它们其实只有一个实例共用。

Compose中监听属性的变动：

@Composable
fun MainPage(viewModel: MainPageVModel = viewModel(), modifier: Modifier = Modifier) {
    val ctx = LocalContext.current
    val opend by viewModel.acceState.collectAsState()
    Log.i("MainPage", "View rebuilded! opend: ${opend}")
    // ...使用 opend 来修改属性的显示
}

4. 查看它的具体实现
   它主要是使用的collectAsState()来绑定和读取待更新的数据，它也是一个 @Composable函数，查看它的调用。
   collectAsState()-> produceState() -> remember()
   最后还是到了之前使用的remember(),这些都是@Composable函数，猜测它会在内部监听了State<>的变动，然后触发重新构建了界面节点。

对于其它类型的：
对于 LiveData，需要将 LiveData 转换为 State；
对于 Flow，需要将 Flow 转换为 State。

参考：
https://developer.android.google.cn/codelabs/basic-android-kotlin-compose-viewmodel-and-state?hl=zh-cn#5

原文地址：https://blog.csdn.net/keeng2008/article/details/143951678

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！