面试题：Flutter 中如何设置 iOS 和 Android 通知的基础样式差异

Question

在 Flutter 项目里，分别阐述如何针对 iOS 和 Android 设置通知的标题样式、内容样式等基础显示样式的不同，需要给出关键代码示例。

Answer 1

iOS

1. 配置 Info.plist：在 ios/Runner/Info.plist 中添加以下配置，用于设置通知的样式。

<key>UNUserNotificationCenter</key>
<dict>
    <key>NSNotificationDefaultUserNotificationSettings</key>
    <dict>
        <key>types</key>
        <integer>7</integer>
        <key>categories</key>
        <array>
            <dict>
                <key>NSUserNotificationCategoryIdentifier</key>
                <string>com.example.category</string>
                <key>NSUserNotificationActionButtons</key>
                <array>
                    <dict>
                        <key>NSUserNotificationActionIdentifier</key>
                        <string>com.example.action1</string>
                        <key>NSUserNotificationButtonTitle</key>
                        <string>Action 1</string>
                    </dict>
                </array>
            </dict>
        </array>
    </dict>
</dict>

2. 使用 flutter_local_notifications 库设置样式：

import 'package:flutter_local_notifications/flutter_local_notifications.dart';

final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

Future<void> _configureLocalTimeZone() async {
  tz.initializeTimeZones();
  final String timeZoneName = await tz.getLocalTimezone();
  tz.setLocalLocation(tz.getLocation(timeZoneName));
}

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await _configureLocalTimeZone();

  const AndroidInitializationSettings initializationSettingsAndroid =
      AndroidInitializationSettings('app_icon');
  const DarwinInitializationSettings initializationSettingsDarwin =
      DarwinInitializationSettings(
    requestAlertPermission: true,
    requestBadgePermission: true,
    requestSoundPermission: true,
  );
  const InitializationSettings initializationSettings = InitializationSettings(
    android: initializationSettingsAndroid,
    iOS: initializationSettingsDarwin,
  );
  await flutterLocalNotificationsPlugin.initialize(initializationSettings,
      onDidReceiveNotificationResponse: (NotificationResponse details) async {
    // 处理通知响应
  });

  const AndroidNotificationDetails androidPlatformChannelSpecifics =
      AndroidNotificationDetails(
    'your channel id',
    'your channel name',
    channelDescription: 'your channel description',
    importance: Importance.max,
    priority: Priority.high,
  );
  const DarwinNotificationDetails iOSPlatformChannelSpecifics =
      DarwinNotificationDetails(
    presentAlert: true,
    presentBadge: true,
    presentSound: true,
  );
  const NotificationDetails platformChannelSpecifics = NotificationDetails(
    android: androidPlatformChannelSpecifics,
    iOS: iOSPlatformChannelSpecifics,
  );

  await flutterLocalNotificationsPlugin.show(
    0,
    '标题',
    '内容',
    platformChannelSpecifics,
    payload: 'item x',
  );
}

Android

1. 设置通知渠道：在 Android 8.0（API 26）及以上，需要设置通知渠道。

import 'package:flutter_local_notifications/flutter_local_notifications.dart';

final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  const AndroidInitializationSettings initializationSettingsAndroid =
      AndroidInitializationSettings('app_icon');
  const InitializationSettings initializationSettings = InitializationSettings(
    android: initializationSettingsAndroid,
  );
  await flutterLocalNotificationsPlugin.initialize(initializationSettings,
      onDidReceiveNotificationResponse: (NotificationResponse details) async {
    // 处理通知响应
  });

  const AndroidNotificationDetails androidPlatformChannelSpecifics =
      AndroidNotificationDetails(
    'your channel id',
    'your channel name',
    channelDescription: 'your channel description',
    importance: Importance.max,
    priority: Priority.high,
    styleInformation: BigTextStyleInformation('大文本样式内容'), // 设置内容样式
  );
  const NotificationDetails platformChannelSpecifics = NotificationDetails(
    android: androidPlatformChannelSpecifics,
  );

  await flutterLocalNotificationsPlugin.show(
    0,
    '标题',
    '内容',
    platformChannelSpecifics,
    payload: 'item x',
  );
}

在上述代码中，iOS 通过 DarwinNotificationDetails 类设置相关样式，Android 通过 AndroidNotificationDetails 类设置样式，特别是在 Android 上通过 styleInformation 可以设置不同的内容样式，如 BigTextStyleInformation 用于大文本样式。