强大的Flutter App升级功能

注意：无特殊说明，Flutter版本及Dart版本以下：

• Flutter版本： 1.12.13+hotfix.5
• Dart版本： 2.7.0

应用程序升级功能是App的基础功能之一，若是没有此功能会形成用户没法升级，应用程序的bug或者新功能老用户没法触达，甚至损失这部分用户。

对于应用程序升级功能的重要性就无需赘言了，下面介绍下应用程序升级功能的几种方式，从平台方面来讲：

• IOS平台，应用程序升级功能只能经过跳转到app store进行升级。
• Android平台，既能够经过跳转到应用市场进行升级，也能够下载apk包升级。

从强制性来讲能够分别强制升级和非强制升级：

• 强制升级：就是用户必须升级才能继续使用App，若是不是很是必要不建议使用如此强硬的方式，会形成用户的反感。
• 非强制升级就是容许用户点击“取消”，继续使用App。

下面分别介绍IOS和Android升级流程。

IOS升级流程

IOS升级流程以下：

流程说明：

1. 一般咱们会访问后台接口获取是否有新的版本，若是有新的版本则弹出提示框，判断当前版本是否为“强制升级”，若是是则只提供用户一个“升级”的按钮，不然提供用户“升级”和“取消”按钮。
2. 弹出提示框后用户选择是否升级，若是选择“取消”，提示框消失，若是选择“升级”，跳转到app store进行升级。

Android 升级流程

相比ios的升级过程，Android就稍显复杂了，流程图以下：

流程说明：

1. 访问后台接口获取是否有新的版本，这里和IOS是同样的，有则弹出升级提示框，判断当前版本是否为“强制升级”，若是是则只提供用户一个“升级”的按钮，不然提供用户“升级”和“取消”按钮。
2. 弹出提示框后有用户选择是否升级，若是选择“取消”，提示框消失，若是选择“升级”，判断是跳转到应用市场进行升级仍是经过下载apk升级。
3. 若是下载apk升级，则开始下载apk，下载完成后跳转到apk安装引导界面。
4. 若是跳转到应用市场升级，判断是否指定了应用市场，好比只在华为应用市场上架了，那么此时须要指定跳转到华为应用市场，即便你在不少应用市场都上架了，也应该根据用户手机安装的应用市场指定一个应用市场，让用户选择应用市场不是一个好的体验，并且用户也不知道应该去哪一个市场更新，若是用户选择了一个你没有上架的应用市场，那就更尴尬了。
5. 指定应用市场后直接跳转到指定的应用市场的更新界面。

介绍完了升级流程，主角终于出场了。

App升级功能使用介绍

只需在主页的initState方法中调用升级检测方法：

@override
  void initState() {
    AppUpgrade.appUpgrade(
      context,
      _checkAppInfo(),
      iosAppId: 'id88888888',
    );
    super.initState();
  }复制代码

_checkAppInfo方法访问后台接口获取是否有新的版本的信息，返回Future<AppUpgradeInfo> 类型，AppUpgradeInfo包含title、升级内容、apk下载url、是否强制升级等版本信息。

iosAppId参数用于跳转到app store。

_checkAppInfo()方法一般是访问后台接口，这里直接返回新版本信息，代码以下：

Future<AppUpgradeInfo> _checkAppInfo() {
  return Future.value(AppUpgradeInfo(
    title: '新版本V1.1.1',
    contents: [
      '一、支持立体声蓝牙耳机，同时改善配对性能',
      '二、提供屏幕虚拟键盘',
      '三、更简洁更流畅，使用起来更快',
      '四、修复一些软件在使用时自动退出bug',
      '五、新增长了分类查看功能'
    ],
    apkDownloadUrl: '',
    force: false,
  ));复制代码

好了，基本的升级功能就完成了，弹出提示框的效果以下：

点击“之后再说”，提示框消失，点击“当即体验”，自动区分不一样平台。

访问后台接口获取新版本的信息通常须要当前App的包名和版本，查询方法以下：

await FlutterUpgrade.appInfo复制代码

返回的类型是AppInfo：

• versionName：版本号，好比1.0.0。
• versionCode：Android独有版本号，对应Android build.gradle中的versionCode，ios返回“0”。
• packageName：包名，对应Android build.gradle中的applicationId，ios的BundleIdentifier。

iOS平台升级

iOS平台直接跳转到app store相关页面，iosAppId必定要设置对，不然app store会找不到应用程序。

Android平台下载apk

Android平台则会判断是否设置了apk下载url，若是设置了则下载apk则直接下载，效果以下：

当下载完成时直接跳转到apk安装引导界面，效果以下：

用户点击容许，出现以下界面：

点击继续安装便可，上面的安装引导界面是系统界面，不一样的手机或者不一样的Android版本会略有不一样。

Android平台跳转应用市场

若是不提供apk下载地址，点击“当即体验”，则会跳转到应用市场，不指定应用市场则会弹出提示框，让用户选择应用市场，效果以下：

提示框内将会包含手机内安装的全部的应用市场，用户选择一个而后跳转到对应应用市场的详情界面，若是当前应用未在此市场上架则会出现“找不到的界面”。

一般状况下会指定应用市场，这就须要知道用户手机内安装的应用市场，查询方法以下：

_getInstallMarket() async {
  List<String> marketList = await FlutterUpgrade.getInstallMarket();
}复制代码

插件内置了国内经常使用的应用市场，包括小米、魅族、vivo、oppo、华为、zte、360助手、应用宝、pp助手、豌豆荚，若是你须要检测其余的应用市场，好比google play，只需添加googl play的包名便可：

_getInstallMarket() async {
  List<String> marketList = await FlutterUpgrade.getInstallMarket(marketPackageNames: ['google play 包名']);
}复制代码

方法返回手机安装的应用市场，根据安装的应用市场指定跳转应用市场，若是你要指定内置的应用市场，能够根据包名获取内置的应用市场的相关信息：

AppMarketInfo _marketInfo = AppMarket.getBuildInMarket(packageName);复制代码

指定华为应用市场：

AppUpgrade.appUpgrade(
  context,
  _checkAppInfo(),
  iosAppId: 'id88888888',
  appMarketInfo: AppMarket.huaWei
);复制代码

指定没有内置的应用市场方法以下：

AppUpgrade.appUpgrade(
  context,
  _checkAppInfo(),
  iosAppId: 'id88888888',
  appMarketInfo: AppMarketInfo(
    '应用市场名称（选填）','应用市场包名','应用市场类名'
  ),
);复制代码

提示框样式定制

若是默认的升级提示框不知足你的需求，那么你能够定制你的升级提示框。

title及升级内容文字样式设置：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    titleStyle: TextStyle(fontSize: 30),
    contentStyle: TextStyle(fontSize: 18),
    ...
)复制代码

经过titleStyle和contentStyle设置其样式，能够设置字体大小、颜色、粗体等。

设置“取消”和“升级按钮”文本和样式：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    cancelText: '之后再说',
    cancelTextStyle: TextStyle(color: Colors.grey),
    okText: '立刻升级',
    okTextStyle: TextStyle(color: Colors.red),
    ...
)复制代码

默认“取消”按钮文本是"之后再说"，默认“升级”按钮的文本是“当即体验”。

设置“升级”按钮的背景颜色，须要2种颜色，2种颜色左到右线性渐变，若是想设置纯色，只需将2种颜色设置为同一个颜色便可，默认颜色是系统的primaryColor:

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    okBackgroundColors: [Colors.blue, Colors.lightBlue],
    ...
)复制代码

设置进度条的颜色：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    progressBarColor: Colors.lightBlue.withOpacity(.4),
    ...
)复制代码

设置升级提示框的圆角半径，默认是20：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    borderRadius: 15,
    ...
)复制代码

因为环境的缘由，目前源代码还没法发布到github及pub上，后续会开源，固然也能够关注个人公众号，回复“flutter 升级”便可得到源代码。

欢迎加入Flutter的微信交流群(微信：laomengit)，一块儿学习，一块儿进步，生活不止眼前的苟且，还有诗和《远方》。

很是但愿您关注我我的的公众号，里面有各类福利等着你们哦。