Flutter通知提醒插件flutter_siren的使用

发布于 1周前 作者 gougou168 来自 Flutter

Flutter通知提醒插件flutter_siren的使用

flutter_siren 是一个用于在Flutter应用中检查新版本并提示用户升级的插件。它支持iOS、Android和macOS平台,基于流行的 Siren 库开发。

一、安装

  1. 添加依赖
    pubspec.yaml 文件中添加 flutter_siren 依赖:

    dependencies:
      flutter_siren: ^latest-version
    

    请将 ^latest-version 替换为最新的版本号。

  2. 安装依赖
    在命令行中运行以下命令来安装依赖:

    $ flutter pub get
    

二、基本用法

下面是一个简单的示例,展示了如何在按钮点击时检查应用更新并弹出提示框。

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

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

class VersionText extends StatelessWidget {
  final Future data;

  const VersionText(this.data, {Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          return Text(snapshot.data.toString());
        } else if (snapshot.hasError) {
          return Text(snapshot.error?.toString() ?? "Error");
        } else {
          return const Text('Loading...');
        }
      },
      future: data,
    );
  }
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final siren = Siren();

    return MaterialApp(
      title: 'Flutter Siren Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Flutter Siren Demo'),
        ),
        body: Builder(
          builder: (context) => Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                const Text(
                  '请更改iOS Bundle Identifier或Android Package命名空间为已发布到应用商店的应用,并按下按钮以显示更新对话框:',
                ),
                TextButton(
                  child: const Text('检查更新'),
                  onPressed: () => siren.promptUpdate(context),
                ),
                const Text('本地版本:'),
                VersionText(siren.localVersion),
                const Text('商店版本:'),
                VersionText(siren.storeVersion),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

三、自定义提示框

你可以通过传递参数来自定义提示框的内容。以下是可自定义的选项:

参数 描述 默认值
title 提示框标题 “Update Available”
message 提示框消息 “There is an updated version available on the App Store. Would you like to upgrade?”
buttonUpgradeText 升级按钮文本 “Upgrade”
buttonCancelText 取消按钮文本 “Cancel”
forceUpgrade 是否隐藏取消按钮(强制用户升级) false

示例代码:

siren.promptUpdate(context, 
  title: "我的提示标题", 
  message: "兄弟,更新我的应用吧!", 
  buttonUpgradeText: "下载",  
  buttonCancelText: "不,谢谢",
  forceUpgrade: true
);

四、自定义更新提示逻辑

如果你想要完全自定义更新提示的逻辑,可以使用 updateIsAvailable 方法来检查是否有新版本可用。该方法返回一个布尔值,表示是否有新版本。

示例代码:

final siren = Siren();

FutureBuilder<bool>(
  future: siren.updateIsAvailable(),
  builder: (context, AsyncSnapshot<bool> snapshot){ 
    if (snapshot.hasData && snapshot.data == true) {
      return AlertDialog(
        title: Text("有新版本可用"),
        content: Text("是否要更新?"),
        actions: <Widget>[
          TextButton(
            child: Text("更新"),
            onPressed: () {
              // 处理更新逻辑
            },
          ),
          TextButton(
            child: Text("取消"),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
        ],
      );
    } else if (snapshot.hasError) {
      return Text("检查更新失败");
    } else {
      return Text("正在检查更新...");
    }
  }
);

五、获取本地和商店版本

你可以使用 localVersionstoreVersion 获取应用的本地版本和商店中的最新版本。

示例代码:

final siren = Siren();

final local = siren.localVersion;  // 获取本地版本
final store = siren.storeVersion;  // 获取商店版本

更多关于Flutter通知提醒插件flutter_siren的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter通知提醒插件flutter_siren的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用flutter_siren插件来实现通知提醒的示例代码。flutter_siren插件主要用于在应用程序有新版本时向用户显示本地通知。

步骤 1: 添加依赖

首先,在你的pubspec.yaml文件中添加flutter_siren依赖:

dependencies:
  flutter:
    sdk: flutter
  flutter_siren: ^2.0.0  # 确保使用最新版本,请检查pub.dev上的最新版本号

然后运行flutter pub get来安装依赖。

步骤 2: 配置插件

在你的main.dart文件中配置flutter_siren插件。以下是一个基本的示例:

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

void main() {
  // 初始化Siren插件
  SirenConfig config = SirenConfig(
    // 应用的版本信息URL(通常是一个JSON文件)
    url: 'https://example.com/version.json',
    // 是否显示总是更新提醒(即使用户已经忽略过)
    enableAlwaysShow: false,
    // 通知的标题
    title: '新版本可用',
    // 通知的内容
    message: '发现新版本,请更新应用程序。',
    // 更新按钮的文本
    updateButtonText: '更新',
    // 忽略按钮的文本
    ignoreButtonText: '稍后',
    // 通知的图标(可以为null)
    icon: 'assets/ic_update.png',
    // 自定义点击更新按钮后的行为(可以为null)
    onUpdate: () async {
      // 打开应用商店页面或执行其他操作
      // 例如:如果是iOS,可以跳转到App Store页面
      if (Platform.isIOS) {
        await launch('itms-apps://itunes.apple.com/app/idYOUR_APP_ID');
      } else if (Platform.isAndroid) {
        // 对于Android,可以启动Play Store页面
        await launch('market://details?id=com.yourapp.package');
      }
    },
    // 自定义点击忽略按钮后的行为(可以为null)
    onIgnore: () {
      // 用户选择稍后更新时执行的操作
      print('用户选择稍后更新');
    },
  );

  // 使用SirenWrapper包装MaterialApp
  runApp(SirenWrapper(
    child: MyApp(),
    config: config,
  ));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Siren Demo'),
      ),
      body: Center(
        child: Text('检查新版本...'),
      ),
    );
  }
}

步骤 3: 准备版本信息文件

你需要准备一个版本信息文件(JSON格式),通常托管在你的服务器上。例如,version.json文件内容如下:

{
  "android_version_code": 2,
  "ios_version_number": "2.0.0",
  "changelog": "修复了一些bug并改进了用户体验。"
}

确保文件中的版本号高于当前应用程序的版本号,这样flutter_siren才会显示更新通知。

运行应用程序

现在,你可以运行你的Flutter应用程序。当应用程序启动时,flutter_siren将检查版本信息文件,如果有新版本可用,它将显示一个本地通知提醒用户更新。

以上示例展示了如何使用flutter_siren插件在Flutter应用程序中实现通知提醒功能。你可以根据需要调整配置和自定义行为。

回到顶部