Flutter UI 1.0.2落地与优化小结

项目仓库 目前最新版本1.0.2已经提供下载，欢迎提交PR与issue

FLUTTER 1.0.0 遇到的问题

• 崩溃率高 没加入监控
• ui交互过于简陋
• 多语言设置重启后会重置
• 项目初期频繁更新问题
• 风格定制化问题

针对以上，咱们连续作了两个版本迭代，终于解决了大部分问题，目前版本相对于1.0.0作了大部分重构与优化

崩溃问题

支持 AndroidX 目前flutter 的 compileSdkVersion 最低要求为 28，1.0.0 咱们采起了老的27进行开发，目前已经全面升级到28， 升级方法能够参考,目前dev分支不太适合做为开发分支，小米机型频繁崩溃，连接通道
Firebase crashlytics 接入，能够更好了解app的崩溃状况，后面能够针对crash进行快速定位

风格重构

针对海量诉求说 1.0.0 ui过于丑陋，咱们也探索了几个方法去优化，借鉴了掘金交互，咱们完成了ui的重构，而且引用了 Material UI color 的样式定义了多主题适配方案，让更多同窗能够定义本身的风格

多主题实现

lib/main.dart 咱们使用 scopedModel 进行了数据监听而且更新根节点的方式进行热更主题的效果,redux,bloc以及state 均可以实现

@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 已经fixed

自动更新

为了更人性化的进行迭代推送，咱们加入了版本检测功能，踩过了很多的坑位，目前最大的是权限检测crash 新版本flutter 已经解决了这个问题，老的版本仍然存在

实现方式

lib/dart 代码实现片断

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 -->
复制代码

小结

通过以上优化后，目前 flutter ui 已经进入了相对稳定的版本，后续迭代与更新能够无缝对接，而且针对IOS 也做出了兼容性方案处理，通过测试流畅度也获得了比较不错的提高，

不足的地方

• 数据设计模型过于复杂，须要进一步优化
• 代码切分力度有待增强
• 教材文档因工做问题更新缓慢持续推动中
• 个性化交互有待增强加入版本迭代规划中

如你们有兴趣能够一块儿加入讨论，帮助咱们作得更好！