自定义View 自定义圆点指示LinearLayout实现红色小圆点功能

 

前言

项目需求：界面有一处地方需要在控件右上角添加一个小红点，如下图所示

方法可能有很多种，比如FrameLayout 中添加一张小圆点图片，默认隐藏，在需要时显示，但我们这里使用自定义view 实现

话不多说，直接上代码

我们先定义一个Paint 以及一个布尔变量控制圆点的显示与隐藏

 private Paint redPaint ;//画笔
 private Boolean isShow = false;//是否显示 默认隐藏

重写onFinishInflate 在控件加载完成之后配置paint 

 @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        redPaint = new Paint();
        redPaint.setColor(Color.RED);
        redPaint.setAntiAlias(true);//抗锯齿
        redPaint.setDither(true);//防抖动
        redPaint.setStyle(Paint.Style.FILL_AND_STROKE);//全部填充
    }

 然后提供方法控制其显示与隐藏

 public void setIsShow(Boolean isShow){
        this.isShow = isShow;
        invalidate();
    }

    public Boolean getIsShow(){
        return isShow;
    }

最后重写onDraw方法即可

//重写onDraw
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (isShow){
            canvas.drawCircle(getWidth()-6,6,6,redPaint);
        }
    }

此处我们可以再新建一个方法来控制Paint ,大家可以传入自己的paint 

public void setRedPaint(Paint paint){
    this.redPaint = paint;
    this.isShow = true;
    invalidate();
} 

最后在activity中使用，这里通过点击按钮控制小圆点的隐藏或者显示

 public void change(View view){
        if (redDotView.getIsShow()) redDotView.setIsShow(false);
        else  redDotView.setIsShow(true);
    }

 另外我们再加一个按钮传入自己的Paint 

public void paint(View view){
        Paint paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setAntiAlias(true);
        paint.setDither(true);
        paint.setStyle(Paint.Style.STROKE);
        redDotView.setRedPaint(paint);
    }

效果图如下

 

源码点击这里 : 点我点我点我