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.
Ok but in my ionic application I have to configure something?
/plataforms/android/res
folder;/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.
@pablozandona Can I also set the notification icon color from my AndroidManifest.xml?
@pablozandona I followed your instructions to a tee and it did not work for me
@hkhamm
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"/>
@jskidd3 what exactly didn't work?
@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: https://github.com/arnesson/cordova-plugin-firebase/issues/53#issuecomment-304573222
I wish I knew why that fixed it though!
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.
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>
does the icon needs to be in @drawable or could it be in @mipmap. @gecko-8 . Thanks
@lexyfeito Sorry, not an expert on Android development but @drawable is the usual place for images.
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
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?
Nope, just a 48x48 png. The alpha channel in the image provides the icon shape.
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>
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:
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.
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>
Most helpful comment
/plataforms/android/res
folder;/plataforms/android/AndroidManifest.xml
this:*where notification_icon is the filename of your icon.