Flutter---Notification(1.基础通知)

效果图

关键问题

1.为什么IOS使用默认配置

Dart 复制代码
1.iOS系统的通知行为相对Android更加统一和标准化
2. iOS开发规范限,苹果对通知有更严格的审核要求

实现步骤

1.下载插件

Dart 复制代码
  flutter_local_notifications: ^19.5.0

2.引入插件

Dart 复制代码
import 'package:flutter_local_notifications/flutter_local_notifications.dart';

3.初始化通知插件和定义一个通知ID计数器

Dart 复制代码
  late FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();
  int _notificationId = 0;

4.构建一个通用的通知按钮组件

Dart 复制代码
 //===============================构建通知按钮====================================
  Widget _buildNotificationButton(
      String text,
      IconData icon,
      VoidCallback onPressed, {
        required Color color,
      }) {
    return ElevatedButton.icon(
      icon: Icon(icon, size: 24),
      label: Padding(
        padding: const EdgeInsets.symmetric(vertical: 16),
        child: Text(
          text,
          style: const TextStyle(fontSize: 16),
        ),
      ),
      onPressed: onPressed,
      style: ElevatedButton.styleFrom(
        backgroundColor: color,
        foregroundColor: Colors.white,
        elevation: 3,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(12),
        ),
      ),
    );
  }

5.构建基础通知*****

Dart 复制代码
  Future<void> _showBasicNotification() async {

    _notificationId++; //递增通知的ID:每个通知需要一个唯一ID

    const AndroidNotificationDetails androidDetails =
    AndroidNotificationDetails(
      'normal_channel', //通道ID
      '普通通知', //通道名称
      importance: Importance.high, //重要性级别:max:浮动通知(直接弹出来);high:通知会出现在通知栏,但是不会弹出来。
      priority: Priority.high, //优先级
    );

    const NotificationDetails details = NotificationDetails(
      android: androidDetails, //安卓配置
      iOS: DarwinNotificationDetails(), //IOS配置:使用默认
    );

    await flutterLocalNotificationsPlugin.show(
      _notificationId, //通知ID
      '基础通知', //通知标题
      '这是一个简单的通知示例', //通知内容
      details, //通知详细配置
      payload: 'basic_notification', //自定义数据
    );
  }

6.设计UI页面

Dart 复制代码
 @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        padding: const EdgeInsets.all(20),
        children: [
          // 基础通知
          _buildNotificationButton(
            '基础通知',
            Icons.notifications,
            _showBasicNotification,
            color: Colors.blue,
          ),
        ],
      ),
    );
  }
相关推荐
iFlyCai4 小时前
Flutter三棵树核心详解之Widget树完全解析(一)
flutter
GitLqr9 小时前
Flutter 实战:如何轻松实现图片与视频保存到手机相册
flutter·全栈·dart
大龄秃头程序员9 小时前
【小记】第一次全栈踩坑 WebSocket 404
flutter
大龄秃头程序员14 小时前
Dart/Flutter StatefulWidget 生命周期 + ChangeNotifier Listener 泄漏的经典坑。
flutter
大龄秃头程序员16 小时前
Flutter踩坑记-WebSocket 通知挤占事件循环
flutter
恋猫de小郭19 小时前
Gradle 9.7.0 将提速 Android 构建,Sync 提升接近一倍
android·前端·flutter
iFlyCai19 小时前
Flutter三棵树核心详解之Widget树完全解析(二)
flutter·statelesswidget
GitLqr1 天前
Flutter 实战:使用 local_auth 实现生物识别(指纹/Face ID)
安全·flutter·全栈
大龄秃头程序员1 天前
【Flutter 性能踩坑小记】相册选个图卡了
flutter
ljt27249606612 天前
Flutter笔记--get_it&injectable
flutter