Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

android notification icon showing as white block

I have been having trouble with a icon showing with my notification. I have gone trough the material designs page for icons and Notification doc.

I used different scales, in BMP 256 color format: 360px, 144px, 48px, 24px 16px all continued showing a white block.

I changed format to PNG, used 144px (named "ic_notify_icon", used in code), still no luck.

//Global
private NotificationManager mNotifyManager ;
private Notification mNotify;

private void initialize() {
    mNotifyManager = (NotificationManager) getSystemService(NOTIFICATION_SERVICE);
    Notification.Builder mNotificationBuilder = new Notification.Builder(this);
    mNotificationBuilder.setSmallIcon(R.mipmap.ic_notify_icon);
    mNotificationBuilder.setContentTitle("A Title here");
    mNotificationBuilder.setContentText("Some content text here");
    mNotify = mNotificationBuilder.build();
    ShowNotify();
}

private void ShowNotify(){
    //...some code here
    mNotifyMan.notify(0, mNotify);
    //...some code here
}

Any suggestions?

p.s. I had a look at this post, also same question but I do not find it helpful/useful, or I just do not understand the requirements...

like image 231
CybeX Avatar asked Jun 23 '16 16:06

CybeX


1 Answers

I have found the solution!

I only found hints on what the requirements are for a Android Notification (SDK 22 / Version 5.1.1)but after searching for over 4 hours, finally a complete and working solution for this.

Here are the steps I followed and it seems to be inline with what is mentioned on various forums, questions/answers and doc, but no "steps/requirements" of what is needed:

Creating and preparing your image

  1. Create your image, however you want, take your app icon if you like: enter image description here Quick and dirty
  2. Download an application to set transparency - I used IrfanView, it works well enter image description here Here is my image in IrfanView
  3. Open your image in IrfanView, click File > Save As or press 's'
  4. You should have a Save Dialog open (and a save options dialog, top right - if not, right at the bottom of the save dialog, select the Save options dialog checkbox, and it should open)

  5. My settings (which were given by default) are:

    • Compression level - 6
    • Use main window color for transparency - Checked
    • Binary Encoding
    • (ICO): Use main window color for transparency - Checked
  6. Check the following 2 boxes:

    • Save Transparent Color - Checked (I tried with only this checked, it didn't work - someone can extend on why not)
    • Save Transparentcy as Alpha Channel - Checked
  7. Save as PNG file. enter image description here Save Box with Save Options

In Android Studio:

  1. Right-Click Drawable folder > Add image asset (any resource folder should do) enter image description here
  2. Click on Notification Icon from the top drop-down list (default is Launcher Icon) enter image description here
  3. Select Image > Browse to image> click ok enter image description here You will notice your image is greyscale

this is normal since the Lollipop SDK (API 21 - Ver 5.0.1) only allows this type of color scheme, in searching I came across the materials design page which mentioned something in this line (Someone can extend on why this is)

Below, you will notice your notification icon in different 'dpi resolutions', adding a image normally will show a white block, but adding transparency solves this.

I believe one can use this from a 'colorful' perspective, in this case, IrfanView has a default background of black, this creating a "inverted" image in respect to this color (assuming in IrfanView, one leaves the "Use main windows color for transparency - checked" ) you can create different and interesting images.

I really hope this helps!

like image 51
CybeX Avatar answered Sep 21 '22 11:09

CybeX