使用共享 MVI 架构实现高效的 Kotlin Multiplatform Mobile (KMM) 开发

使用共享 MVI 架构实现高效的 Kotlin Multiplatform Mobile (KMM) 开发

文章中探讨了 Google 提供的应用架构指南在多平台上的实现。通过共享视图模型（View Models）和共享 UI 状态（UI States），我们可以专注于在原生端实现 UI 部分。
使用了简单的自定义抽象层，包括 KmmViewModel 和 KmmStateFlow，使得我们可以将共享的业务逻辑连接到原生 UI，而无需依赖于复杂的第三方库。这种方法有助于简化 KMM 开发，提高开发效率。
Google官方应用架构指南

https://developer.android.com/topic/architecture?hl=zh-cn

架构指南概览

  • androidApp（本地应用）
    • 视图可以使用 XML 或 Jetpack Compose 实现。
  • iosApp（本地应用）
    • 视图可以使用 UIKit 或 SwiftUI 实现。
  • shared（KMM 共享层）
    • View Models 处理呈现逻辑并向本地 UI 发送 UI State。
    • View Models 使用 Repositories 和 Use Cases 获取数据并执行业务逻辑。
    • Use Cases 处理一些可重用的业务逻辑，可以应用于不同的 View Models。
    • Repositories 处理数据逻辑。它们公开了用于返回或更新数据的 CRUD 操作。
    • Repositories 访问不同的数据源，以在本地或远程获取或存储数据。

实现案例

https://github.com/Maruchin1/kmm-shared-mvi
https://github.com/touchlab/KaMPKit

KMM 抽象

为了实现这一架构，我们需要引入两个简单的 KMM 抽象。一个用于 ViewModel，另一个用于 StateFlow。

KmmViewModel

// commonMain
expect abstract class KmmViewModel constructor() {protected val scope: CoroutineScope
}// androidMain
actual abstract class KmmViewModel : ViewModel() {protected actual val scope: CoroutineScopeget() = viewModelScope
}// iosMain
actual abstract class KmmViewModel {protected actual val scope = CoroutineScope(SupervisorJob() + Dispatchers.Main)fun onCleared() {scope.cancel()}
}

在 Android 端，我们只需使用 androidx.lifecycle.ViewModel，使其像本地 ViewModel 一样运行。我们还将 viewModelScope 关联起来，以便在 KmmViewModel 中启动异步操作。

在 iOS 端，我们有一个自定义实现，它使用 MainDispatcher 实例化 CoroutineScope。它还公开了一个额外的 onCleared 方法，可以在本地端用于取消正在进行的异步操作。

KmmStateFlow

// commonMain
expect class KmmStateFlow<T>(source: StateFlow<T>) : StateFlow<T>// androidMain
actual class KmmStateFlow<T> actual constructor(source: StateFlow<T>
) : StateFlow<T> by source// iosMain
fun interface KmmSubscription {fun unsubscribe()
}actual class KmmStateFlow<T> actual constructor(private val source: StateFlow<T>
) : StateFlow<T> by source {fun subscribe(onEach: (T) -> Unit, onCompletion: (Throwable?) -> Unit): KmmSubscription {val scope = CoroutineScope(Job() + Dispatchers.Main)source.onEach { onEach(it) }.catch { onCompletion(it) }.onCompletion { onCompletion(null) }.launchIn(scope)return KmmSubscription { scope.cancel() }}
}

在 Android 端，我们只需将实现委托给标准的 StateFlow，因此它的工作方式完全相同。在 iOS 端，由于无法访问 CoroutineScope，我们无法像标准方式一样收集 StateFlow。解决这个问题的方法是采用基于订阅的方式，这在 RxJava 和其他 Rx* 库中很常见。我们添加了一个带有两个回调的 subscribe 方法，它返回一个 KmmSubscription 实例。iOS 应用程序可以取消订阅，从而取消 CoroutineScope。

IOS端实现

要在 iOS 应用程序中正确集成 KmmViewModel，最简单且最灵活的方法是依赖委托模式。首先，可以使用 ObjCName 注解，专门为 iOS 应用程序更改共享的 View Model 名称。

@ObjCName("LoginViewModelDelegate")
class LoginViewModel : KmmViewModel() {val uiState: KmmStateFlow<LoginUiState> = ...fun login() {...}
}

然后，在本机 iOS 应用中，我们创建一个视图模型包装器，它在底层使用共享委托。

最重要的部分是 deinit 块。它通知视图模型委托应取消所有异步工作，并关闭 UI State 订阅。这样，当屏幕从导航堆栈中移除时，就不会发生内存泄漏。

class LoginViewModel: ObservableObject {@Published var state: LoginUiState = LoginUiState.companion.default()private let viewModelDelegate: LoginViewModelDelegateprivate var stateSubscription: KmmSubscription!init(viewModelDelegate: LoginViewModelDelegate) {self.viewModelDelegate = viewModelDelegatesubscribeState()}// Remember to clear and unscubscribe when no more neededdeinit {viewModelDelegate.onCleared()stateSubscription.unsubscribe()}func login() {viewModelDelegate.login()}private func subscribeState() {stateSubscription = viewModelDelegate.uiState.subscribe(onEach: { state inself.state = state!},onCompletion: { error inif let error = error {print(error)}})} 
}

关键规则

1. 视图模型与屏幕一一对应
视图模型是屏幕级别的状态持有者。本地屏幕和共享视图模型之间存在一对一的关系。当我们在共享部分拥有 HomeViewModel 时，我们应该在 Android 中拥有 HomeScreen / HomeFragment，而在 iOS 中拥有 HomeView / HomeController。

2. 视图模型发出单一数据流
MVVM 和 MVI 之间的主要区别在于，在 MVI 中，对于每个屏幕，我们有一个单一的不可变状态。当视图模型需要向本地 UI 发出一些数据时，它应该定义一个不可变的*UiState数据类，并使用 KmmStateFlow 发出它。

https://developer.android.com/topic/architecture/ui-layer
https://developer.android.com/topic/architecture/ui-layer/stateholders

不推荐的MVI View Model

class HomeViewModel : KmmViewModel() {val userName: KmmStateFlow<String> ...val articles: KmmStateFlow<List<Article>> ...val isLoading: KmmStateFlow<Boolean> ...
}

推荐的MVI View Model

data class HomeUiState(val userName: String,val articles: List<ArticleUiState>,val isLoading: Boolean,
)class HomeViewModel : KmmViewModel() {val uiState: KmmStateFlow<HomeUiState> ...
}

3. UI事件可触发UI状态更新
View Models使用命名方法（例如fun login()）处理UI事件（如OnClick）。方法执行业务逻辑后，不返回值或触发事件，而是更新UI状态以传递相关数据。

https://developer.android.com/topic/architecture/ui-layer/events

data class LoginUiState(val isLoggedIn: Boolean,val errorMessage: String?)class LoginViewModel : KmmViewModel() {private val _uiState = MutableStateFlow(LoginUiState.default())val uiState: KmmStateFlow<LoginUiState> = _uiState.asKmmStateFlow()fun login() = viewModelScope.launch {runCatching {loginUserUseCase()}.onSuccess {_uiState.update { // It can be consumed by the UI to navigate to HomeScreenit.copy(isLoggedIn = true)}}.onFailure {_uiState.update { error ->// It can be consumed by the UI to display a Toastit.copy(errorMessage = getErrorMessage(error))}}}}

4. 使用案例是可选的
并非每个应用都需要使用案例。当应用简单时，直接在视图模型中访问存储库是可以的。但当应用引入更多逻辑，需要转换、分组或执行复杂操作时，应该考虑使用案例来封装这些逻辑，以便在不同的视图模型中重用。

https://developer.android.com/topic/architecture/domain-layer
https://medium.com/androiddevelopers/adding-a-domain-layer-bc5a708a96da

5. 使用案例是无状态的
使用案例负责执行一些逻辑操作，可能涉及不同的存储库和不同类型的数据。然而，使用案例本身不应保留任何内部状态。如果需要持久化或临时存储某些数据，应该委托给存储库。

6. 一个数据类型对应一个存储库
每个存储库都代表一个数据类型的集合。如果我们有用户实体，我们创建 UsersRepository。而对于文章，我们创建 ArticlesRepository。存储库不应依赖于其他存储库。

在Android文档中，我们可以找到关于构建多层存储库的信息。请记住，这个更高级别的存储库有不同的目的。它不是使用不同的数据源来管理单一类型的数据，而是使用其他存储库来管理某种聚合类型的数据。这就是它们有时被称为管理器的原因。

在MVI架构中，我们首先应该使用使用案例来从不同的存储库中聚合数据。只有在我们的需求非常复杂，使用使用案例不足以满足时，我们才可以考虑引入多层存储库。

7. 存储库隐藏数据持久化细节
每个存储库都充当一个外观，隐藏了数据持久化的详细信息。存储库的所有公共方法都应该接受并返回领域模型。在内部，它们将领域模型映射到相应的远程API或本地数据库模型。

https://developer.android.com/topic/architecture/data-layer

结论

该架构适用于Android和iOS平台具有相同的演示逻辑的情况。它遵循Google的应用程序架构指南，无需使用重型第三方库，支持不可变UI状态和单向数据流，代码共享比例高，但需要注意iOS端的额外代码以避免内存泄漏。

参考

google应用架构指南
https://developer.android.com/topic/architecture/intro
mvi框架
https://github.com/icerockdev/moko-mvvm
https://arkivanov.github.io/Decompose/

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/78284.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

leetcode 2. 两数相加

leetcode 2. 两数相加

2023.9.14 这道题还是有点难度&#xff0c; 需要维护一个进位值&#xff0c;构造一个虚拟头节点dummy&#xff0c;用于结果的返回&#xff0c;还要构造一个当前节点cur&#xff0c;用于遍历修改新链表。 整体思路就是长度短的链表需要补0&#xff0c;然后两链表从头开始遍历相加…
阅读更多...
GaussDB技术解读系列：运维自动驾驶探索

GaussDB技术解读系列：运维自动驾驶探索

近日&#xff0c;在第14届中国数据库技术大会&#xff08;DTCC2023&#xff09;的GaussDB“五高两易”核心技术&#xff0c;给世界一个更优选择专场&#xff0c;华为云数据库运维研发总监李东详细解读了GaussDB运维系统自动驾驶探索和实践。 随着企业数字化转型进入深水区&…
阅读更多...
string

string

目录 六、STL简介 (一)什么是STL (二)STL的版本 (三)STL六大组件 七、string (一)标准库中的string 1、string类 2、string常用的接口 1)string类对象的常见构造 2)string类对象的容量操作 3)string类对象的访问及遍历操作 4)string类对象的修改操作 5)string类非成…
阅读更多...
帧结构的串行数据接收器——Verilog实现

帧结构的串行数据接收器——Verilog实现

用Verilog 实现一个帧结构的串行数据接收器&#xff1b; 串行数据输入为&#xff1a;NRZ数据加位时钟&#xff08;BCL&#xff09;格式&#xff0c;高位在前 帧结构为&#xff1a;8位构成一个字&#xff0c;64字构成一个帧。每帧的第一个字为同步字。同步字图案存储在可由CPU读…
阅读更多...
9. xaml ComboBox控件

9. xaml ComboBox控件

1.运行图像 2.运行源码 a.Xaml源码 <Grid Name="Grid1"><!--IsDropDownOpen="True" 默认就是打开的--><ComboBox x:Name="co
阅读更多...
Spark集成hudi创建表报错

Spark集成hudi创建表报错

环境描述： hudi版本：0.13.1 spark版本：3.3.2 Hive版本：3.1.3 Hadoop版本：3.3.4 问题1： 描述：按照官方文档运行spark-sql创建spark的hudi表报错 建表语句： CREATE TABLE stg.spark_mor_test_01 (uuid string,name string,age int,ts …
阅读更多...
useGetState自定义hooks解决useState 异步回调获取不到最新值

useGetState自定义hooks解决useState 异步回调获取不到最新值

setState 的两种传参方式 1、直接传入新值 setState(options); const [state, setState] useState(0); setState(state 1); 2、传入回调函数 setState(callBack); const [state, setState] useState(0); setState((prevState) > prevState 1); // prevState 是改变之…
阅读更多...
【网络教程】超越平凡：一文揭示SSH-keygen的神秘世界

【网络教程】超越平凡：一文揭示SSH-keygen的神秘世界

SSH（Secure Shell）是一种网络协议，用于安全地连接到远程计算机。SSH-keygen 是 SSH 协议的一部分，用于生成、管理和转换身份验证密钥对。 SSH-keygen 命令的基本语法如下： ssh-keygen [选项]以下是 ssh-keygen 命令的一些常用选项和参数： -t：指定要生成的密钥类型。例如…
阅读更多...
Python实现猎人猎物优化算法(HPO)优化Catboost分类模型(CatBoostClassifier算法)项目实战

Python实现猎人猎物优化算法(HPO)优化Catboost分类模型(CatBoostClassifier算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 猎人猎物优化搜索算法(Hunter–prey optimizer, HPO)是由Naruei& Keynia于2022年提出的一种最新的…
阅读更多...
基于BLIP-2的看图问答原理及实现

基于BLIP-2的看图问答原理及实现

大型语言模型 (LLM) 最近获得了很大的关注&#xff0c;出现了许多流行的模型&#xff0c;如 GPT、OPT、BLOOM 等。 这些模型擅长学习自然语言&#xff0c;非常适合构建聊天机器人、编码助手、决策助手或翻译系统。 然而&#xff0c;他们缺乏其他模式的知识—例如&#xff0c;他…
阅读更多...
GIS地图服务数据可视化

GIS地图服务数据可视化

GIS地图服务数据可视化 OSM&#xff08;Open Street Map&#xff0c;开放街道地图&#xff09;Bing地图&#xff08;必应地图&#xff09;Google地图&#xff08;谷歌地图&#xff09; 地图服务数据可视化是根据调用的地图服务请求Web服务器端的地图数据&#xff0c;实现地图数…
阅读更多...
python自学

python自学

自学第一步 第一个简单的基础&#xff0c;向世界说你好 启动python 开始 print是打印输出的意思&#xff0c;就是输出引号内的内容。 标点符号必须要是英文的&#xff0c;因为他只认识英文的标点符号。 exit&#xff08;&#xff09;推出python。 我们创建一个文本文档&…
阅读更多...
Nginx参数配置详细说明【全局、http块、server块、events块】【已亲测】

Nginx参数配置详细说明【全局、http块、server块、events块】【已亲测】

Nginx重点参数配置说明 本文包含Nginx参数配置说明全局块、http块、server块、events块共计30多个参数配置与解释&#xff0c;其中常见参数包含配置错误出现的错误日志&#xff0c;能让你更快的解决问题。 该文的所有参数大部分经过单独测试&#xff0c;错误都是自己收集出来的…
阅读更多...
如何将安防视频监控系统/视频云存储EasyCVR平台推流到公网直播间？

如何将安防视频监控系统/视频云存储EasyCVR平台推流到公网直播间？

视频云存储/安防监控EasyCVR视频汇聚平台基于云边端智能协同&#xff0c;支持海量视频的轻量化接入与汇聚、转码与处理、全网智能分发、视频集中存储等。音视频流媒体视频平台EasyCVR拓展性强&#xff0c;视频能力丰富&#xff0c;具体可实现视频监控直播、视频轮播、视频录像、…
阅读更多...
基于PyTorch使用LSTM实现新闻文本分类任务

基于PyTorch使用LSTM实现新闻文本分类任务

本文参考 PyTorch深度学习项目实战100例 https://weibaohang.blog.csdn.net/article/details/127154284?spm1001.2014.3001.5501 文章目录 本文参考任务介绍做数据的导入 环境介绍导入必要的包介绍torchnet和keras做数据的导入给必要的参数命名加载文本数据数据前处理模型训…
阅读更多...
防火墙概述及实战

防火墙概述及实战

目录 前言 一、概述 &#xff08;一&#xff09;、防火墙分类 &#xff08;二&#xff09;、防火墙性能 &#xff08;三&#xff09;、iptables &#xff08;四&#xff09;、iptables中表的概念 二、iptables规则匹配条件分类 &#xff08;一&#xff09;、基本匹配条…
阅读更多...
sklearn中的数据集使用

sklearn中的数据集使用

导库 from sklearn.datasets import load_iris 实现 # 加载数据集 iris load_iris() print(f查看数据集&#xff1a;{iris}) print(f查看数据集的特征&#xff1a;{iris.feature_names}) print(f查看数据集的标签&#xff1a;{iris.target_names}) print(f查看数据集的描述…
阅读更多...
看板管理：以可视化方式确定任务优先级

看板管理：以可视化方式确定任务优先级

确定工作的优先级是我们今天都要面对的挑战。若处理不当&#xff0c;我们就可能试图一心多用&#xff0c;从而严重损害工作效率。 使用看板方法来设定工作优先级是一种非常直观、快速的方法。 确定工作优先级的看板方法 看板工作流程管理方法的核心在于工作可视化。工作被划…
阅读更多...
Elasticsearch：什么是生成式人工智能？

Elasticsearch：什么是生成式人工智能？

生成式人工智能定义 给学生的解释&#xff08;基本&#xff09;&#xff1a; 生成式人工智能是一种可以创造新的原创内容的技术&#xff0c;例如艺术、音乐、软件代码和写作。 当用户输入提示时&#xff0c;人工智能会根据从互联网上现有示例中学到的知识生成响应&#xff0c;…
阅读更多...
记录vite下使用require报错和解决办法

记录vite下使用require报错和解决办法

前情提要 我们现在项目用的是vite4react18开发的项目、但是最近公司有个睿智的人让我把webpack中的bpmn组件迁移过来、结果就出现问题啦&#xff1a;因为webpack是commonjs规范、但是vite不是、好像是es吧、可想而知各种报错 废话不多说啦 直接上代码&#xff1a; 注释是之前c…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023