Ionic 2 : Local notification icon

For Local push notification of ionic 2 plugin you can set the icon like below. Here icon.png will be taking from the drawable folder in android. And you can configure ionic to copy the local image file to drawable folder by adding lines mentioned below in config file under android platform section.

<platform name="android">
<resource-file src="resources/android/icon/icon.png" target="res/drawable/icon.png"/>
</platform>
        

this.localNotifications.schedule({
          id: 1,
          title: data.title,
          text: data.body,
          data: data,
          icon: "res://icon.png",
          smallIcon:"res://icon.png"
        });

If your only problem is with the notifications icons appearing correctly on Android, the following worked for me - take the drawable-xhdpi-icon icon (size 96x96), rename it icon.png and place it in two places:

  • /src/assets/img
  • /platforms/android/res/drawable

The drawable folder is a new folder which can be created by copying platforms/android/res/mipmap-xhdpi to platforms/android/res/drawable manually or with the aid of a hook. In your code, the local or geofence notification is referenced as follows:

smallIcon: 'res://icon',
icon: 'file://assets/img/icon.png'

If ionic cordova resources is part of the problem, you can do your own one-time setup by taking your largest icon and, with the help of a resizing tool such as resizeimage.net, create a set of icons for iOS and Android. The Excel here https://github.com/dovk/howto_resources-folder has a list of the sizes and names of the .png files to create. You then place them in their respective resources folder just like ionic cordova resources would have done - for example in resources/android/icon, resources/ios/splash and so on. If you do so, then ionic cordova platform add android or ionic cordova platform add ios should not be used anymore, as this also does ionic cordova resources - What you need to do is cordova platform add (without the ionic in the beginning).


I found a solution :

I create a new folder named "drawable" in /platforms/android/res/ I put my image in my new folder with name "ic_notifications.png" and "ic_notifications_small.png".

In my code I wrote

cordova.plugins.notification.local.schedule({
      id: 2,
      title: "Notification",
      message: "Retour à l'application",
      sound: null,
      at: new Date(new Date().getTime() + 5 * 1000),
      icon: 'ic_notifications',
      smallIcon: 'ic_notification_small'
    });

And it works !