flutter中添加地图_在Flutter应用程序中添加计划的通知

flutter中添加地图

介绍(Introduction)

I have been working on a Flutter application for the past few weeks. One of the features required me to implement scheduled notifications. After poring over several articles here and there, I concluded that the best way to go would be to use the flutter_local_notifications package available on pub.dev. No matter where I read, I didn’t quite find what I was looking for. The examples everywhere revolved around creating a dedicated Reminders app or were picked up straight from the package’s documentation. As a self-taught Flutter developer, I found resources rather inadequate at explaining what I was supposed to add and where it was to be added. I have taken the liberty to put together a little guide to implement this use-case for budding, self-taught app developers like myself without having a tough time.

在过去的几周里，我一直在研究Flutter应用程序。 其中一项功能要求我实施计划的通知。 这里研读了几篇文章和那里以后，我的结论是，最好的方式是使用flutter_local_notifications封装上pub.dev 。 不管我在哪里读书，都没有找到想要的东西。 到处都是围绕创建一个专用的提醒应用程序的示例，或者直接从软件包的文档中获取这些示例。 作为一个自学成才的Flutter开发人员，我发现资源不足以解释我应该添加的内容以及要添加的位置。 我可以自由地整理一些指南，以便像我这样崭露头角的自学成才的应用程序开发人员可以轻松地实现此用例。

第0部分：添加依赖项 (Part 0: Adding dependencies)

The foremost step is to add the required packages to your pubspec.yaml file under dependencies

最重要的步骤是将所需的软件包添加到您的pubspec.yaml中 依赖项下的文件

dependencies:
  flutter_local_notifications: ^1.4.2
  rxdart: ^0.23.1

Once you have done this, run the following command on your terminal within your project folder to get the dependencies.

完成此操作后，在终端上的项目文件夹中运行以下命令以获取依赖项。

$ flutter pub get

Now that you’ve got these initial steps out of the way, it’s time to get down to business.

现在您已经完成了最初的步骤，现在该开始做生意了。

第1部分：样板内容 (Part 1: The boilerplate stuff)

A)修改AndroidManifest.xml文件(A) Modifying the AndroidManifest.xml file)

Now it’s time to add some permissions for the android version of the app. Head over to /android/app/src/main/ and add these lines if they aren’t already there

现在是时候为该应用的android版本添加一些权限了。 转到/ android / app / src / main /，然后添加这些行(如果还没有的话)

<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.WAKE_LOCK" />

To ensure that previously scheduled notifications still work upon rebooting the device, add the following lines within the application tag, just after the activity tag closes

为确保先前计划的通知在重新启动设备后仍然有效，请在活动标签关闭后，在应用程序标签中添加以下几行

<receiver android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationReceiver" />
<receiver android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationBootReceiver">
    <intent-filter>
        <action android:name="android.intent.action.BOOT_COMPLETED"></action>
    </intent-filter>
</receiver>

B)确保资产到位 (B) Ensuring the assets are in place)

Make sure you have added your app icon within the drawable folder (/android/app/src/main/res/drawable/). For this article, I have named my app icon “icon”. Be sure to make the necessary changes within your app.

确保您已在drawable文件夹(/ android / app / src / main / res / drawable / )中添加了应用程序图标。 对于本文，我将我的应用程序图标命名为“ icon” 。 请确保在您的应用中进行必要的更改。

C)修改AppDelegate.swift文件 (C) Modifying the AppDelegate.swift file)

A delegate must be registered for this to work on the iOS version. Make the following changes in the AppDelegate.swift file found in /ios/Runner/

必须注册代表才能在iOS版本上工作。 在/ ios / Runner /中找到的AppDelegate.swift文件中进行以下更改

Add

加

if #available(iOS 10.0, *) {
UNUserNotificationCenter.current().delegate = self as ? UNUserNotificationCenterDelegate    
}

just before

就在之前

return super.application(application, didFinishLaunchingWithOptions: launchOptions)

第2部分：创建通知助手 (Part 2: Creating a Notifications Helper)

I like having my code organised so that it is easier to make changes and follow whenever I need to revisit it. The project I am working on has a ton of dart files within my lib folder. Thus, keeping the notifications-related code consolidated in one dart file made a lot of sense.

我喜欢组织代码，以便在需要重新访问时更容易进行更改和遵循。 我正在处理的项目在我的lib文件夹中有很多dart文件。 因此，将与通知相关的代码合并在一个dart文件中非常有意义。

A)导入库 (A) Importing the libraries)

Create a notifications_helper.dart file and import the flutter_local_notifications and rxdart packages.

创建一个notifications_helper.dart文件，并导入flutter_local_notifications和rxdart包。

import 'package:flutter_local_notifications/flutter_local_notifications.dart'as notifs;
import 'package:rxdart/subjects.dart' as rxSub;

Note: I have added the “as notifs” and “as rxSub” so that it is easier to understand the following parts of code.

注意：我添加了“ as notifs”和“ as rxSub”，以便于理解以下代码部分。

B)初始化 (B) Initialisation)

Then create a class which defines the structure of your notification. I used the following

然后创建一个定义通知结构的类。 我用了以下

class NotificationClass{
  final int id;
  final String title;
  final String body;
  final String payload;NotificationClass({this.id, this.body, this.payload, this.title});
}

Next, we initialise two variables required for the Notification Stream

接下来，我们初始化通知流所需的两个变量

final rxSub.BehaviorSubject<NotificationClass> didReceiveLocalNotificationSubject =
    rxSub.BehaviorSubject<NotificationClass>();
final rxSub.BehaviorSubject<String> selectNotificationSubject =
    rxSub.BehaviorSubject<String>();

Now it’s time to initialise notifications. Add the following method to your helper file

现在该初始化通知了。 将以下方法添加到您的帮助文件中

Future<void> initNotifications(
    notifs.FlutterLocalNotificationsPlugin
        notifsPlugin) async {
  var initializationSettingsAndroid =
      notifs.AndroidInitializationSettings('icon');
  var initializationSettingsIOS = notifs.IOSInitializationSettings(
      requestAlertPermission: false,
      requestBadgePermission: false,
      requestSoundPermission: false,
      onDidReceiveLocalNotification:
          (int id, String title, String body, String payload) async {
        didReceiveLocalNotificationSubject
            .add(NotificationClass(id: id, title: title, body: body, payload: payload));
      });
  var initializationSettings = notifs.InitializationSettings(
      initializationSettingsAndroid, initializationSettingsIOS);
  await notifsPlugin.initialize(initializationSettings,
      onSelectNotification: (String payload) async {
    if (payload != null) {
      print('notification payload: ' + payload);
    }
    selectNotificationSubject.add(payload);
  });
  print("Notifications initialised successfully");
}

This method is to be run in the main method within the main.dart file (i.e. when the app is run). It basically sets permissions et cetera for the Android and iOS versions

该方法将在main.dart文件内的main方法中运行(即，运行应用程序时)。 它基本上为Android和iOS版本设置了权限等

C)为iOS创建权限请求方法(C) Creating a permission request method for iOS)

As the header suggests, This is a generic permission request method to ensure iOS users receive the notifications scheduled.

如标题所示，这是确保iOS用户收到计划的通知的通用权限请求方法。

void requestIOSPermissions(
    notifs.FlutterLocalNotificationsPlugin notifsPlugin) {
  notifsPlugin.resolvePlatformSpecificImplementation<notifs.IOSFlutterLocalNotificationsPlugin>()
      ?.requestPermissions(
        alert: true,
        badge: true,
        sound: true,
      );
}

D)创建计划的通知 (D) Creating the scheduled notification)

We need to create a method that dictates the behaviour and specifics for a scheduled notification in Android as well as iOS. Add the following method in the helper file

我们需要创建一种方法来指示Android和iOS中计划通知的行为和详细信息。 在帮助文件中添加以下方法

Future<void> scheduleNotification(
    {notifs.FlutterLocalNotificationsPlugin notifsPlugin,
    String id,
    String title,
    String body,
    DateTime scheduledTime}) async {
  var androidSpecifics = notifs.AndroidNotificationDetails(
    id, // This specifies the ID of the Notification
    'Scheduled notification', // This specifies the name of the notification channel
    'A scheduled notification', //This specifies the description of the channel
    icon: 'icon',
  );
  var iOSSpecifics = notifs.IOSNotificationDetails();
  var platformChannelSpecifics = notifs.NotificationDetails(
      androidSpecifics, iOSSpecifics);
  await notifsPlugin.schedule(0, title, "Scheduled notification",
      scheduledTime, platformChannelSpecifics); // This literally schedules the notification
}

There are many options available within the platform-specific notification details (AndroidNotificationDetails and IOSNotificationDetails). These allow you to customise the look of the notification. I haven’t explored all of them here; for the sake of brevity. Going through the documentation or just inspecting the definition of the methods will let you add a whole bunch of tweaks.

在特定于平台的通知详细信息中有很多选项( AndroidNotificationDetails和IOSNotificationDetails )。 这些使您可以自定义通知的外观。 我还没有在这里探索所有的东西。 为了简洁起见。 浏览文档或仅检查方法的定义将使您增加一堆调整。

第3部分：修改main.dart文件 (Part 3: Modifying the main.dart file)

Now it’s time to get down to the real stuff. First, we must create instances of NotificationAppLaunchDetails and FlutterLocalNotificationsPlugin.

现在是时候深入了解真正的东西了。 首先，我们必须创建NotificationAppLaunchDetails和FlutterLocalNotificationsPlugin的实例。

NotificationAppLaunchDetails notifLaunch;
final FlutterLocalNotificationsPlugin notifsPlugin=    FlutterLocalNotificationsPlugin();

Now within the main method, add

现在在main方法中，添加

notifLaunch = await notifsPlugin.getNotificationAppLaunchDetails();
await initNotifications(notifsPlugin);
requestIOSPermissions(notifsPlugin);

These statements initialise everything when the app runs, and in case of iOS, requests the necessary permissions

这些语句会在应用运行时初始化所有内容，如果是iOS，则会请求必要的权限

第4部分：触发计划的通知(Part 4: Triggering a scheduled Notification)

This is the part where you add the method to the desired dart file where you want the notification to be scheduled. I implemented it within an onPressed method.

这是将方法添加到想要安排通知的所需dart文件中的部分。 我在onPressed方法中实现了它。

A)导入您的帮助文件和main.dart (A) Import your helper file and main.dart)

import '../helpers/notifications_helper.dart';
import '../main.dart';

B)调用scheduleNotification方法 (B) Call the scheduleNotification method)

scheduleNotification(
    notifsPlugin: notifsPlugin, //Or whatever you've named it in main.dart
    id: DateTime.now().toString(),
    body: "A scheduled Notification",
    scheduledTime: DateTime.now()); //Or whenever you actually want to trigger it

You could go a step further and define a duration starting from now after which you’d like the notification to be triggered.

您可以更进一步，并定义一个从现在开始的持续时间，之后您希望触发该通知。

结论 (Conclusion)

I hope you find this useful for whenever you need to implement scheduled notifications within your app.

我希望这对您需要在应用程序中实现计划的通知时有用。

DISCLAIMER: I do not currently possess the tools to test the iOS implementation of this and hence cannot guarantee how well it works. I shall update the article upon testing it on iOS. That being said, all bases have been covered. There shouldn’t be any problem on the iOS version in theory.

免责声明：我目前不具备测试此实现的iOS实现的工具，因此无法保证其运行良好。 在iOS上对其进行测试后，我将对其进行更新。 话虽如此，所有基地都已覆盖。 从理论上讲，iOS版本应该没有任何问题。

翻译自: https://medium.com/@fuzzymemory/adding-scheduled-notifications-in-your-flutter-application-19be1f82ade8

flutter中添加地图