Mvi架构模式开发

Mvi架构模式开发

前言:随着谷歌推广各种设计模式,慢慢地我们好像将其当成了一种新技术来使用,觉得在新的项目必须要用上新的设计模式,就能使应用变得更加流畅和稳定。设计模式只是一种手段,不管是Mvi模式还是Mvc模式,都是来规矩我们的运行逻辑。
没有最好的设计模式,只有更适合项目业务逻辑的设计思维。

本demo的github地址为:https://github.com/CaesarShao/CaesarMvi.git

不过新推出的我们肯定要去试试了解。

mvi图片.png

Mvi模式采用单向流动的设计思路,用户意图Intent通过View层传输到Model,数据处理完毕之后,再返回状态State到View层显示,由此一个循环结束.一个界面的所有东西,都是不断循环在一个闭环内,所以数据的流向都能方便地监测到,哪一环出现问题就能快速地定位到问题所在.

接下来我们来看一下实际应用

举例有一个简单的新闻界面,用户去看新闻,这个界面用户能看到的,是不是就是新闻的内容,还有加载弹窗的显示与消失,我们定义一个NewState,里面定义几个接口,开始网络请求,网络请求结束,数据返回,失败信息返回.

sealed class NewState {
    object loadingNews : NewState()
    object loadingFinish : NewState()
    data class successReturn(val str: String) : NewState()
    data class failReturn(val str: String) : NewState()
}

然后我们再写一个用户的意图,也就是用户用手实际点击触摸的意图NewIntent,看新闻那就是触摸刷新.

sealed class NewIntent {
    object touchLoad: NewIntent()
}

我们再新建一个viewModel类:

class NewViewModel() : ViewModel() {
    val userIntent = Channel<NewIntent>()
    val state = MutableStateFlow<NewState>(NewState.loadingFinish)
    init {
        viewModelScope.launch {
            userIntent.consumeAsFlow().collect {
                when (it) {
                    is NewIntent.touchLoad -> {
                        loadNet()
                    }
                }
            }
        }
    }
    private fun loadNet() {//模拟网络请求
        state.value = NewState.loadingNews
        viewModelScope.launch(Dispatchers.IO) {
            delay(3000)
            val data = Random.nextInt(4)
            state.value = if (data == 0) {
                NewState.failReturn("网络请求失败,错误数据显示:"+data)
            } else {
                NewState.successReturn("网络请求成功,数据返回:"+data)
            }
            delay(100)//这边因为MutableStateFlow的特性加个延迟
            state.value = NewState.loadingFinish
        }
    }
}

其中Channel和MutableStateFlow,这两个对象可以用liveDate代替,只是一种传输工具。在viewmodel中,我们监听了用户的意图userIntent,当收到touch事件时,就去请求网络,然后将结果通过state返回给界面显示。最后,我们看一下首页的核心代码。

srlShow?.setOnRefreshListener {
            touchLoad()
        }
        viewModel?.viewModelScope?.launch {
            viewModel?.state?.collect {
                when (it) {
                    is NewState.loadingNews -> {
                        srlShow?.isRefreshing = true
                        tvShow?.text = "网络请求中.."
                    }
                    is NewState.loadingFinish -> {
                        srlShow?.isRefreshing = false
                    }
                    is NewState.successReturn -> {
                        tvShow?.text = it.str
                    }
                    is NewState.failReturn -> {
                        tvShow?.text = it.str
                    }
                    else -> {

                    }
                }
            }
        }
    }
    
    private fun touchLoad() {
        viewModel?.viewModelScope?.launch {
            viewModel?.userIntent?.send(NewIntent.touchLoad)
        }
    }

获取viewmodel中的userIntent意图,监听state状态返回,根据不同的结果,显示不同的UI,因为所有的意图都会转换成state从一处返回,我们就可以统一管理,出现异常的话,也容易追踪排查。这样一个简单地闭环系统就完成了。

当然,实际应用不会像demo那样简单,我们经常要监听整个app的消息,获取其他地方的消息,一个界面中,可能要监听多个state,意味着有多个闭环存在,这种情况应该怎么处理,这边给出一个简单的解决方案.

sealed class GlobalIntent {
    object touchLoad: GlobalIntent()
}
sealed class GlobalState {
    object loadingNews : GlobalState()
    object loadingFinish : GlobalState()
    data class successReturn(val str: String) : GlobalState()
    data class failReturn(val str: String) : GlobalState()
}
object GlobalReg {
    val userIntent = Channel<GlobalIntent>()
    val state = MutableStateFlow<GlobalState>(GlobalState.loadingFinish)
}
class MyApp:Application() {
    override fun onCreate() {
        super.onCreate()
        GlobalScope.launch(Dispatchers.IO) {
            GlobalReg.userIntent.consumeAsFlow().collect {
                when (it) {
                    is GlobalIntent.touchLoad -> {
                        GlobalReg.state.value = GlobalState.loadingNews
                        delay(4000)
                        GlobalReg.state.value = GlobalState.successReturn("应用项目中返回的数据")
                        delay(100)
                        GlobalReg.state.value = GlobalState.loadingFinish
                    }
                }
            }
        }
    }
}

创建2个简单地全局意图和状态,然后我们有2个界面,都订阅了全局的state。

class MainActivity : AppCompatActivity() {
GlobalScope.launch {
            GlobalReg.state.collect {
                when (it) {
                    is GlobalState.loadingNews -> {
                        Log.i("caesar","MainActivity中接收到了loadingNews")
                    }
                    is GlobalState.loadingFinish -> {
                        Log.i("caesar","MainActivity中接收到了loadingFinish")
                    }
                    is GlobalState.successReturn -> {
                        Log.i("caesar","MainActivity中接收到了successReturn:"+it.str)
                    }
                    is GlobalState.failReturn -> {
                        Log.i("caesar","MainActivity中接收到了failReturn")
                    }
                    else -> {

                    }
                }
            }
        }
}
class GlobalActivity : AppCompatActivity() {
    var viewModel: GlobalViewModel? = null
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_global)
        viewModel = ViewModelProvider(this).get(GlobalViewModel::class.java)
        findViewById<Button>(R.id.btn_show).setOnClickListener {
            touchLoad()
        }
        viewModel?.viewModelScope?.launch {
            GlobalReg.state.collect {
                when (it) {
                    is GlobalState.loadingNews -> {
                        Log.i("caesar","GlobalActivity中接收到了loadingNews")
                    }
                    is GlobalState.loadingFinish -> {
                        Log.i("caesar","GlobalActivity中接收到了loadingFinish")
                    }
                    is GlobalState.successReturn -> {
                        Log.i("caesar","GlobalActivity中接收到了successReturn:"+it.str)
                    }
                    is GlobalState.failReturn -> {
                        Log.i("caesar","GlobalActivity中接收到了failReturn")
                    }
                    else -> {

                    }
                }
            }
        }
    }

    private fun touchLoad() {
        viewModel?.viewModelScope?.launch {
            GlobalReg.userIntent.send(GlobalIntent.touchLoad)
        }
    }
}
I/caesar: MainActivity中接收到了loadingNews
I/caesar: GlobalActivity中接收到了loadingNews
I/caesar: MainActivity中接收到了successReturn:应用项目中返回的数据
I/caesar: GlobalActivity中接收到了successReturn:应用项目中返回的数据
I/caesar: MainActivity中接收到了loadingFinish
I/caesar: GlobalActivity中接收到了loadingFinish

在GlobalActivity中,我们发送一个全局的意图,数据经过全局的闭环之后,再返回到了我们订阅于全局state的2个Activity中,就可以获取到全局的数据了。

本demo中的例子比较的简单,主要是讲一个闭环的思路模式,其中的Channel和MutableStateFlow只不过是官方给我们提供的通道工具,我们可以按照项目的需求自己替换,甚至用eventBus也可以代替,核心就是将我们的UI和数据处理处于一个闭环的通道,使得项目按照既定的模式运行。

转载请标明出处。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,937评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,503评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,712评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,668评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,677评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,601评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,975评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,637评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,881评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,387评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,971评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2 342

推荐阅读更多精彩内容