How to create dynamic persistent notification thingy

Ionic Framework ionic-v3
1

I think half the problem is I don’t even know what to call it. A good example is on MapMyWalk, when you are tracking a walk it has a section in the push-notifications area that is persistent, and tracks your time/distance regardless of whether the app is active or in the background, and will do so until you interact with it to pause or clear it.

Pics of what I’m talking about:

Screenshot_20180216-221303

Screenshot_20180216-221318
Screenshot_20180216-221318.jpg1080×1920 307 KB

Can anyone point me in the right direction please?

1 Like
2

This might be hard to do with browser-only programming. I don’t know how to do it, though other people here might have better ideas. But I’d suggest you research native plugins, including ones that aren’t compatible with Ionic, like React Native and NativeScript plugins.

3

I think these kind of notifications are very different in implementation depending on the operating system you are running. If this is the core feature of your app, maybe solving this with react native, nativescript or native development would be a better approach.

4

Well, it looks like this might be able to be achieved with the Local Notifications plugin - https://github.com/katzer/cordova-plugin-local-notifications

There is an ionic native wrapper for it, but it doesn’t include all of the functions of this plugin that would be required to have things update and control in-notification UI. So I’ll have the minor inconvenience of using the plugin the “old” way, but that’s fine. Better than not being possible at all or having to change approaches altogether.

1 Like
5

Hey, were you able to persist the notification using ionic’s local notification?

6

Yes I was using the plugin I listed above, but not using the native wrapper, I had to call the plugin API directly from the window var as the wrapper didn’t give access to all of the functionality.

7

Thanks for the reply. Can you please share your code? I’m trying to implement the same thing.

8

Sorry I can’t, mostly because I don’t know where it is, but I do know it’s possible using that plugin. Good luck!

9

I had the same issue and i used the local notification plugin.

Notification() {
    this.localNotifications.schedule({
      id: 22,
      title: 'App is Open',
      text: 'My Recurring Notification',
      sound: null,
      sticky: true,
      trigger: { every: ELocalNotificationTriggerUnit.SECOND }
    });
  }

Please take note of the sound option and the sticky option. By default there is sound and sticky is set to false. This will solve your issue.
Hope it is what you wanted. :wink:

1 Like