Scheduled notification without icon on Android when using React Native Firebase

Question

I'm building a React Native application using TypeScript. For my scheduled local notifications I use React Native Firebase.

On android no icon is shown when the scheduled notification comes in.

Here are is my AndroidManifest.xml:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.painbutton">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
    <uses-permission android:name="android.permission.VIBRATE" />

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
        <activity
            android:name=".SplashActivity"
            android:theme="@style/SplashTheme"
            android:label="@string/app_name"
            android:launchMode="singleTop">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

        <activity
            android:name=".MainActivity"
            android:label="@string/app_name"
            android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
            android:windowSoftInputMode="adjustResize"
            android:exported="true"
            android:launchMode="singleTop">
        </activity>
        <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />

        <service android:name="io.invertase.firebase.messaging.RNFirebaseMessagingService">
            <intent-filter>
            <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>
        <service android:name="io.invertase.firebase.messaging.RNFirebaseInstanceIdService">
            <intent-filter>
            <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>
            </intent-filter>
        </service>

        <receiver android:name="io.invertase.firebase.notifications.RNFirebaseNotificationReceiver"/>
        <receiver android:enabled="true" android:exported="true"  android:name="io.invertase.firebase.notifications.RNFirebaseNotificationsRebootReceiver">
            <intent-filter>
            <action android:name="android.intent.action.BOOT_COMPLETED"/>
            <action android:name="android.intent.action.QUICKBOOT_POWERON"/>
            <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
            <category android:name="android.intent.category.DEFAULT" />
            </intent-filter>
        </receiver>
        <meta-data
            android:name="com.google.firebase.messaging.default_notification_channel_id"
            android:value="@string/default_notification_channel_id"/>
        <meta-data
            android:name="com.google.firebase.messaging.default_notification_icon"
            android:resource="@mipmap/ic_launcher" />
        <meta-data
            android:name="com.google.firebase.messaging.default_notification_color"
            android:resource="@color/blue" />
    </application>
</manifest>

The only Android related option I set programmatically when creating the notification is the channel id:

notification.android.setChannelId("pain-button-channel");

Is this a bug?

score 0 · Answer 1 · edited Oct 15 '18 at 11:34

0

you should first add the new icon in all android/app/src/main/res/mipmap-*

notice in all folders that start mipmap-* add new icon with same name with proper resolution

then in your notification object that send you can add it's name

{
  largeIcon: "ic_launcher", // (optional) default: "ic_launcher"
  smallIcon: "ic_notification", // (optional) default:  "ic_notification" with fallback for "ic_launcher"
}

PushNotification.configure({
  largeIcon: "ic_launcher",
  smallIcon: "ic_notification",
})

edited Oct 15 '18 at 11:34

J. Hesters

13,117
31
133
249

answered Oct 15 '18 at 11:07

Kushal

31
3

The notification object does not have a function called `configure()`. – J. Hesters Oct 15 '18 at 11:23
Unfortunately it does not. I'm neither using Expo (because I'm building for production) nor am I struggling with getting the notifications to work. They do work, they just show the wrong icon – J. Hesters Oct 15 '18 at 12:02

Scheduled notification without icon on Android when using React Native Firebase

1 Answers1