注意：無特殊說明，F(xiàn)lutter版本及Dart版本如下：

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

應(yīng)用程序升級功能是App的基礎(chǔ)功能之一，如果沒有此功能會造成用戶無法升級，應(yīng)用程序的bug或者新功能老用戶無法觸達(dá)，甚至損失這部分用戶。

對于應(yīng)用程序升級功能的重要性就無需贅言了，下面介紹下應(yīng)用程序升級功能的幾種方式，從平臺方面來說：

• IOS平臺，應(yīng)用程序升級功能只能通過跳轉(zhuǎn)到app store進(jìn)行升級。
• Android平臺，既可以通過跳轉(zhuǎn)到應(yīng)用市場進(jìn)行升級，也可以下載apk包升級。

從強(qiáng)制性來說可以分別強(qiáng)制升級和非強(qiáng)制升級：

• 強(qiáng)制升級：就是用戶必須升級才能繼續(xù)使用App，如果不是非常必要不建議使用如此強(qiáng)硬的方式，會造成用戶的反感。
• 非強(qiáng)制升級就是允許用戶點(diǎn)擊“取消”，繼續(xù)使用App。

下面分別介紹IOS和Android升級流程。

IOS升級流程

IOS升級流程如下：

流程說明：

1. 通常我們會訪問后臺接口獲取是否有新的版本，如果有新的版本則彈出提示框，判斷當(dāng)前版本是否為“強(qiáng)制升級”，如果是則只提供用戶一個(gè)“升級”的按鈕，否則提供用戶“升級”和“取消”按鈕。
2. 彈出提示框后用戶選擇是否升級，如果選擇“取消”，提示框消失，如果選擇“升級”，跳轉(zhuǎn)到app store進(jìn)行升級。

Android 升級流程

相比ios的升級過程，Android就稍顯復(fù)雜了，流程圖如下：

流程說明：

1. 訪問后臺接口獲取是否有新的版本，這里和IOS是一樣的，有則彈出升級提示框，判斷當(dāng)前版本是否為“強(qiáng)制升級”，如果是則只提供用戶一個(gè)“升級”的按鈕，否則提供用戶“升級”和“取消”按鈕。
2. 彈出提示框后有用戶選擇是否升級，如果選擇“取消”，提示框消失，如果選擇“升級”，判斷是跳轉(zhuǎn)到應(yīng)用市場進(jìn)行升級還是通過下載apk升級。
3. 如果下載apk升級，則開始下載apk，下載完成后跳轉(zhuǎn)到apk安裝引導(dǎo)界面。
4. 如果跳轉(zhuǎn)到應(yīng)用市場升級，判斷是否指定了應(yīng)用市場，比如只在華為應(yīng)用市場上架了，那么此時(shí)需要指定跳轉(zhuǎn)到華為應(yīng)用市場，即使你在很多應(yīng)用市場都上架了，也應(yīng)該根據(jù)用戶手機(jī)安裝的應(yīng)用市場指定一個(gè)應(yīng)用市場，讓用戶選擇應(yīng)用市場不是一個(gè)好的體驗(yàn)，而且用戶也不知道應(yīng)該去哪個(gè)市場更新，如果用戶選擇了一個(gè)你沒有上架的應(yīng)用市場，那就更尷尬了。
5. 指定應(yīng)用市場后直接跳轉(zhuǎn)到指定的應(yīng)用市場的更新界面。

介紹完了升級流程，主角終于出場了。

App升級功能使用介紹

只需在主頁的initState方法中調(diào)用升級檢測方法：

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

_checkAppInfo方法訪問后臺接口獲取是否有新的版本的信息，返回Future<AppUpgradeInfo> 類型，AppUpgradeInfo包含title、升級內(nèi)容、apk下載url、是否強(qiáng)制升級等版本信息。

iosAppId參數(shù)用于跳轉(zhuǎn)到app store。

_checkAppInfo()方法通常是訪問后臺接口，這里直接返回新版本信息，代碼如下：

Future<AppUpgradeInfo> _checkAppInfo() {
  return Future.value(AppUpgradeInfo(
    title: '新版本V1.1.1',
    contents: [
      '1、支持立體聲藍(lán)牙耳機(jī)，同時(shí)改善配對性能',
      '2、提供屏幕虛擬鍵盤',
      '3、更簡潔更流暢，使用起來更快',
      '4、修復(fù)一些軟件在使用時(shí)自動退出bug',
      '5、新增加了分類查看功能'
    ],
    apkDownloadUrl: '',
    force: false,
  ));

好了，基本的升級功能就完成了，彈出提示框的效果如下：

點(diǎn)擊“以后再說”，提示框消失，點(diǎn)擊“立即體驗(yàn)”，自動區(qū)分不同平臺。

訪問后臺接口獲取新版本的信息一般需要當(dāng)前App的包名和版本，查詢方法如下：

await FlutterUpgrade.appInfo

返回的類型是AppInfo：

• versionName：版本號，比如1.0.0。
• versionCode：Android獨(dú)有版本號，對應(yīng)Android build.gradle中的versionCode，ios返回“0”。
• packageName：包名，對應(yīng)Android build.gradle中的applicationId，ios的BundleIdentifier。

iOS平臺升級

iOS平臺直接跳轉(zhuǎn)到app store相關(guān)頁面，iosAppId一定要設(shè)置對，否則app store會找不到應(yīng)用程序。

Android平臺下載apk

Android平臺則會判斷是否設(shè)置了apk下載url，如果設(shè)置了則下載apk則直接下載，效果如下：

當(dāng)下載完成時(shí)直接跳轉(zhuǎn)到apk安裝引導(dǎo)界面，效果如下：

用戶點(diǎn)擊允許，出現(xiàn)如下界面：

點(diǎn)擊繼續(xù)安裝即可，上面的安裝引導(dǎo)界面是系統(tǒng)界面，不同的手機(jī)或者不同的Android版本會略有不同。

Android平臺跳轉(zhuǎn)應(yīng)用市場

如果不提供apk下載地址，點(diǎn)擊“立即體驗(yàn)”，則會跳轉(zhuǎn)到應(yīng)用市場，不指定應(yīng)用市場則會彈出提示框，讓用戶選擇應(yīng)用市場，效果如下：

提示框內(nèi)將會包含手機(jī)內(nèi)安裝的所有的應(yīng)用市場，用戶選擇一個(gè)然后跳轉(zhuǎn)到對應(yīng)應(yīng)用市場的詳情界面，如果當(dāng)前應(yīng)用未在此市場上架則會出現(xiàn)“找不到的界面”。

通常情況下會指定應(yīng)用市場，這就需要知道用戶手機(jī)內(nèi)安裝的應(yīng)用市場，查詢方法如下：

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

插件內(nèi)置了國內(nèi)常用的應(yīng)用市場，包括小米、魅族、vivo、oppo、華為、zte、360助手、應(yīng)用寶、pp助手、豌豆莢，如果你需要檢測其他的應(yīng)用市場，比如google play，只需添加googl play的包名即可：

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

方法返回手機(jī)安裝的應(yīng)用市場，根據(jù)安裝的應(yīng)用市場指定跳轉(zhuǎn)應(yīng)用市場，如果你要指定內(nèi)置的應(yīng)用市場，可以根據(jù)包名獲取內(nèi)置的應(yīng)用市場的相關(guān)信息：

AppMarketInfo _marketInfo = AppMarket.getBuildInMarket(packageName);

指定華為應(yīng)用市場：

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

指定沒有內(nèi)置的應(yīng)用市場方法如下：

AppUpgrade.appUpgrade(
  context,
  _checkAppInfo(),
  iosAppId: 'id88888888',
  appMarketInfo: AppMarketInfo(
    '應(yīng)用市場名稱(選填)','應(yīng)用市場包名','應(yīng)用市場類名'
  ),
);

提示框樣式定制

如果默認(rèn)的升級提示框不滿足你的需求，那么你可以定制你的升級提示框。

title及升級內(nèi)容文字樣式設(shè)置：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    titleStyle: TextStyle(fontSize: 30),
    contentStyle: TextStyle(fontSize: 18),
    ...
)

通過titleStyle和contentStyle設(shè)置其樣式，可以設(shè)置字體大小、顏色、粗體等。

設(shè)置“取消”和“升級按鈕”文本和樣式：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    cancelText: '以后再說',
    cancelTextStyle: TextStyle(color: Colors.grey),
    okText: '馬上升級',
    okTextStyle: TextStyle(color: Colors.red),
    ...
)

默認(rèn)“取消”按鈕文本是”以后再說”，默認(rèn)“升級”按鈕的文本是“立即體驗(yàn)”。

設(shè)置“升級”按鈕的背景顏色，需要2種顏色，2種顏色左到右線性漸變，如果想設(shè)置純色，只需將2種顏色設(shè)置為同一個(gè)顏色即可，默認(rèn)顏色是系統(tǒng)的primaryColor:

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    okBackgroundColors: [Colors.blue, Colors.lightBlue],
    ...
)

設(shè)置進(jìn)度條的顏色：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    progressBarColor: Colors.lightBlue.withOpacity(.4),
    ...
)

設(shè)置升級提示框的圓角半徑，默認(rèn)是20：

AppUpgrade.appUpgrade(context, _checkAppInfo(),
    borderRadius: 15,
    ...
)

由于環(huán)境的原因，目前源代碼還無法發(fā)布到github及pub上，后續(xù)會開源，當(dāng)然也可以關(guān)注我的公眾號，回復(fù)“flutter 升級”即可獲得源代碼。

歡迎加入Flutter的微信交流群(微信：laomengit)，一起學(xué)習(xí)，一起進(jìn)步，生活不止眼前的茍且，還有詩和《遠(yuǎn)方》。

非常希望您關(guān)注我個(gè)人的公眾號，里面有各種福利等著大家哦。