Android5.0以上通知栏图标设计

众所周知,Android5.0以上系统通知栏做了很大改进,小图标只能用alpha图层进行绘制,不能用rgb图层,就这个问题,我们用一个例子说话。

1. 废话少说,直接上代码

NotificationManager 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的图片如下:

微信图标

2、效果图如下:

通知栏没有下拉时:

这里写图片描述

可以看到,白乎乎的一个图片,完全看不清图标

通知栏下拉时:

这里写图片描述

好像还蛮正常的,可以右下角有一个白乎乎的圆形图标

3、下面我们按照google的要求改变小图标

我们设计一个小图标名字叫icon_weixin,如下

微信图标

周围全是透明,中间用白色勾勒出一个图标

然后代码设置如下

NotificationManager 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)

下面看效果图:

这里写图片描述

这里写图片描述

正常了有木有,不过下拉后那个小图表默认是灰色边,可以通知builder.setColor()改变这个颜色值

代码如下

NotificationManager 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”)),把颜色设置为一个有透明度的蓝色

效果图如下:

这里写图片描述

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

源码地址:https://github.com/naiyizhang/BlogDemo/
项目下的NotificationDemo即为源码


需要设计师朋友特别注意的时,5.0以上的通知需要设计两个两个,大图标正常设计,一般是应用的图标;小图标背景色要透明,然后用纯白勾勒出你需要的图标(用任意颜色都会表现为白色)。

  • 4
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值