RxSwift+MVVM项目实战-MVVM架构介绍以及实战初体验

简介: RxSwift+MVVM项目实战-MVVM架构介绍以及实战初体验

1. MVVM架构简介

对于MVVM架构,大家一定都已不再陌生,网上的资料随意一搜遍地都是,这里就不再过多的赘述,简单说一下MVVM架构结合RxSwift的使用,以及各自的分工,请看下面这张图:

注意:MVVM架构并不是一定得结合函数响应式编程RxSwift或者RAC等,只是他们的结合会使得代码更加的简洁,消息的传递更加简单化。


Model

提供数据支持,在里面定义需要的属性等;


ViewModel

主要职责就是对数据进行转换处理,ViewModel中设计Input结构体Output结构体的作用主要是使得事件的流向更加的清晰;Input所扮演的角色,主要是接收View所传递过来的事件(点击、输入、滚动等),ViewModel内部通过transform函数转换,返回OutPutOutput的作用主要是保存处理后的结果,用于将来绑定到UI,从而实现了ViewViewModel层完全的解耦;


View

主要作用就是视图的布局、动画、跳转等,将来会把所需的事件传递给ViewModelInput中,通过ViewModel的数据转换,把ViewModel中的Output绑定到对应的UI控件上;在MVVMController也会归属到View中,职责类似;


2. 关注功能实战

需求:页面内有一按钮,有“关注”和“取消关注”两种状态,进入页面通过网络请求获取初始状态,然后通过点击,发起请求,切换不同的状态,具体实现如下:


Model层

声明按钮的初始状态属性,isAttention用于存储是否关注的状态;




class AttentionModel {
    var isAttention = false
}


View层

主要是创建控件、以及ViewModel实例,并把按钮的点击事件传递到ViewModelInput中,ViewModel内部通过transform函数,对input中的事件进行处理,再把ViewModel中的Output和按钮的状态attentionButton.rx.isSelected绑定在一起;

private func bindToViewModel() {
    let output = viewModel.transform(input: AttentionViewModel.Input(attention: attentionButton.rx.tap))
    output.attentionStatus.bind(to: attentionButton.rx.isSelected).disposed(by: disposeBag)
}


ViewModel层

Input:保存传递过来的按钮点击事件;

Output:绑定按钮状态数据到View层;

transformViewModelattention作用主要是用于存储当前的按钮状态;transform函数内部initAction 主要是用于请求更新按钮初始时的状态,attentionAction主要是当按钮点击的时候发起请求,待收到响应后,更新响应结果,通过merge两者的状态,利用OutputattentionStatus回调给外界进行绑定;


struct AttentionViewModel {
    //false代表未关注 true已关注
    private var attention = BehaviorRelay<Bool>(value: false)
    struct Input {
        let attention: ControlEvent<Void>
    }
    struct Output {
        let attentionStatus: Observable<Bool>
    }
    func transform(input: Input) -> Output {
        let initAction = requestInit()//请求初始数据
        let attentionAction = input.attention.flatMap({ request(!attention.value)} ).observe(on: MainScheduler.instance).share(replay: 1) //关注、取消关注点击
        //合并结果-把按钮点击或者请求初始数据的时候都去更新关注按钮状态
        let attentionStatus = Observable.of(attentionAction, initAction).merge()
        return Output(attentionStatus: attentionStatus)
    }
    private func request(_ isAttention: Bool) -> Observable<Bool> {
        return Observable<Bool>.create { (observer) -> Disposable in
            Logger("发起更新状态请求\nLoading...")
            DispatchQueue.global().asyncAfter(deadline: .now() + 2, execute: {
                Logger("响应更新状态结果...isAttention = \(isAttention)")
                observer.onNext(isAttention)//是否关注
                self.attention.accept(isAttention)// 关注或取消关注成功、存储状态
            })
            return Disposables.create()
        }.subscribe(on: ConcurrentDispatchQueueScheduler(qos: .userInteractive))
    }
    private func requestInit() -> Observable<Bool> {
        return Observable<Bool>.create { (observer) -> Disposable in
            Logger("正在请求初始状态\nLoading...")
            DispatchQueue.global().asyncAfter(deadline: .now() + 1, execute: {
                let model = AttentionModel()//模拟将请求结果转换为Model...
                model.isAttention = true //假设默认状态为已关注
                Logger("初始状态响应结果...isAttention = \(model.isAttention) \n")
                //Event处理...
                observer.onNext(model.isAttention)//用于通知View去更新关注状态
                attention.accept(model.isAttention)//存储关注的状态
            })
            return Disposables.create()
        }.subscribe(on: ConcurrentDispatchQueueScheduler(qos: .userInteractive))
    }
}

运行结果:

Log - 正在请求初始状态
Loading...
Log - 初始状态响应结果...isAttention = true 
Log - 发起更新状态请求
Loading...
Log - 响应更新状态结果...isAttention = false

划线


相关文章
|
2月前
|
前端开发 测试技术 数据处理
Kotlin教程笔记 - MVP与MVVM架构设计的对比
Kotlin教程笔记 - MVP与MVVM架构设计的对比
67 4
|
2月前
|
存储 前端开发 Java
Kotlin教程笔记 - MVVM架构怎样避免内存泄漏
Kotlin教程笔记 - MVVM架构怎样避免内存泄漏
33 2
|
13天前
|
存储 JavaScript 开发工具
基于HarmonyOS 5.0(NEXT)与SpringCloud架构的跨平台应用开发与服务集成研究【实战】
本次的.HarmonyOS Next ,ArkTS语言,HarmonyOS的元服务和DevEco Studio 开发工具,为开发者提供了构建现代化、轻量化、高性能应用的便捷方式。这些技术和工具将帮助开发者更好地适应未来的智能设备和服务提供方式。
37 8
基于HarmonyOS 5.0(NEXT)与SpringCloud架构的跨平台应用开发与服务集成研究【实战】
|
23天前
|
弹性计算 Java 数据库
Web应用上云经典架构实战
本课程详细介绍了Web应用上云的经典架构实战,涵盖前期准备、配置ALB、创建服务器组和监听、验证ECS公网能力、环境配置(JDK、Maven、Node、Git)、下载并运行若依框架、操作第二台ECS以及验证高可用性。通过具体步骤和命令,帮助学员快速掌握云上部署的全流程。
|
2月前
|
消息中间件 Java Kafka
实时数仓Kappa架构:从入门到实战
【11月更文挑战第24天】随着大数据技术的不断发展,企业对实时数据处理和分析的需求日益增长。实时数仓(Real-Time Data Warehouse, RTDW)应运而生,其中Kappa架构作为一种简化的数据处理架构,通过统一的流处理框架,解决了传统Lambda架构中批处理和实时处理的复杂性。本文将深入探讨Kappa架构的历史背景、业务场景、功能点、优缺点、解决的问题以及底层原理,并详细介绍如何使用Java语言快速搭建一套实时数仓。
241 4
|
2月前
|
XML 前端开发 Android开发
Kotlin教程笔记(80) - MVVM架构设计
Kotlin教程笔记(80) - MVVM架构设计
|
2月前
|
前端开发 JavaScript 测试技术
android做中大型项目完美的架构模式是什么?是MVVM吗?如果不是,是什么?
在 Android 开发中,选择合适的架构模式对于构建中大型项目至关重要。常见的架构模式有 MVVM、MVP、MVI、Clean Architecture 和 Flux/Redux。每种模式都有其优缺点和适用场景,例如 MVVM 适用于复杂 UI 状态和频繁更新,而 Clean Architecture 适合大型项目和多平台开发。选择合适的架构应考虑项目需求、团队熟悉度和可维护性。
66 6
|
2月前
|
运维 NoSQL Java
后端架构演进:微服务架构的优缺点与实战案例分析
【10月更文挑战第28天】本文探讨了微服务架构与单体架构的优缺点,并通过实战案例分析了微服务架构在实际应用中的表现。微服务架构具有高内聚、低耦合、独立部署等优势,但也面临分布式系统的复杂性和较高的运维成本。通过某电商平台的实际案例,展示了微服务架构在提升系统性能和团队协作效率方面的显著效果,同时也指出了其带来的挑战。
99 4
|
2月前
|
XML 前端开发 Android开发
Kotlin教程笔记(80) - MVVM架构设计
Kotlin教程笔记(80) - MVVM架构设计
|
2月前
|
前端开发 Java 测试技术
android MVP契约类架构模式与MVVM架构模式,哪种架构模式更好?
android MVP契约类架构模式与MVVM架构模式,哪种架构模式更好?
89 0