Flutter推送消息插件flutter_pushed_messaging的使用

Flutter推送消息插件flutter_pushed_messaging的使用

获取开始

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

# 添加此行到你的dependencies
flutter_pushed_messaging: ^1.4.0

然后在你的Dart文件中导入插件:

import 'flutter_pushed_messaging/flutter_pushed_messaging.dart';
iOS 配置

在iOS上,确保你已经正确配置了应用以支持推送通知。你需要添加推送通知功能和远程通知后台模式。

AppDelegate.m/AppDelegate.swift文件中添加以下代码:

if #available(iOS 10.0, *) {
  UNUserNotificationCenter.current().delegate = self as? UNUserNotificationCenterDelegate
}
Android 配置
支持Fcm

在你的根目录下的build.gradle文件中添加以下依赖:

buildscript {
...
    dependencies {
        classpath 'com.google.gms:google-services:4.3.15'
        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.8.1'
        ...
    }
}

google-services.json文件放置在Android/app目录下,并在app/build.gradle文件中添加以下插件:

...
apply plugin: 'com.google.gms.google-services'
apply plugin: 'com.google.firebase.crashlytics'
支持Hpk

在你的根目录下的build.gradle文件中添加以下依赖:

buildscript {
...
    repositories {
        ...
        maven { url 'https://developer.huawei.com/repo/' }
    }
    dependencies {
        classpath 'com.huawei.agconnect:agcp:1.5.2.300'
        ...
    }
}
allprojects {
    repositories {
        ...
        maven { url 'https://developer.huawei.com/repo/' }
    }
}

agconnect-services.json文件放置在Android/app目录下,并在app/build.gradle文件中添加以下依赖:

...
dependencies {
    ...
    implementation 'com.huawei.agconnect:agconnect-core:1.5.2.300'
}
...
apply plugin: 'com.huawei.agconnect' 
支持RuStore

AndroidManifest.xml文件中添加以下内容:

<application>
...
    <meta-data
        android:name="ru.rustore.sdk.pushclient.project_id"
        android:value="Your RuStore project ID" />
...
</application>

实现

在你的Dart文件中实现消息处理逻辑:

import 'dart:io';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter/services.dart';
import 'package:flutter_pushed_messaging/flutter_pushed_messaging.dart';
import 'package:flutter_local_notifications/flutter_local_notifications.dart';
import 'package:permission_handler/permission_handler.dart' as perm;

[@pragma](/user/pragma)('vm:entry-point')
Future<void> backgroundMessage(Map<dynamic,dynamic> message) async {
  WidgetsFlutterBinding.ensureInitialized();
  print("Backgroung message: $message");
  if(Platform.isAndroid){
    var flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();
    var title=(message["data"]["title"])??"";
    var body=(message["data"]["body"])??"";
    if(title!="" || body!="") {
      await flutterLocalNotificationsPlugin.show(
        8888,
        title,
        body,
        const NotificationDetails(
          android: AndroidNotificationDetails(
              'push_channel', // id
              'MY CHANNEL FOR PUSH',
              icon: 'launch_background',
              ongoing: false,
              importance: Importance.max,
              priority: Priority.high,
              visibility: NotificationVisibility.public,
              enableLights: true
          ),
        ),
      );
    }
  }
}

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  if(Platform.isAndroid) {
    const AndroidNotificationChannel channel = AndroidNotificationChannel(
      'push_channel', // id
      'MY CHANNEL FOR PUSH', // title
      description:
      'This channel is used for push messages', // description
      importance: Importance.max, // importance must be at low or higher level
    );
    var flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();
    await flutterLocalNotificationsPlugin
        .resolvePlatformSpecificImplementation<AndroidFlutterLocalNotificationsPlugin>()
        ?.createNotificationChannel(channel);
    await perm.Permission.notification.request();
  }
  await FlutterPushedMessaging.init(backgroundMessage);
  print("Token: ${FlutterPushedMessaging.token}");
  runApp(const MyApp());
}

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

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  ServiceStatus _status = FlutterPushedMessaging.status;
  String _title = '';
  String _body = '';
  String _token = '';

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState();
  }

  Future<void> initPlatformState() async {
    FlutterPushedMessaging.onMessage().listen((message) {
      print("Message: $message");
      var title=(message["data"]["title"])??"";
      var body=(message["data"]["body"])??"";
      if(title!="" || body!="") {
        setState(() {
          _title=title;
          _body=body;
        });
      }
    });
    FlutterPushedMessaging.onStatus().listen((status) {
      setState(() {
        _status=status;
      });
    });
    if (!mounted) return;
    setState(() {
      _title = '';
      _token=FlutterPushedMessaging.token??"";
      _status=FlutterPushedMessaging.status;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Pushed messaging plugin example app'),
        ),
        body: Center(
            child: Column(
              children: [Text("Service status: $_status",style: Theme.of(context).textTheme.titleMedium),
                Text(_title,style: Theme.of(context).textTheme.titleMedium),
                Text(_body,style: Theme.of(context).textTheme.titleMedium,
                  textAlign: TextAlign.center, maxLines: 3,),
                Text(_token,style: Theme.of(context).textTheme.titleMedium,),
                TextButton(
                    onPressed: () async {
                      await Clipboard.setData(ClipboardData(text: _token));
                    },
                    child: Text("Copy token",style: Theme.of(context).textTheme.titleMedium)),
                if(Platform.isAndroid) TextButton(
                    onPressed: () async {
                      await FlutterPushedMessaging.reconnect();
                    },
                    child: Text("Reconnect",style: Theme.of(context).textTheme.titleMedium)),
                if(!kReleaseMode) TextButton(
                    onPressed: () async {
                      await Clipboard.setData(ClipboardData(text: await FlutterPushedMessaging.getLog()??""));
                    },
                    child: Text("Get Log",style: Theme.of(context).textTheme.titleMedium)),
              ],
            )
        ),
      ),
    );
  }
}

更多关于Flutter推送消息插件flutter_pushed_messaging的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter推送消息插件flutter_pushed_messaging的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter应用中集成推送消息功能时,flutter_pushed_messaging(注意:实际上可能你想说的是flutter_local_notifications或类似的插件,因为flutter_pushed_messaging并不是广泛认知的官方或主流插件)是一个常见的选择。不过,为了符合你的要求,我会假设你指的是一个类似功能的插件,并展示如何使用一个假设的推送消息插件来实现基本功能。

由于flutter_pushed_messaging不是一个真实存在的插件名称,我将使用flutter_local_notifications作为替代,因为它是一个广受欢迎且功能强大的本地通知插件。同时,为了处理远程推送(如云消息),通常会结合使用Firebase Cloud Messaging (FCM)。但这里我们将专注于本地通知。

步骤 1: 添加依赖

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

dependencies:
  flutter:
    sdk: flutter
  flutter_local_notifications: ^9.0.0 # 请检查最新版本号

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

步骤 2: 配置插件

在你的main.dart文件中,你需要初始化插件并配置Android和iOS的特定设置(如果需要)。

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

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

  var initializationSettingsAndroid = AndroidInitializationSettings('@mipmap/ic_launcher'); // 使用你的应用图标
  var initializationSettingsIOS = IOSInitializationSettings(
    requestAlertPermission: true,
    requestBadgePermission: true,
    requestSoundPermission: true,
  );
  var initializationSettings = InitializationSettings(
    android: initializationSettingsAndroid,
    iOS: initializationSettingsIOS,
  );

  flutterLocalNotificationsPlugin.initialize(initializationSettings,
      onSelectNotification: (String? payload) async {
    if (payload != null) {
      // 处理点击通知时的逻辑
      showDialog(
        context: navigatorKey.currentContext!,
        builder: (BuildContext context) => CupertinoAlertDialog(
          title: Text('Payload:'),
          content: Text(payload),
        ),
      );
    }
  });

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // ...
    );
  }
}

步骤 3: 发送本地通知

在你的应用中,你可以通过以下方式发送本地通知:

import 'package:flutter_local_notifications/flutter_local_notifications.dart';

void _showLocalNotification() async {
  var flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

  var androidPlatformChannelSpecifics = AndroidNotificationDetails(
    'your channel id',
    'your channel name',
    'your channel description',
    importance: Importance.max,
    priority: Priority.high,
  );
  var iOSPlatformChannelSpecifics = IOSNotificationDetails();

  var platformChannelSpecifics = NotificationDetails(
    android: androidPlatformChannelSpecifics,
    iOS: iOSPlatformChannelSpecifics,
  );

  await flutterLocalNotificationsPlugin.show(
    0, // 通知ID
    'Hello World', // 标题
    'This is a local notification', // 正文
    platformChannelSpecifics,
    payload: 'item x', // 可选的附加数据
  );
}

使用示例

你可以在一个按钮点击事件中调用_showLocalNotification函数来显示通知:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Local Notifications Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: _showLocalNotification,
            child: Text('Show Notification'),
          ),
        ),
      ),
    );
  }
}

以上代码展示了如何在Flutter应用中集成并使用本地通知插件。如果你需要实现远程推送(如通过FCM),则需要额外配置Firebase并处理从FCM接收到的消息。这通常涉及到在Firebase控制台中设置项目、在Android和iOS项目中配置Firebase SDK,并在Flutter应用中处理消息接收回调。

回到顶部