flutter_local_notifications 插件未在通知中显示大图像

Question

我需要发出这样的通知

我的输出代码

我的 Pubspec.yaml 文件。我正在使用最新版本的 flutter_local_notifications

  flutter_local_notifications: ^9.2.0

这是我的通知控制器代码

import 'dart:io';
import 'dart:typed_data';
import 'package:flutter/services.dart';
import 'package:http/http.dart' as http;
import 'package:flutter_local_notifications/flutter_local_notifications.dart';
import 'package:image/image.dart' as image;
import 'package:path_provider/path_provider.dart';

class NotificationService {
  static final NotificationService _notificationService =
      NotificationService._internal();

  final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
      FlutterLocalNotificationsPlugin();

  factory NotificationService() {
    return _notificationService;
  }

  NotificationService._internal();
  Future<void> init(
      Function(int, String?, String?, String?)?
          onDidReceiveLocalNotification) async {
    const AndroidInitializationSettings initializationSettingsAndroid =
        AndroidInitializationSettings('@mipmap/launcher_icon');

    final IOSInitializationSettings initializationSettingsIOS =
        IOSInitializationSettings(
      requestAlertPermission: false,
      requestBadgePermission: false,
      requestSoundPermission: false,
      onDidReceiveLocalNotification:
          (int id, String? title, String? body, String? payload) async {},
    );
    final InitializationSettings initializationSettings =
        InitializationSettings(
      android: initializationSettingsAndroid,
      iOS: initializationSettingsIOS,
    );
    await flutterLocalNotificationsPlugin.initialize(
      initializationSettings,
      onSelectNotification: (String? payload) async {
        if (payload != null) {
          print('notification payload: $payload');
        }
      },
    );
  }

  Future selectNotification(String? payload) async {
    print('selectNotification: $payload');
  }

  Future<String> _downloadAndSaveFile(String url, String fileName) async {
    final Directory? directory = await getExternalStorageDirectory();
    final String filePath = '${directory!.path}/$fileName.png';
    final http.Response response = await http.get(Uri.parse(url));
    final File file = File(filePath);
    await file.writeAsBytes(response.bodyBytes);
    return filePath;
  }

  Future showNotify({
    required String body,
    required String image,
  }) async {
    final String largeIconPath = await _downloadAndSaveFile(
      'https://via.placeholder.com/48x48',
      'largeIcon',
    );
    final String bigPicturePath = await _downloadAndSaveFile(
      image,
      'bigPicture',
    );

    await flutterLocalNotificationsPlugin.show(
      123,
      'New Buisness Sutra Updated',
      body,
      NotificationDetails(
        android: AndroidNotificationDetails(
          'big text channel id',
          'big text channel name',
          ongoing: true,
          priority: Priority.max,
          largeIcon: FilePathAndroidBitmap(largeIconPath),
          channelDescription: 'big text channel description',
          styleInformation: BigPictureStyleInformation(
            FilePathAndroidBitmap(bigPicturePath),
            hideExpandedLargeIcon: false,
            contentTitle: 'overridden <b>big</b> content title',
            htmlFormatContentTitle: true,
            summaryText: 'summary <i>text</i>',
            htmlFormatSummaryText: true,
          ),
        ),
      ),
      payload: 'data',
    );
  }
}

我在 main.dart 文件上初始化了 firebase 和通知

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  if (!kIsWeb) {
    await Firebase.initializeApp();
    firebaseCloudMessagingListeners();
    await NotificationService().init();
  }
  runApp(const MyApp());
}

firebaseCloudMessagingListeners() {
  FirebaseMessaging.onBackgroundMessage(_messageHandler);
  FirebaseMessaging.onMessage.listen((RemoteMessage message) {
    print(message);
    _messageHandler(message);
  });
  FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage message) {
    print("Message opened");
  });
}

Future<void> _messageHandler(RemoteMessage message) async {
  Map<String, dynamic> data = message.data;
  print(data);
  await NotificationService().showNotify(
    body: data["body"],
    image: data["image"],
  );
}

firebase_messaging 插件工作正常。问题在于来自 flutter_local_notifications 的通知的整体情况。我使用 path_provider 和 http 下载图像。此图像也成功下载到我的应用程序外部存储目录中。但通知上没有显示

/storage/emulated/0/Android/data/in.myapp.dhrona/files/largeIcon.png /storage/emulated/0/Android/data/in.myapp.dhrona/files/bigIcon.png

此问题的任何解决方案

Answer 1

虽然@Vignesh 的答案有效，但以下是对该答案的一些改进：

• 示例中未使用响应
• 无需将“largeIcon”属性设置为与大图像相同的图像数据，因为当通知展开时，它会在通知中显示相同的图像两次。

最终的答案应该是这样的：

final http.Response response = await http.get(Uri.parse(imageUrl));
        bigPictureStyleInformation = BigPictureStyleInformation(
            ByteArrayAndroidBitmap.fromBase64String(base64Encode(response.bodyBytes)));

      flutterLocalNotificationsPlugin.show(
          notification.hashCode,
          notification.title ?? 'APP_NAME',
          notification.body,
          NotificationDetails(
            android: AndroidNotificationDetails(
              channel.id,
              channel.name,
              channelDescription: channel.description,
              styleInformation: bigPictureStyleInformation,
              // other properties...
            ),
          )
      );

Answer 2

为了显示网络图像，

    final http.Response response = await http.get(Uri.parse(URL));
    BigPictureStyleInformation bigPictureStyleInformation =
        BigPictureStyleInformation(
      ByteArrayAndroidBitmap.fromBase64String(base64Encode(image)),
      largeIcon: ByteArrayAndroidBitmap.fromBase64String(base64Encode(image)),
    );
    flutterLocalNotificationsPlugin.show(
      Random().nextInt(1000),
      title,
      description,
      NotificationDetails(
        android: AndroidNotificationDetails(channel.id, channel.name,
            channelDescription: channel.description,
            importance: Importance.high,
            styleInformation: bigPictureStyleInformation),
      ),
    );

要显示本地图像，

    final String filePath = '${directory.path}/$fileName';
    final BigPictureStyleInformation bigPictureStyleInformation =
        BigPictureStyleInformation(FilePathAndroidBitmap(filePath),
            largeIcon: FilePathAndroidBitmap(filePath));
    flutterLocalNotificationsPlugin.show(
      Random().nextInt(1000),
      title,
      description,
      NotificationDetails(
        android: AndroidNotificationDetails(channel.id, channel.name,
            channelDescription: channel.description,
            importance: Importance.high,
            styleInformation: bigPictureStyleInformation),
      ),
    );