天天看點

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

衆所周知,Android5.0以上系統通知欄做了很大改進,小圖示隻能用alpha圖層進行繪制,不能用rgb圖層,就這個問題,我們用一個例子說話。

1. 廢話少說,直接上代碼

1

2

3

4

5

6

7

8

9

10

1

2

3

4

5

6

7

8

9

10NotificationManager notificationManager= (NotificationManager) getSystemService(NOTIFICATION_SERVICE);

NotificationCompat.Builder builder=new NotificationCompat.Builder(this);

Notification notification=builder.setContentTitle(getString(R.string.notification_title))

.setContentText(getString(R.string.notification_content)).setWhen(System.currentTimeMillis())

.setDefaults(Notification.DEFAULT_LIGHTS).setSmallIcon(R.mipmap.weixin_raw)

.setLargeIcon(BitmapFactory.decodeResource(getResources(),R.mipmap.weixin_raw))

.setContentIntent(PendingIntent.getActivities(this,0x0001,new Intent[]{new Intent(this,MainActivity.class)},PendingIntent.FLAG_UPDATE_CURRENT))

.build();

notificationManager.notify(1,notification);

R.mipmap.weixin_raw的圖檔如下:

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

2、效果圖如下:

通知欄沒有下拉時:

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

可以看到,白乎乎的一個圖檔,完全看不清圖示

通知欄下拉時:

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

好像還蠻正常的,可以右下角有一個白乎乎的圓形圖示

3、下面我們按照google的要求改變小圖示

我們設計一個小圖示名字叫icon_weixin,如下

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

周圍全是透明,中間用白色勾勒出一個圖示

然後代碼設定如下

1

2

3

4

5

6

7

8

9

10

1

2

3

4

5

6

7

8

9

10NotificationManager notificationManager= (NotificationManager) getSystemService(NOTIFICATION_SERVICE);

NotificationCompat.Builder builder=new NotificationCompat.Builder(this);

Notification notification=builder.setContentTitle(getString(R.string.notification_title))

.setContentText(getString(R.string.notification_content)).setWhen(System.currentTimeMillis())

.setDefaults(Notification.DEFAULT_LIGHTS).setSmallIcon(R.mipmap.icon_weixin)

.setLargeIcon(BitmapFactory.decodeResource(getResources(),R.mipmap.weixin_raw))

.setContentIntent(PendingIntent.getActivities(this,0x0001,new Intent[]{new Intent(this,MainActivity.class)},PendingIntent.FLAG_UPDATE_CURRENT))

.build();

notificationManager.notify(1,notification);

就改了一個地方,設定setSmallIcon(R.mipmap.icon_weixin)

下面看效果圖:

android5.0通知欄圖示,Android5.0以上通知欄圖示設計
android5.0通知欄圖示,Android5.0以上通知欄圖示設計

正常了有木有,不過下拉後那個小圖表預設是灰色邊,可以通知builder.setColor()改變這個顔色值

代碼如下

1

2

3

4

5

6

7

8

9

10

11

1

2

3

4

5

6

7

8

9

10

11NotificationManager notificationManager= (NotificationManager) getSystemService(NOTIFICATION_SERVICE);

NotificationCompat.Builder builder=new NotificationCompat.Builder(this);

Notification notification=builder.setContentTitle(getString(R.string.notification_title))

.setContentText(getString(R.string.notification_content)).setWhen(System.currentTimeMillis())

.setDefaults(Notification.DEFAULT_LIGHTS).setSmallIcon(R.mipmap.icon_weixin)

.setColor(Color.parseColor("#880000FF"))

.setLargeIcon(BitmapFactory.decodeResource(getResources(),R.mipmap.weixin_raw))

.setContentIntent(PendingIntent.getActivities(this,0x0001,new Intent[]{new Intent(this,MainActivity.class)},PendingIntent.FLAG_UPDATE_CURRENT))

.build();

notificationManager.notify(1,notification);

僅僅加了一行:setColor(Color.parseColor(“#880000FF”)),把顔色設定為一個有透明度的藍色

效果圖如下:

android5.0通知欄圖示,Android5.0以上通知欄圖示設計

至此,我們的例子就完成了。

需要設計師朋友特别注意的時,5.0以上的通知需要設計兩個兩個,大圖示正常設計,一般是應用的圖示;小圖示背景色要透明,然後用純白勾勒出你需要的圖示(用任意顔色都會表現為白色)。