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,
          ),
        ],
      ),
    );
  }
相关推荐
傅里叶2 小时前
Flutter开发的app,实现Google 登录
前端·flutter
chenzhen_09073 小时前
flutter布局规则
flutter
tangweiguo030519877 小时前
Flutter 中打开网络图片的完整指南
flutter
西西学代码7 小时前
Flutter---BLE设备通信
flutter
程序员Ctrl喵8 小时前
状态管理与响应式编程 —— 驾驭复杂应用的“灵魂工程”
开发语言·flutter·ui·架构
始持8 小时前
第十五讲 本地存储
前端·flutter
始持9 小时前
第十四讲 网络请求与数据解析
前端·flutter
啥都想学点9 小时前
第14天:Flutter 打造质感拉满的轮播图
flutter
tangweiguo0305198710 小时前
Flutter 深潜:当动态 List 遇上 JSON 序列化,如何优雅解决?
flutter
恋猫de小郭10 小时前
Flutter 的 build_runner 已经今非昔比,看看 build_runner 2.13 有什么特别?
android·前端·flutter