Flutter框架設計,我真的再也不用MVC、MVP了

MVC、MVP、MVVM架構設計的方式,在Android中廣泛被使用。從本質上我認爲,MVC和MVP其實將View層的代碼解耦到Controller/Presenter中。隨着業務的複雜,C/P中代碼積累的多了,然後又開始解耦一些Model或Interactor或其他。隨着業務再度複雜,每一個層的業務都很多代碼了, 然後各種分層設計就出來了等等…

那回歸到最簡單的MVC、MVP模式來,我們可以發現這2個設計模式都產生了一個問題。

Controller和Presenter都需要持有View。View被各種傳遞。

能不能有一種方式能夠同時解決解耦和值傳遞的問題?

由此我在實際項目中嘗試 一種新的架構方式如下:
在這裏插入圖片描述

Widget:顯示UI的頁面級Widget,StatelessWidget或StatefulWidget。

ExtensionWidgetUI:Widget的擴展。這種專門存放了各種返回Widget的函數。

ExtensionWidgetController:業務的Controller,它也是一份Widget的擴展。但可以理解爲處理業務的Controller。

ViewModel:這裏我結合了Provider來使用。專門配合Controller使用,提供UI數據的支持。每一個ViewModel都mixin了一個LoadData。

LoadData:大部分情況下,頁面都需要加載中、加載完成、加載失敗等狀態。所以這裏維持了一份頁面數據的加載狀態,以提供給Controller、Widget訪問。

如文件相關頁面的代碼:
Widget:

在這裏插入圖片描述

ExtensionWidgetUI:
在這裏插入圖片描述

這裏相當於Android的XML了,專門提供UI組件。因爲採用的是extension,所以完全不需要傳遞key、context等參數進去。它可以把自己當成Widget來生成各個UI部件。

ExtensionWidgetController:
在這裏插入圖片描述

Controller中使用獲取頁面數據,然後使用ViewModel更新UI完事,沒什麼多說的。…

ViewModel是在Widget中創建了,所以這裏輕輕鬆鬆不用傳值就可以拿到了。

但需要注意的是,請不要在以上2個extension中創建任何新的事物,如變量等等。

因爲從使用extension的就代表了,它職位Widget而生,不能“做自己”。如果硬要創建,那IDE會報錯如下.

在這裏插入圖片描述

ViewModel:就是你所理解的那種ViewModel,不講了。

LoadData:只有這些,用來描述頁面的狀態,如果有人喜歡和ViewModel放在一起抽取出一個BaseViewModel出來也可以。

在這裏插入圖片描述

總結

由此,在我個人看來,不僅解決了MVC、MVP中Controller、Presenter 創建時需要傳遞一系列的參數進去的問題。而且實現了頁面級的模塊化,讓不同職責的代碼從一個StatefulWidget或StatelessWidget頁面中解耦出來。同時,還不影響結合Provider等狀態管理的框架的搭配使用。親測目前暫無發現一些問題,如果發現什麼致命問題還請留言指出問題,感謝。在Android開發中用了幾年的MVC、MVP,不如來試試新的玩法?

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章