Custom notification image

Ionic Native
1

I am pushing a notification message from the server, and using the push plugin for notification.

My question is how can I have a customized icon in the notification area in android.

So far there is no correct solution anywhere in the forum.

Please help me

2

Have you tried like described in the documentation?

3

I had gone through the tutorial but I don’t have any idea on writing a hook. Can you please help me on that for ionic 3?

It will be of great help.

4

Well that’s documeted too:

http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/

https://cordova.apache.org/docs/fr/latest/guide/appdev/hooks/

and googling “write cordova hook copy android icon” give following result https://gist.github.com/dpogue/a382e9f048b09d490d4e

have a try and sure let me know if something doesn’t work

5

Is pasting the files in the appropriate folder is ok?

Or do I need to write a particular js file and execute it?

6

That’s the goal described in the README. If you do it manually or automatically there is no difference. What’s matter is pasting your icon/img in the appropriate platform folder

You need a hook to automate the process in order to do not have to copy manually your icon/images each time you remove/add your platform

I suggest to first have a try by copying your file manually and then if all good write a hook

7

So if don’t write a hook, then all I need to do is copy the folder that contains the image file into some location right?

Can you please tell me where?

Because as in the tutorial you gave me (thank you very much for that)

I created a drawable folder in the res folder and pasted a image in it. but it wasn’t shown in the notification bar.

8

According the README

Where icon is the name of an .png image file in the Android res/drawable folder.

See https://github.com/phonegap/phonegap-plugin-push/blob/master/docs/PAYLOAD.md#images

So on cordova-android < 7 probably platforms/android/res/drawable/

On cordova-android >= 7 probably something like platforms/android/app/src/main/res/drawable/

9

I created a folder named drawable in the platforms/android/res/ folder and created a transparent 24x24 png image named it note.

Now in the code for notification i did something like below;


const pushObj: PushObject = this.push.init({
						android: {
							senderID: "my_id",
							sound: "true",
							icon: "note",
							forceShow: "true",
						},
						ios: {
							alert: "true",
							badge: "true",
							sound: "true"
						}
					});

Is that it?

Or do I need to do something in the server side as well?

Thank you very much for your great help by the way.

10

Like described in the documentation, just dropping the icon in the right android platform folder should display the icon correctly. Have you build your app and try?

About your this.push.init(... if your icon name is note.png well yes I guess icon: "note" ist correct

What do you mean? Are you speaking of push notification generaly or just the icon? For the icon itself, nothing to do on your server side

11

Thanks a loads @reedrichards, it worked. Thanks a lot for all your valuable time.

12

Also, the default notification sound is also the one I am concerned with.

Right now I am looking to play a custom notification tone on notification receival.

How can I achieve that?

Thank you a loads

13

Youhou cool to hear it worked and you were able to display a custom icon.

No idea about custom sound.

I suggest to mark this question as solved and open a new one about sound.

14

Ok great.

But thanks a lot by the way, you are awesome

1 Like
15

My pleasure, glad I could help a bit.
Have fun coding :wink:

1 Like
16

Hi @reedrichards,

Just one more thought.

How can I remove the notification title that comes along with the notification?

Currently it is shownign me my app’s name along side it.

I just only needs the notification message

17

I’m not sure about that, it should normally display the text you provide in the payload you sent from your server. Maybe check these, maybe you send msg/payload without content?