6

I have a standalone android and ios app.

currently testing push notifications on android.

I have setup my app.json with the following notification key

"notification":{
      "icon": "./app_assets/icons/icon-48-gs.png",
      "color": "#000000"
    },

the icon above is a 48x48 greyscale icon with transparency. i tried also without color attribute. all i get in both the status bar and in the actual notiification is a white/light grey/black square.

grey square only

in the expo forums i saw others mention they solved this issue with a 96x96 sized icon. this did not help at all.

https://forums.expo.io/t/push-notifications-missing-icon-on-android/9170

https://forums.expo.io/t/android-notification-status-bar-icon-too-small/7175

Can someone please help provide guidance on what the issue might be?

Update per @Raaj Nadar's comment below, Here are the icons i have tried.

enter image description here enter image description here enter image description here enter image description here

w--
  • 6,427
  • 12
  • 54
  • 92
  • The image should be in grayscale meaning black and white! See the wifi icon color the image should be in 8 bit – Rajendran Nadar May 31 '18 at 08:01
  • 2
    Thank you @RaajNadar!! making the image 8 bit was the answer. If you add your comment as an answer i'm happy to accept it. Btw, if you can include how you know the grey scale image needs to be 8-bit that would be awesome. – w-- Jun 01 '18 at 05:30

1 Answers1

4

enter image description here

The official docs of expo is updated with proper information.

The image should be in grayscale meaning black and white! Why?

RGB (32 bit) - This color mode is recommended form displaying images on screen.

CMYK (32 bit) - This color mode is recommended when the image is to be printed.

Grayscale (8 bit) - Only black and white Proper term is monochrome color.

From SDK level 21 colorful images (32 Bit) will be visible in dark gray color or plain white according to the status bar color. From SDK level 21 only grayscale images are recommended by android and iOS.

Notification icon in Android 5.0 is just a white square

Notification bar icon turns white in Android 5 Lollipop

Check the notification section in docs.expo.io

Rajendran Nadar
  • 4,962
  • 3
  • 30
  • 51
  • I have my iOS stand alone app in Test Flight using expo notifications and still see the expo icon , any clue? – VAAA Aug 14 '22 at 12:55
  • Please check this document https://docs.expo.dev/versions/latest/config/app/#notification – Rajendran Nadar Aug 14 '22 at 13:21
  • I already have the icon property set, the notifications icon seems to be only for Android, so I don’t know what else is missing on my side. help me. – VAAA Aug 14 '22 at 13:35
  • For iOS you need to set the icon param as icons are created in a different manner on iOS, the param is responsible for creating the app icon also, if you are on the bare workflow you can configure the notify icon from the Xcode https://docs.expo.dev/versions/latest/config/app/#icon – Rajendran Nadar Aug 14 '22 at 13:41
  • Im in the managed flow with Expo, I already have the app icon set and when I publish and install from Test Fligth I can see the app icon correct, but the Expo Push notification icon still wrong. I create this post: https://stackoverflow.com/questions/73353069/expo-react-native-ios-push-notifications-how-to-change-the-icon This is killing me! – VAAA Aug 14 '22 at 16:42