Flutter UI 1.0.2落地與優化小結

時間 2019-12-04

標籤 flutter 1.0.2 落地優化小結简体版

原文原文鏈接

項目倉庫目前最新版本1.0.2已經提供下載，歡迎提交PR與issueandroid

FLUTTER 1.0.0 遇到的問題

崩潰率高沒加入監控
ui交互過於簡陋
多語言設置重啓後會重置
項目初期頻繁更新問題
風格定製化問題

針對以上，咱們連續作了兩個版本迭代，終於解決了大部分問題，目前版本相對於1.0.0作了大部分重構與優化git

崩潰問題

支持 AndroidX 目前flutter 的 compileSdkVersion 最低要求爲 28，1.0.0 咱們採起了老的27進行開發，目前已經全面升級到28，升級方法能夠參考,目前dev分支不太適合做爲開發分支，小米機型頻繁崩潰，連接通道
Firebase crashlytics 接入，能夠更好了解app的崩潰狀況，後面能夠針對crash進行快速定位github

風格重構

針對海量訴求說 1.0.0 ui過於醜陋，咱們也探索了幾個方法去優化，借鑑了掘金交互，咱們完成了ui的重構，而且引用了 Material UI color 的樣式定義了多主題適配方案，讓更多同窗能夠定義本身的風格redux

多主題實現

lib/main.dart 咱們使用 scopedModel 進行了數據監聽而且更新根節點的方式進行熱更主題的效果,redux,bloc以及state 均可以實現bash

@override
  Widget build(BuildContext context) {
    return Store.init(
      model: model,
      child: Store.connect(builder: (context, child, model) {
        return MaterialApp(
          ......
          theme: AppTheme.getThemeData(model.config.state.theme),//關鍵操做部分
          ......
        );
      }),
    );
  }
複製代碼

多語言重置問題

開發過程當中，咱們忽略了本地化的問題，1.0.2 已經fixedapp

自動更新

爲了更人性化的進行迭代推送，咱們加入了版本檢測功能，踩過了很多的坑位，目前最大的是權限檢測crash 新版本flutter 已經解決了這個問題，老的版本仍然存在async

實現方式

lib/dart 代碼實現片斷ide

import 'package:package_info/package_info.dart'; //檢測當前包是否與遠程包版本一致
import 'package:efox_flutter/store/http.dart' as Http;
import 'package:path_provider/path_provider.dart'; //讀取app路徑
import 'package:flutter_downloader/flutter_downloader.dart';// 下載庫
import 'package:open_file/open_file.dart';// 打開apk
import 'package:permission_handler/permission_handler.dart';// 獲取並授予權限
// 權限檢測  確保獲取存儲權限
Future<bool> _checkPermission() async {
    ...
}
// 獲取安裝地址
Future<String> get _apkLocalPath async {
    final directory = await getExternalStorageDirectory();
    return directory.path;
}
// 檢查app版本
Future<Null> check(context, {showTips: false}) async {
    ......
}
// 下載並打開apk進行安裝
Future _downAndInstall(String version) async {
   ...... 
}
複製代碼

android/app/src/main/res/AndroidManifest.xml 加入測試

<!-- Flutterdownloader configuration -->
        <provider
            android:name="vn.hunghd.flutterdownloader.DownloadedFileProvider"
            android:authorities="${applicationId}.flutter_downloader.provider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/provider_paths"/>
        </provider>

        <provider
            android:name="androidx.work.impl.WorkManagerInitializer"
            android:authorities="${applicationId}.workmanager-init"
            android:enabled="false"
            android:exported="false" />

        <provider
            android:name="vn.hunghd.flutterdownloader.FlutterDownloaderInitializer"
            android:authorities="${applicationId}.flutter-downloader-init"
            android:exported="false">
            <meta-data
                android:name="vn.hunghd.flutterdownloader.MAX_CONCURRENT_TASKS"
                android:value="5" />
        </provider>

        <!-- Flutterdownloader configuration end -->
複製代碼