Bedrock——基於MVVM+Provider的Flutter快速開發框架

吉哈達發表於2020-06-17

Bedrock——基於MVVM+Provider的Flutter快速開發框架

Bedrock——基於MVVM+Provider的Flutter快速開發框架

簡介

憑著一些開發經驗(其實就是從各原生/Flutter大佬na借鑑),整理出這款MVVM+Provider快速開發框架,同時在Pub裡面收藏了常用且效果不錯的外掛,完全可以滿足日常開發(非基礎性的臨時註釋掉了),我在pub和demo裡儘可能加了詳盡的註釋以及根據自己的開發經驗所新增的一些想法,方便大家快速接入並使用。
複製程式碼

主要特性

1、MVVM+Provider,低耦合、邏輯分明、頁面程式碼清晰。Provider提供的狀態管理使頁面控制和展現更為靈活方便

2、全域性異常捕捉:介面業務型和語法型,業務型可根據需要進行處理(如未登入、未授權、超時、無網等等)並實現頁面自動切換,語法型可以跳轉到指定頁面避免紅屏(還可在此頁面做日誌上傳)。

3、基礎類Basestate-State、BaseStatelessWidget-StatelessWidget和BaseSkeletonWidget,對常用功能函式進行了封裝,輕鬆配 置骨架屏、螢幕適配、異形屏適配等

4、基類ProviderWidget-Provider和ViewstateModel-ChangeNotifier對 provider等的封裝、底層封裝了一些常用狀態和異常處理功能

5、全域性cookie預設SharedPreferences,基礎攔截器自動上傳app版本等(可以根據需求自定)

6、頁面側滑退出,路由管理模組,常用頁面跳轉動畫的封裝等

7、全域性toast、骨架屏、快取、格式化文字、圖片選擇裁剪和上傳、瀑布流和各種Util這些都是優秀的外掛所提供的功能(再次感謝所有開源作者)

8、基於Intl的國際化、APP主題切換。

9、你的viewmodel只要是繼承ViewStateModel,並註冊CacheDataFactory,就可以實現首次載入自動快取,無網自動顯示上次快取(快取方式採用的mmkv 快取記憶體)
複製程式碼

使用方法

牆裂建議執行DEMO並檢視原始碼和註釋,以及pub中的註釋(其中有很多使用頻率很高的外掛,可以檢視他們的文件,熟練使用能提高開發效率)。

很簡單,如下操作:
    1、頁面/wiget,繼承Basestate/BaseStatelessWidget
    2、骨架屏繼承BaseSkeletonWidget
    3、ViewModel(VM)繼承 ViewStateModel的子類,如:SingleViewStateModel、RefreshListViewStateModel(也可以根據需求自己封裝)
    
頁面程式碼如下(頁面請使用Basestate):

class APageState extends BaseState<APage>{
@override
 Widget build(BuildContext context) {
     return switchStatusBar2Dark(
     ///全域性VM 如:使用者VM,可以在登入登出時對整個專案進行狀態重新整理和管理。
     ///框架自己也定義了一些常用地全域性VM  可見DEMO
        child: Consumer<全域性VM>(
        builder:(ctx,全域性VM,child){
            ///當前頁面的VM
            return ProviderWidget<當前頁面VM>(
                model:初始化你的vm
                onModelReady:(model){
                    啟動你的model,///可選
                }
                builder(ctx,你的vm,child){
                    reutrn 你的頁面;
                }
            );
            
        }
        )
     );
 }

}
    
    
你的ViewModel(VM)程式碼:
///自定義ViewModel話,繼承自ViewStateModel即可
class YourPageViewModel extends SingleViewStateModel{
    
}
複製程式碼

具體使用方法可以見DEMO

GITHUB 整合

當你clone下專案後,可以看到一下幾個檔案:
    main ///入口
    base_framework ///bedrock 框架核心資料夾
    I10n  /// I10n外掛建立,也可能是得你自己手動建立,具體可以百度I10n 瞭解
    generated ///I10n 在你編輯語言檔案後自動生成的 ,請不要編輯這個資料夾下的內容
    page ///你的專案頁面  
    service_api  ///專案介面 對應原生的repository
    

我暫時沒有打算把base_framework摘出來,通過pub來整合,因為個人可能都有自己的定製需求,pub整合並不便於按照自己的需求修改。 
況且,直接clone整合還是非常簡單的,只需要clone專案後將除了base_framework的其它資料夾刪除即可。
複製程式碼

DEMO

主要分為兩部分:功能性演示和綜合性演示。請直接clone專案進行執行瀏覽,我在DEMO加了詳盡的註釋,強烈建議執行和閱讀DEMO的程式碼。
複製程式碼

連結:Bedrock

github.com/bladeofgod/…

感謝

再次感謝廣大開源者的奉獻和大佬的分享,菜鳥的成長離不開各位的幫助。
此框架屬於菜雞初試身手,稚嫩之處還請海涵,不足之處歡迎斧正,不勝感激。複製程式碼

相關文章