GitHub控件之BadgeView(数字提醒)

转载 2018年04月16日 00:45:46

qq交流群:668524118


数字提醒大家肯定都见识过。QQ、微信等app中如果有消息或者提醒的时候,就会展现给用户一个红点或者带有数字的点。前段时间微信上流行把自己的头像换成带有数字提醒的头像,让那些有强迫症的人真是抓狂。


    下面我们就看一下怎么在自己的app中实现这种效果。

    开发者当然可以自己用相对布局来实现这样的效果。一个还好,但是多了呢!就会很繁琐。GitHub上有一个开源的第三方控件,叫做BadgeView。使用它可以很方面的实现想要的效果。

    先来怎么使用,简单的三行代码就可以实现数字提醒:

[java] view plain copy
  1. BadgeView badgeView = new com.jauker.widget.BadgeView(this);  
  2. badgeView.setTargetView(textView);  
  3. badgeView.setBadgeCount(3);  

    看一下badgeview中常用的方法:

1. setTargetView(View) --> 设置哪个控件显示数字提醒,参数就是一个view对象

2. setBadgeCount(int) --> 设置提醒的数字

3. setBadgeGravity(Gravity) --> 设置badgeview的显示位置

4. setBackgroundColor() --> 设置badgeview的背景色,当然还可以设置背景图片

5. setBackgroundResource() --> 设置背景图片

6. setTypeface() --> 设置显示的字体

7. setShadowLayer() --> 设置字体的阴影

[java] view plain copy
  1. badgeView = new BadgeView(this);  
  2.         badgeView.setTargetView(layout);  
  3.         badgeView.setBackground(12, Color.parseColor("#9b2eef"));  
  4.         badgeView.setText("提示");  

[java] view plain copy
  1. badgeView = new BadgeView(this);  
  2.         badgeView.setTargetView(layout);  
  3.         badgeView.setBadgeGravity(Gravity.BOTTOM | Gravity.CENTER);  
  4.         badgeView.setBadgeCount(4);  

[java] view plain copy
  1. badgeView = new BadgeView(this);  
  2.         badgeView.setTargetView(layout);  
  3.         badgeView.setBadgeGravity(Gravity.TOP | Gravity.LEFT);  
  4.         badgeView.setTypeface(Typeface.create(Typeface.SANS_SERIF,  
  5.                 Typeface.ITALIC));  
  6.         badgeView.setShadowLayer(2, -1, -1, Color.GREEN);  
  7.         badgeView.setBadgeCount(2);  

    实际上BadgeView这个类就是继承TextView的。很多TextView中设置字体的方法都适用于BadgeView。


    OK。效果实现完毕。


    BadgeView下载链接

    badgeview.jar下载

    DEMO下载


BadgeView的使用

BadgeView是GitHub上的一个开源的第三方控件,用以实现类似微信、QQ等新消息提醒,在控件的右上角显示带数字的图标。这是我接触这个控件的初始目的,但在使用的过程中发现他很强大,用一句话来总结...
  • zsmurf
  • zsmurf
  • 2015-12-10 16:12:05
  • 1180

GitHub控件之BadgeView(消息提醒的红点)

数字提醒大家肯定都见识过。QQ、微信等app中如果有消息或者提醒的时候,就会展现给用户一个红点或者带有数字的点。前段时间微信上流行把自己的头像换成带有数字提醒的头像,让那些有强迫症的人真是抓狂。 ...
  • u014479000
  • u014479000
  • 2016-01-04 15:28:32
  • 1326

Android进阶UI之BadgeView(数字提醒)

1 概述QQ、微信等app中如果有消息或者提醒的时候,就会展现给用户一个红点或者带有数字的点。电商类app购物车会显示加入购物车商品数量。2 badgeview中常用的方法1. setTargetVi...
  • chenliguan
  • chenliguan
  • 2016-07-22 17:15:00
  • 4485

iOS 为控件添加BadgeView(徽章,在元素上圆形的,有数字提示的小图标)

Demo下载:https://github.com/zhouxl/JSBadgeViewDemo 使用方法: 1.在你的项目中导入JSBadgeView.h和JSBadgeView.h文件 2.添加系...
  • Riven_wn
  • Riven_wn
  • 2015-04-27 17:33:48
  • 2493

GitHub控件之BadgeView(数字提醒) android 未读消息红点

转载出处:http://blog.csdn.net/crazy1235/article/details/42262369     数字提醒大家肯定都见识过。QQ、微信等app中如果有消息或者提醒...
  • qq_29755359
  • qq_29755359
  • 2017-09-10 08:32:22
  • 924

Android BadgeView使用介绍 (数字提醒提示)

前段时间做的一个淘宝客的项目,需要在商品图片上添加价格标签,之前自己使用TextView和Cavas绘制的感觉效果一般,今天偶然在CSDN上发现BadgeView这个开源项目,在git下载下来之后,使...
  • jdsjlzx
  • jdsjlzx
  • 2013-11-04 11:32:46
  • 11520

Android实战简易教程-第四十二枪(github实用控件推荐BadgeView-图标左上角消息提示控件)

微信和QQ的左上角消息提示大家都十分有印象,有强迫症的童鞋总是忍不住的要点掉它,我们怎么将这样一个小功能引入到自己的项目中呢?github上有一款控件可以帮助我们实现这个功能,下面我们就看一下这个控件...
  • yayun0516
  • yayun0516
  • 2015-08-22 11:11:13
  • 3030

右上角数字提醒 开源第三方BadgeView控件的使用

转载请注明出处:http://blog.csdn.net/crazy1235/article/details/42262369     数字提醒大家肯定都见识过。QQ、微信等app中如果有消息或...
  • Sun1928
  • Sun1928
  • 2016-07-07 11:46:42
  • 1303

android-viewbadger.jar

  • 2014年11月12日 17:45
  • 7KB
  • 下载

Android 消息数字提示,类似微信,BadgeView

这里主要应用的是第三方控件:BadgeView BadgeView继承TextView,所以TextView中设置字体的方法都适用...
  • bruce_qiwei
  • bruce_qiwei
  • 2016-12-09 20:05:00
  • 1201
收藏助手
不良信息举报
您举报文章:GitHub控件之BadgeView(数字提醒)
举报原因:
原因补充:

(最多只允许输入30个字)