如何在iOS中使用flutter_local_notifications实现大图通知

核心要点 #

• iOS的通知附件必须使用本地文件路径，无法直接加载网络图片，所以需要先将网络图片下载到应用沙盒的可访问目录（比如tmp或Documents）。
• IOSNotificationAttachment的路径必须是文件的绝对路径，不能用相对路径或网络URL。

修改后的完整代码 #

import 'dart:io';
import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:path_provider/path_provider.dart';
import 'package:flutter_local_notifications/flutter_local_notifications.dart';

Future<NotificationDetails> _notificationDetails({String? url}) async {
  // Android部分逻辑保持不变
  AndroidNotificationDetails androidNotificationDetails = const AndroidNotificationDetails(
    'channel_id',
    'channel_name',
    icon: '@drawable/ic_launcher',
    channelDescription: 'description',
    importance: Importance.max,
    priority: Priority.max,
    playSound: true,
    color: Color(0x00000010),
    enableVibration: false,
  );

  if (url != null) {
    http.Response response = await http.get(Uri.parse(url));
    if (response.statusCode == 200) {
      final image = response.bodyBytes;
      BigPictureStyleInformation androidImage = BigPictureStyleInformation(
        ByteArrayAndroidBitmap.fromBase64String(base64Encode(image)),
        largeIcon: ByteArrayAndroidBitmap.fromBase64String(base64Encode(image)),
      );
      androidNotificationDetails = AndroidNotificationDetails(
        'channel_id',
        'channel_name',
        icon: '@drawable/ic_launcher',
        channelDescription: 'description',
        importance: Importance.max,
        priority: Priority.max,
        styleInformation: androidImage,
        playSound: true,
        sound: null,
      );
    }
  }

  // iOS部分：处理图片下载和附件创建
  IOSNotificationDetails? iosNotificationDetails;
  if (url != null) {
    http.Response response = await http.get(Uri.parse(url));
    if (response.statusCode == 200) {
      // 获取应用临时目录
      final directory = await getTemporaryDirectory();
      // 创建图片文件
      final filePath = '${directory.path}/notification_image.jpg';
      final file = File(filePath);
      await file.writeAsBytes(response.bodyBytes);

      // 创建iOS通知附件
      final attachment = IOSNotificationAttachment(filePath);
      iosNotificationDetails = IOSNotificationDetails(
        badgeNumber: 10,
        presentBadge: true,
        presentAlert: true,
        attachments: [attachment],
      );
    } else {
      // 图片下载失败时的默认iOS配置
      iosNotificationDetails = const IOSNotificationDetails(
        badgeNumber: 10,
        presentBadge: true,
        presentAlert: true,
      );
    }
  } else {
    // 无图片URL时的默认iOS配置
    iosNotificationDetails = const IOSNotificationDetails(
      badgeNumber: 10,
      presentBadge: true,
      presentAlert: true,
    );
  }

  return NotificationDetails(
    android: androidNotificationDetails,
    iOS: iosNotificationDetails,
  );
}

关键说明 #

• 使用path_provider包获取应用的临时目录（getTemporaryDirectory()），这个目录下的文件iOS通知框架可以访问。
• 将网络图片写入本地文件后，用文件的绝对路径创建IOSNotificationAttachment。
• 要确保添加path_provider依赖到pubspec.yaml：

  dependencies:
    path_provider: ^2.1.1
  

• 注意：iOS 10及以上才支持通知附件功能，确保你的部署目标版本不低于iOS 10。

内容的提问来源于stack exchange，提问作者Soun Savdan