Flutter本地通知插件native_notify的使用

发布于 1周前 作者 sinazl 来自 Flutter

Flutter本地通知插件native_notify的使用

native_notify 是一个由 NativeNotify.com 为 Flutter 应用创建的推送通知包。通过 native_notify,你可以在 Flutter 应用中设置推送通知,并在不到 5 分钟的时间内发送推送通知给自己。

使用步骤

  1. 创建 NativeNotify 账户
    你需要在 NativeNotify.com 创建一个账户(免费注册,无需信用卡),然后点击“创建应用”,按照指示完成设置,以便在你的 Flutter 应用中使用 Native Notify 推送通知。

  2. 配置 Flutter 项目
    在你的 Flutter 项目中,添加 native_notify 依赖项,并根据你的应用 ID 和应用令牌进行初始化。

  3. 编写代码
    下面是一个完整的示例代码,展示了如何使用 native_notify 插件来实现本地通知功能。

完整示例 Demo

main.dart

import 'package:flutter/material.dart';
import 'package:native_notify/native_notify.dart';

void main() {
  // 确保 Flutter 引擎已经初始化
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化 native_notify,传入你的应用 ID 和应用令牌
  NativeNotify.initialize('your-app-id', 'your-app-token', null, null);
  
  // 启动应用
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  void initState() {
    super.initState();
    
    // 注册 iOS 设备(仅适用于 iOS)
    NativeNotify.registerIOSDevice();
  }

  int _counter = 0;

  void _incrementCounter() {
    // 注册独立 ID(可选)
    NativeNotify.registerIndieID('1');
    
    // 更新计数器
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

更多关于Flutter本地通知插件native_notify的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter本地通知插件native_notify的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何在Flutter项目中使用native_notify插件来实现本地通知的示例代码。这个插件允许你发送本地通知到用户的设备上。

首先,确保你已经在你的pubspec.yaml文件中添加了native_notify依赖:

dependencies:
  flutter:
    sdk: flutter
  native_notify: ^0.x.x  # 请替换为最新的版本号

然后,运行flutter pub get来安装依赖。

接下来,在你的Flutter项目的main.dart文件中,你可以按照以下步骤来配置和使用native_notify插件:

import 'package:flutter/material.dart';
import 'package:native_notify/native_notify.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Native Notify Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  NativeNotify? _nativeNotify;

  @override
  void initState() {
    super.initState();
    // 初始化NativeNotify实例
    _nativeNotify = NativeNotify();

    // 请求通知权限(Android上需要)
    _nativeNotify?.requestNotificationPermissions().then((permissionGranted) {
      if (permissionGranted) {
        print("Notification permission granted");
      } else {
        print("Notification permission denied");
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Native Notify Demo'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            _showNotification();
          },
          child: Text('Show Notification'),
        ),
      ),
    );
  }

  void _showNotification() {
    var androidPlatformChannelSpecifics = AndroidNotificationDetails(
      'your_channel_id',
      'Your Channel Name',
      'Your Channel Description',
      importance: Importance.max,
      priority: Priority.max,
      playSound: true,
      sound: RawResourceAndroidNotificationSound('your_sound_file'), // 可选,使用资源文件中的声音
    );

    var iOSPlatformChannelSpecifics = IOSNotificationDetails();

    var platformChannelSpecifics = NotificationDetails(
      android: androidPlatformChannelSpecifics,
      iOS: iOSPlatformChannelSpecifics,
    );

    _nativeNotify?.show(
      title: 'Hello',
      body: 'This is a local notification',
      payload: 'Your custom payload here',
      notificationDetails: platformChannelSpecifics,
    );
  }

  @override
  void dispose() {
    _nativeNotify?.dispose();
    super.dispose();
  }
}

注意事项:

  1. Android通道设置:在Android上,你需要创建一个通知通道。虽然上面的代码示例中包含了通道的细节,但在实际项目中,你需要在应用的启动逻辑中(例如MainActivityonCreate方法中)确保通道已被创建。native_notify插件可能不会为你自动创建这个通道,具体取决于插件的实现和版本。

  2. 声音文件:如果你在Android通知中使用了声音文件,请确保该声音文件已经放在res/raw目录下,并在AndroidManifest.xml中正确配置权限。

  3. 权限请求:在Android上,从Android 8.0(API级别26)开始,所有通知都必须分配到一个通知通道。同时,你需要请求通知权限。在iOS上,通知权限通常在系统设置中由用户授予。

  4. iOS配置:对于iOS,你需要在Xcode中进行一些配置,例如启用推送通知和背景模式。此外,iOS 10及以上版本要求使用UserNotifications框架来处理本地和远程通知。

  5. 插件版本:确保你使用的是最新版本的native_notify插件,因为插件的API可能会随着版本的更新而变化。

  6. 错误处理:在实际应用中,添加适当的错误处理逻辑来处理通知发送失败的情况。

这个示例代码展示了如何在Flutter中使用native_notify插件来发送本地通知。根据你的具体需求,你可能需要调整通知的详细信息和权限请求逻辑。

回到顶部