jetpack compose 开发架构选择探讨（一）

原有安卓开发架构的选择

在安卓原有view体系中，比较流行的开发架构有MVC、MVP、MVVM、MVI、CLEAN等，由于jetpack compose是声明式ui框架，对于需要持有view引用的mvc mvp等显然无法适用，同时由于clean的重点在于数据以及逻辑的分层，在ui层可以选用MVVM和MVI等，所以本文也不会分析。因此我们主要来分析下MVVM和MVI和jetpack compose的结合

MVVM

说到MVVM开发架构，其实对于原有的安卓view体系中的MVVM并不是完全的MVVM，因为MVVM最初就是为声明式ui来设计的，而原有的安卓view体系并不是声明式ui，因此使用起来总有些不伦不类，不过现在jetpack compose的出现完美的解决这个问题。由于jetpack compose和jetpack viewmodel完美兼容，因此在jetpack compose中实现MVVM和原有view体系中差别并不大，区别就是可以用声明式的方式更方便的完成ui开发。 MVVM

我们来看个简单的例子,我们用MVVM实现一个简单的add count

首先先实现下Content（jetpack compose提倡单向数据流，即将状态提升到Screen中，Content不包含状态，只是单纯的ui界面，便于测试，具体参考官方教程jetpack compose 状态

@Composable

fun Content1(count: Int, click: () -> Unit, click1: () -> Unit) {

Column(

Modifier.fillMaxSize(),

horizontalAlignment = Alignment.CenterHorizontally,

verticalArrangement = Arrangement.Center

) {

Text(text = “The count is $count”)

Button(onClick = click) {

Text(text = “goto screen2”)

}

Button(onClick = click1) {

Text(text = “add”)

}

}

}

然后我们分析下这个例子只有一个count 状态和add 操作，因此这样来实现viewModel,这里基于jetpack viewmodel和livedata组件来实现

class MvvmViewModel : ViewModel() {

val countState = MutableLiveData(1)

fun add(num: Int) {

countState.postValue(countState.value as Int + num)

}

fun reduce(num: Int) {

countState.postValue(countState.value as Int - num)

}

}

接下来我们就需要实现Screen，在Screen中将Content和ViewModel结合起来

@Composable

fun Screen1(

navController: NavController

) {

val viewModel: MvvmViewModel = viewModel()

val count by viewModel.countState.observeAsState(0)

Content1(count = count,

{ navController.navigate(“screen2”) }

) {

viewModel.add(1)

}

}

我们可以看到借助于viewModel()方法我们可以在jetpack compose中很方便快捷的创建viewModel，同时也可以将livedata方便的转换为compose state，当state发生变化时，界面就会自动重组并显示，比原有安卓view体系使用起来方便很多。

MVI

MVI架构大多数人可能不是很了解，不过其实也不是很难，它把mvvm的双向绑定变成单向数据流，强调数据的单向流动和数据源唯一性，state不可变，view通过state渲染数据，viewmodel通过action改变state 在这里插入图片描述

Content代码和MVVM一样

ViewModel代码如下

class MVIViewModel : ViewModel() {

val viewState = MutableLiveData(ViewState())

val userIntent = Channel(Channel.UNLIMITED)

init {

handleAction()

}

private fun add(num: Int) {

viewState.value?.let {

viewState.postValue(it.copy(count = it.count + 1))

}

}

private fun reduce(num: Int) {

viewState.value?.let {

viewState.postValue(it.copy(count = it.count - 1))

}

}

private fun handleAction() {

viewModelScope.launch {

userIntent.consumeAsFlow().collect {

when (it) {

is UiAction.AddAction -> add(it.num)

is UiAction.ReduceAction -> reduce(it.num)

}

}

}

}

data class ViewState(val count: Int = 1)

sealed class UiAction {

class AddAction(val num: Int) : UiAction()

class ReduceAction(val num: Int) : UiAction()

}

}

Screen代码如下

@Composable

fun Screen1(

navController: NavController

) {

val viewModel: MVIViewModel = viewModel(navController = navController)

val viewState by viewModel.viewState.observeAsState(MVIViewModel.ViewState())

val coroutine = rememberCoroutineScope()

Content1(count = viewState.count,

{ navController.navigate(“screen2”) }

) {

coroutine.launch {

viewModel.userIntent.send(MVIViewModel.UiAction.AddAction(1))

}

}

}

通过上诉代码我们应该可以体会出mvvm和mvi之间的区别

多page通信问题

对于一个应用来说，通常不可能只会有一个page，由于mvvm和mvi的viewmodel都是和page绑定的，对于多个page来说，要想实现跨page通信可能比较麻烦，这也是目前mvvm和mvi的一个大问题。不过这个问题也很好解决，我们可以定义一个方法可以获取其他page的viewmodel或者全局的viewmodel即可。不过在compose中该如何实现，首先我们要了解compose中的viewmodel是如何保存的

文末

我总结了一些Android核心知识点，以及一些最新的大厂面试题、知识脑图和视频资料解析。

以后的路也希望我们能一起走下去。（谢谢大家一直以来的支持）

部分资料一览：

• 330页PDF Android学习核心笔记（内含8大板块）

• Android学习的系统对应视频

• Android进阶的系统对应学习资料

• Android BAT大厂面试题（有解析）

《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！
715712793806)]

[外链图片转存中…(img-7PuZjYOH-1715712793810)]

• Android学习的系统对应视频

• Android进阶的系统对应学习资料

[外链图片转存中…(img-n3uaSQUq-1715712793812)]

• Android BAT大厂面试题（有解析）

[外链图片转存中…(img-Yh71Av1k-1715712793813)]
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！