MVI(Model-View-Intent)是 Google 应用架构指南中推荐的架构模式,它主要解决了传统架构模式中可能存在的状态管理复杂,耦合度高,测试困难等问题,这篇文章旨在从零开始搭建一个 MVI 架构,使我们的业务代码更加简洁优雅,提高后续的开发效率。
简介
MVI 架构由三个主要部分组成:Model,View 和 Intent,每部分都有各自明确的职责。
模型(Model):应用程序的数据层,负责管理数据的状态和提供数据操作的方法。
视图(View):用户界面的表示,负责显示数据并响应用户的操作。
意图(Intent):用户的操作或事件,该事件将传递给模型来执行相应的操作。
在 MVVM 架构中,ViewModel 从数据层获取数据,通过 ViewModel 层的数据变化驱动 UI 更新,而在 MVI 中,不同的是,MVI 是做 UI 状态的集中管理,简言之就是将所有的状态写在一个类中,可以是密封类或普通类,并以单向数据流的形式,将 UI 状态输出到 UI 层,UI 层根据状态做相应的处理。举个例子:Activity 向 ViewModel 发送 Intent 事件,ViewModel 集中处理用户操作,也就是用户意图事件的统一管理。
MVI 架构的两个主要特点就是 UI 状态的集中管理和单向数据流
特点
优点
单向数据流:通过单向数据流确保状态的一致性和可预测性,所有的状态变化都通过 Intent 触发,并由 Model 处理,最终反映在 View 上,这种方式使得状态变化更加清晰和易于追踪。
简化状态管理:UI 的所有变化都来自于状态,我们只需关注状态的变化即可实现 UI 更新,这种方式使得架构更加简单,易于调试和维护。
线程安全:State 实例是不可变的,这有助于确保线程安全。每次状态更新时都会创建新的 State 对象,避免了多线程环境下的数据竞争问题。
解耦和复用:通过将 UI 逻辑与业务逻辑分离,实现了较高的解耦度,这使得 UI 组件可以被轻松替换或复用,提高了代码的复用性和可维护性。
缺点
状态膨胀:当处理复杂页面时,状态可能会变得非常庞大和复杂,这会导致状态管理变得困难。
内存开销:由于每次状态更新都需要创建新的 State 对象,因此在高频率的状态更新场景下可能会带来一定的内存开销。
适用场景
MVI 特别适合于需要强大响应性和状态管理的应用,如实时聊天,表单验证和复杂交互的应用程序。由于 MVI 可能会引入更多的类和接口,导致代码结构相对复杂,所以在小型简单的页面中可能会显得有些繁琐。
基类搭建
先贴上需要用到的依赖:
implementation(libs.org.jetbrains.kotlinx.kotlinx.coroutines.android)
implementation(libs.androidx.activity.activity.ktx)
implementation (libs.androidx.fragment.ktx)
implementation(libs.androidx.lifecycle.viewmodel.ktx)
implementation(libs.squareup.okhttp)
implementation(libs.squareup.logging.interceptor)
implementation(libs.squareup.retrofit)
implementation(libs.squareup.converter.gson)
BaseActivity
abstract class BaseActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
initView()
initData()
}
abstract fun initView()
abstract fun initData()
}
BaseVBActivity
abstract class BaseVBActivity<VB : ViewBinding>(val block: (LayoutInflater) -> VB) :
BaseActivity() {
private var _binding: VB? = null
protected val binding: VB
get() = requireNotNull(_binding) { "The binding has been destroyed" }
override fun initView() {
_binding = block(layoutInflater)
setContentView(binding.root)
}
override fun onDestroy() {
super.onDestroy()
_binding = null
}
}
BaseFragment
abstract class BaseFragment : Fragment() {
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
initView()
initData()
}
abstract fun initView()
abstract fun initData()
}
BaseVBFragment
abstract class BaseVBFragment<VB : ViewBinding>(val block: (LayoutInflater) -> VB) :
BaseFragment() {
private var _binding: VB? = null
protected val binding: VB
get() = requireNotNull(_binding) { "The binding has been destroyed" }
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
_binding = block(layoutInflater)
return binding.root
}
override fun onDestroy() {
super.onDestroy()
_binding = null
}
}
定义用户意图和 UI 状态
interface IUIState
interface IUiIntent
BaseViewModel
abstract class BaseViewModel<UiState : IUIState, UiIntent : IUiIntent> : ViewModel() {
private val _uiStateFlow = MutableStateFlow(initUIState())
val uiStateFlow: StateFlow<UiState> = _uiStateFlow
private val intentChannel: Channel<UiIntent> = Channel()
protected abstract fun initUIState(): UiState
protected abstract fun handleIntent(intent: UiIntent)
init {
viewModelScope.launch {
intentChannel.consumeAsFlow().collect {
handleIntent(it)
}
}
}
fun sendUiIntent(uiIntent: UiIntent) {
viewModelScope.launch {
intentChannel.send(uiIntent)
}
}
protected fun sendUiState(copy: UiState.() -> UiState) {
_uiStateFlow.update { copy(_uiStateFlow.value) }
}
}
业务代码
这里举个简单的例子:网络请求数据,然后将这个请求结果显示在一个 TextView 上。
定义一个工具类,用于创建 Retrofit 。
class RetrofitUtil {
companion object {
private const val TIME_OUT = 20L
private fun createRetrofit(): Retrofit {
val interceptor = HttpLoggingInterceptor()
interceptor.level = HttpLoggingInterceptor.Level.BODY
val okHttpClient = OkHttpClient().newBuilder().apply {
addInterceptor(interceptor)
retryOnConnectionFailure(true)
connectTimeout(TIME_OUT, TimeUnit.SECONDS)
writeTimeout(TIME_OUT, TimeUnit.SECONDS)
readTimeout(TIME_OUT, TimeUnit.SECONDS)
}.build()
return Retrofit.Builder().apply {
addConverterFactory(GsonConverterFactory.create())
baseUrl(BASE_URL)
client(okHttpClient)
}.build()
}
fun <T> getAPI(clazz: Class<T>): T {
return createRetrofit().create(clazz)
}
}
}
定义一个网络请求的帮助类,用于存放和调用各种网络请求方法。
class RequestHelper private constructor() {
private val httpApi = RetrofitUtil.getAPI(HttpApi::class.java)
companion object {
val instance: RequestHelper by lazy(mode = LazyThreadSafetyMode.SYNCHRONIZED) {
RequestHelper()
}
}
suspend fun getListData(params: HashMap<String, String>) = httpApi.getHttpData(params)
}
这里就定义了一个意图,用来获取网络数据。
sealed class MainIntent : IUiIntent {
data class GetListData(var page: Int) : MainIntent()
}
定义 UI 状态
sealed class MainUiState : IUIState {
data object Init : MainUiState()
data class Success(val data: DataResponse?): MainUiState()
data class Fail(val msg: String?): MainUiState()
}
继承 BaseViewModel,实现我们具体的业务功能。
class MainViewModel : BaseViewModel<MainUiState, MainIntent>() {
override fun initUIState() = MainUiState.Init
override fun handleIntent(intent: MainIntent) {
when (intent) {
is MainIntent.GetListData -> {
getListData(intent.page)
}
}
}
private fun getListData(page: Int) = netRequest {
request {
val hashMap = hashMapOf<String, String>()
hashMap["token"] = TOKEN
hashMap["pageSize"] = PAGE_SIZE
hashMap["page"] = page.toString()
RequestHelper.instance.getListData(hashMap)
}
success {
sendUiState { MainUiState.Success(it) }
}
error {
sendUiState { MainUiState.Fail(it) }
}
}
}
至于这个 netRequest 网络请求的封装,可以看我的另一篇文章:如何让 Android 网络请求像诗一样优雅,这里不再赘述。
在 Fragment 中,发送意图并根据 UI 状态做相应的处理。
class MainFragment : BaseVBFragment<FragmentMainBinding>({
FragmentMainBinding.inflate(it)
}) {
private val mViewModel by viewModels<MainViewModel>()
override fun initView() {
binding.textView.text = "Initialization"
}
override fun initData() {
binding.textView.setOnClickListener {
mViewModel.sendUiIntent(MainIntent.GetListData(1))
}
lifecycleScope.launch {
mViewModel.uiStateFlow.collect {
when (it) {
is MainUiState.Success -> {
binding.textView.text = it.data?.data.toString()
}
is MainUiState.Fail -> {
binding.textView.text = it.msg
}
else -> {}
}
}
}
}
}