前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Android消息个数提醒控件使用详解

Android消息个数提醒控件使用详解

作者头像
砸漏
发布2020-10-28 20:58:30
5490
发布2020-10-28 20:58:30
举报
文章被收录于专栏:恩蓝脚本恩蓝脚本

前言

在QQ中有消息个数提醒的控件,虽然现在没用到,但是以后可能会用到,所以就实现它,也不难。

实现

效果图如下:

这里写图片描述
这里写图片描述

先贴源码了:

代码语言:javascript
复制
public class TipNumberView extends TextView {

  private Paint mBgPaint ;
  PaintFlagsDrawFilter pfd; 
  public TipNumberView(Context context, AttributeSet attrs) {
    super(context, attrs);
    //初始化画笔
    mBgPaint = new Paint();
    mBgPaint.setColor(Color.RED);
    mBgPaint.setAntiAlias(true);

    pfd = new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG); 
  }
  public TipNumberView(Context context) {
    this(context,null);

  }
  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    //得到测量的高度和宽度
    int measuredWidth = getMeasuredWidth();
    int measuredHeight = getMeasuredHeight();
    int max = Math.max(measuredWidth, measuredHeight);
    //设置控件区域大小
    setMeasuredDimension(max, max);
  }

  //设置背景颜色
  @Override
  public void setBackgroundColor(int color){
    mBgPaint.setColor(color);
  }

  /**
   * 设置通知个数显示
   * @param text
   */
  public void setNotifiText(int text){
    setText(text+"");
  }

  public void setNotifiText(String text){
    setText(text);
  }

  //绘图
  @Override
  public void draw(Canvas canvas) {
    //设置绘图无锯齿
    canvas.setDrawFilter(pfd);
    canvas.drawCircle(getWidth()/2, getHeight()/2, Math.max(getWidth()/2, getHeight())/2, mBgPaint);
    super.draw(canvas);
  }
}

我是直接继承至TextView,因为TextView有setText方法,所以只需要绘制圆形的红色背景,然后调用方法setText即可,这就是实现的思路。

先要覆盖onMeasure方法来得到宽度和高度,因为背景为圆形,所以我们取宽度和高度两者之间的最大值,然后设置控件大小为一个正方形,在这个正方形的矩形里面,调用drawCircle方法来绘制圆形,设置画笔的颜色为红色即可。

小结

在布局文件使用这个类的时候,要设置android:gravity为center,这样数字就可以居中了,之所以没有继承View来进行写,因为View还要自己去画数字,这样就增加了难度,不值得了。

源码下载点击这里。

以上就是本文的全部内容,希望对大家的学习有所帮助。

本文参与?腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2020-09-11 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客?前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与?腾讯云自媒体分享计划? ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
http://www.vxiaotou.com