RadioButton小红点、数字角标的实现

最新推荐文章于 2022-06-01 17:14:26 发布

原创

最新推荐文章于 2022-06-01 17:14:26 发布 · 1.8k 阅读

13 ·

CC 4.0 BY-SA版权

文章标签：

#RadioGroup #RadioButton #小红点 #角标

本文介绍了一种自定义RadioButton的方法，通过重写onDraw方法来实现小红点和数字角标的显示。利用Canvas和Paint绘制圆点和数字角标，适用于RadioGroup中，提供了一个灵活的UI组件定制方案。

RadioButton通常作为RadioGroup的子布局嵌套在里面，单独使用不太常用，本文实现RadioButton小红点、数字角标，主要是利用onDraw方法进行重写，绘制小红点、数字角标。如下：

工具类：

public class UIUtils {
    public static int dp2px(float dpValue) {
        final float scale = getContext().getResources().getDisplayMetrics().density;
        return (int) (dpValue * scale + 0.5f);
    }
}

实现代码：

public class AppRadioButton extends AppCompatRadioButton {

    private Paint mPaint;
    private boolean isShowDot;
    private boolean isShowNumberDot;

    //小红点半径
    private final int circleDotRadius = UIUtils.dp2px(4);
    //icon的尺寸，高 == 宽