Flutter版本比较插件version_comparator的使用

Flutter版本比较插件version_comparator的使用

简介

VersionComparator 是一个用于在Flutter应用中比较本地版本和商店版本的插件。它支持多个平台（如Google Play、App Store、华为应用市场等），并且提供了丰富的自定义选项，使得开发者可以根据需要灵活地管理版本更新提示。

主要特性

• 多平台支持：支持Android、iOS、华为应用市场以及自定义商店。
• 可定制化：可以自定义错误信息、提示信息、对话框样式等。
• 简单易用：提供简洁的API，方便集成到现有项目中。
• 强大的结构：支持Future操作和Widget两种方式来比较版本。
• 显示对话框或自定义组件：当版本不一致时，可以选择显示AlertDialog或自定义的Widget。

使用方法

1. 导入包

首先，在pubspec.yaml文件中添加version_comparator依赖：

dependencies:
  version_comparator: ^最新版本号

然后在Dart文件中导入包：

import 'package:version_comparator/version_comparator.dart';

2. 比较版本

2.1 使用Future操作比较版本

你可以通过调用versionCompare()方法来比较本地版本和商店版本。该方法返回一个DataResult<VersionResponseModel>对象，其中包含版本比较的结果。

Future<void> compareVersion() async {
  // 设置加载状态
  _setLoading(true);
  
  // 获取商店和本地版本的结果
  final response = await VersionComparator.instance.versionCompare();
  
  // 关闭加载状态
  _setLoading(false);
  
  // 显示结果
  print(response?.data?.toJson() ?? '-');
}

2.2 使用Widget比较版本

AppVersionComparatorView是一个封装好的Widget，它可以自动处理版本比较的逻辑，并根据比较结果显示不同的页面。你可以选择使用widget模式或alertDialog模式。

• Widget模式：直接在界面上显示版本比较的结果。

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text(widget.title)),
    body: AppVersionComparatorView.widget(
      errorPageBuilder: (context, error) => Center(child: Text(error)),
      onCompareSuccess: (data) => debugPrint('Success: ${data.storeVersion}'),
      outOfDateVersionPageBuilder: (context, error, data) => _buildOutOfDateWidget(error, data),
      child: _buildBody(),
    ),
  );
}

• AlertDialog模式：通过对话框显示版本比较的结果。

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text(widget.title)),
    body: AppVersionComparatorView.alertDialog(
      onCompareSuccess: (data) => debugPrint('Success: ${data.storeVersion}'),
      invalidVersionDialogContentBuilder: (context, message) => Text('Error: $message'),
      child: _buildBody(),
    ),
  );
}

3. 自定义比较

如果你的应用版本来自非标准商店（如自定义的Web API），你可以使用customCompare方法来自定义版本比较逻辑。

Future<void> customCompareVersion() async {
  _setLoading(true);
  final result = await VersionComparator.instance.customCompare(
    localVersion: '1.0.0',
    store: MyStoreModel(appId: 'YOUR_APP_BUNDLE_ID'),
    customUpdateLink: (body) => 'YOU CAN ADD CUSTOM UPDATE LINK',
    onConvertVersion: (responseBody) {
      final result = MyVersionConvertManager().convert(MyVersionResponseModel.fromResponse(responseBody));
      return result.data;
    },
  );

  _setLoading(false);
  _setResultMessage(result);
}

4. 显示版本更新对话框

当检测到应用版本过旧时，你可以使用showSimpleVersionDialog方法来显示一个简单的版本更新对话框。

await VersionComparator.instance.showSimpleVersionDialog(
  context,
  versionResponseModel,
  isUpdateRequired: true,
);

5. 自定义消息

你可以通过继承ComparatorErrorMessage或ComparatorInfoMessage类来自定义错误和提示信息。

// 自定义错误消息
class MyCustomErrorMessage extends ComparatorErrorMessage {
  [@override](/user/override)
  String get appNotFound => '应用未在商店中找到。';

  [@override](/user/override)
  String get appVersionFetchError => '无法获取应用版本信息。';
}

// 设置自定义错误消息
VersionComparator.instance.setErrorMessages(MyCustomErrorMessage());

// 自定义提示消息
class MyCustomInfoMessage implements ComparatorInfoMessage {
  [@override](/user/override)
  String get checkVersionErrorDialogTitle => '版本检查错误';

  [@override](/user/override)
  String get checkVersionLoadingMessage => '正在检查版本...';
}

// 设置自定义提示消息
VersionComparator.instance.setInfoMessages(MyCustomInfoMessage());

完整示例Demo

以下是一个完整的示例代码，展示了如何使用version_comparator插件来比较应用版本，并根据比较结果显示不同的UI。

import 'package:flutter/material.dart';
import 'package:version_comparator/version_comparator.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(home: MyHomePage());
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool _isLoading = false;
  String _versionResult = '';

  [@override](/user/override)
  void initState() {
    super.initState();
    // 替换提示信息（可选）
    VersionComparator.instance.setInfoMessages(CustomInfoMessage());

    // 替换错误信息（可选）
    VersionComparator.instance.setErrorMessages(CustomErrorMessage());
  }

  void _setLoading(bool value) {
    setState(() {
      _isLoading = value;
    });
  }

  void _setResult(String message) {
    setState(() {
      _versionResult = message;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Version Comparator')),
      body: buildVersionCompareWithAlertDialog(),
    );
  }

  // 使用Widget模式比较版本
  Widget buildVersionCompareWithWidget() {
    return AppVersionComparatorView.widget(
      errorPageBuilder: (_, error) => Center(child: Text(error)),
      onCompareSuccess: (data) => debugPrint('Success: ${data.storeVersion}'),
      outOfDateVersionPageBuilder: (_, error, data) =>
          _buildOutOfDateWidget(error, data),
      huaweiId: 'HUAWEI_APP_ID', // 如果需要比较华为应用市场的版本，请设置此参数
      child: _buildBody(),
    );
  }

  // 使用AlertDialog模式比较版本
  Widget buildVersionCompareWithAlertDialog() {
    return AppVersionComparatorView.alertDialog(
      onCompareSuccess: (data) => debugPrint('Success: ${data.storeVersion}'),
      invalidVersionDialogContentBuilder: (context, message) =>
          Text('Error: $message'),
      child: _buildBody(),
    );
  }

  // 比较本地版本和商店版本
  Future<void> compareVersion() async {
    _setLoading(true);
    final result = await VersionComparator.instance.versionCompare();

    _setLoading(false);
    _setResultMessage(result);
  }

  // 自定义版本比较
  Future<void> customCompareVersion() async {
    _setLoading(true);
    final result = await VersionComparator.instance.customCompare(
      localVersion: '1.0.0',
      store: MyStoreModel(appId: 'YOUR_APP_BUNDLE_ID'),
      customUpdateLink: (body) => 'YOU CAN ADD CUSTOM UPDATE LINK',
      onConvertVersion: (responseBody) {
        final result = MyVersionConvertManager()
            .convert(MyVersionResponseModel.fromResponse(responseBody));
        return result.data;
      },
    );

    _setLoading(false);
    _setResultMessage(result);
  }

  // 显示版本更新对话框
  Future<void> _showVersionDialog(VersionResponseModel versionResponseModel,
      {bool isRequired = false}) async {
    await VersionComparator.instance.showSimpleVersionDialog(
      context,
      versionResponseModel,
      isUpdateRequired: isRequired,
    );
  }

  Widget _buildOutOfDateWidget(String error, VersionResponseModel data) {
    return Column(
      mainAxisSize: MainAxisSize.max,
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Text(error, textAlign: TextAlign.center),
        const SizedBox(height: 16),
        Text('当前版本: ${data.localVersion}'),
        Text('新版本: ${data.storeVersion}'),
      ],
    );
  }

  Padding _buildBody() {
    return Padding(
      padding: const EdgeInsets.all(24.0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Text(_versionResult, textAlign: TextAlign.center),
          const SizedBox(height: 16),
          ElevatedButton(
            onPressed: _isLoading ? null : () async => customCompareVersion(),
            child: _isLoading
                ? const CircularProgressIndicator()
                : const Text('比较应用版本'),
          ),
          const SizedBox(height: 20),
          ElevatedButton(
            onPressed: () async => await _showVersionDialog(_getResponseExample),
            child: const Text('显示更新对话框'),
          ),
        ],
      ),
    );
  }

  void _setResultMessage(DataResult<VersionResponseModel> result) {
    if (result.isNotSuccess || result.data == null) {
      _setResult('错误: ${result.message}');
    } else if (result.data!.isAppVersionOld) {
      _setResultAndShowVersionDialog(
          '错误: 应用版本已过期，请更新', result.data!);
    } else {
      _setResult('成功: 应用版本已是最新');
    }
  }

  Future<void> _setResultAndShowVersionDialog(
      String message, VersionResponseModel responseModel) async {
    _setResult(message);
    await _showVersionDialog(responseModel);
  }

  VersionResponseModel get _getResponseExample {
    return VersionResponseModel(
      localVersion: '1.0.0',
      storeVersion: '1.0.1',
      updateLink: 'https://www.example.com/',
    );
  }
}