Notification icon problem

[tommy1296]

Hi, in the documentation is not clear how to change the notification icon in android. In the Notification Bar I would like to see a different icon than the one in the application. Can anyone explain the procedure to do this in detail?
Thank you.

[tommy1296]

Ok but in my ionic application I have to configure something?

[pablozandona]

• First you need generate your icons here;
• Next you should add the icons generated files in /plataforms/android/res folder;
• After you should add in your /plataforms/android/AndroidManifest.xml this:

<meta-data
android:name="com.google.firebase.messaging.default_notification_icon"
android:resource="@drawable/notification_icon" />

*where notification_icon is the filename of your icon.

[hkhamm]

@pablozandona Can I also set the notification icon color from my AndroidManifest.xml?

[jskidd3]

@pablozandona I followed your instructions to a tee and it did not work for me

[pablozandona]

@hkhamm

• Create platforms/android/res/values/styles.xml file with your color like this:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="red">#FF8614</color>
</resources>

• After you should add in your /plataforms/android/AndroidManifest.xml another meta-data:

<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/red"/>

[pablozandona]

@jskidd3 what exactly didn't work?

[jskidd3]

@pablozandona The icon stayed the same. It was a solid grey/white version of the app icon. I eventually managed to get it working by following the instructions found here with cordova-custom-config: #53 (comment)

I wish I knew why that fixed it though!

[danemco]

Don't know if this will help someone in the future or not, but in the instructions above, when it says to replace the notification_icon with the filename of your icon, you need to omit the .png ending in the AndroidManifest.xml file.

[gecko-8]

In case it helps anyone in the future, the meta-data tag goes within the application tag in the AndroidManifest.xml file. Like:

<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1091" android:versionName="1.0.9.1" package="..." xmlns:android="http://schemas.android.com/apk/res/android">
    ...
    <application android:hardwareAccelerated="true" android:icon="@mipmap/icon" android:label="@string/app_name" android:supportsRtl="true">
        ...
        <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
    </application>
    ...
</manifest>

[lexyfeito]

does the icon needs to be in @drawable or could it be in @Mipmap. @gecko-8 . Thanks

[gecko-8]

@lexyfeito Sorry, not an expert on Android development but @drawable is the usual place for images.

[lexyfeito]

hi @gecko-8, this solution doesnt work for me, i even type the tag manually in manifest and nothing. I dont know what i could be missing

[lexyfeito]

i also notice in this repo that icons are weir (for a lack of a better term). Are the icons supposed to be on some kind of special format?

[gecko-8]

Nope, just a 48x48 png. The alpha channel in the image provides the icon shape.

[gecko-8]

To be totally clear, if you use my above code, make sure the image is 48x48, named notification_icon.png and is located in the platforms/android/res/drawable folder. I have a step in my build script to copy the image there so if I remove the platform it gets put back. To add the above to AndroidManifest.xml I used the cordova-custom-config plugin with the following in the config.xml:

<platform name="android">
    ....
    <config-file parent="./application" target="AndroidManifest.xml">
        <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
    </config-file>
</platform>

[uhaldejm]

In case this happens to anyone else:

@gecko-8
ionic cordoba run android was givinig me this error:

Error parsing XML: unbound prefix

I solved it by adding the android namespace at the config.xml's root:

<widget android-versionCode="145" id="your.app.id" ios-CFBundleVersion="1.0" version="1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:cdv="http://cordova.apache.org/ns/1.0">

[opindia123]

In case it helps anyone in the future, the meta-data tag goes within the application tag in the AndroidManifest.xml file. Like:

<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1091" android:versionName="1.0.9.1" package="..." xmlns:android="http://schemas.android.com/apk/res/android">
    ...
    <application android:hardwareAccelerated="true" android:icon="@mipmap/icon" android:label="@string/app_name" android:supportsRtl="true">
        ...
        <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
    </application>
    ...
</manifest>

This is very useful, working for my issue in oreo+ version.

[rhanesoghlyan]

I've got this error message when building project in Android platform.

The prefix "ns1" for attribute "ns1:name" associated with an element type "meta-data" is not bound.

This is my widget
<widget id="test" version="0.0.3" xmlns="http://www.w3.org/ns/widgets" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">

And my config file tag:
<hook src="package-hooks/android_custom_resources.js" type="after_prepare" />
<hook src="package-hooks/android_custom_values.js" type="after_prepare" />
<config-file parent="./application" target="AndroidManifest.xml">
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/red" />
</config-file>