Android 自定义 view 之自定义布局属性 xml 属性

圆号本昊

发布于 2021-09-24 11:30:40

9620

发布于 2021-09-24 11:30:40

文章被收录于专栏：github@hornhuang

引言

上一篇点击查看 https://blog.csdn.net/qq_43377749/article/details/91045764 我们讲到了自定义 view 的基本方式，但是我们也发现，使用这种方式，用户（广大程序员同胞们）只能使用父类控件的属性，但是我们有时需要更多的功能，比如：图片控件需要改变透明度，卡片控件需要设定阴影值等等，那么父类控件的属性显然不够用了，这时我们就要开始实现自定义布局。

我们直接开始

由于自定义布局属性一般只需要对 onDraw() 进行操作。所以 onMeasure() 等方法的重写我就不再啰嗦了，想看的大佬请查看我这一篇点击查看，这里我打算继承字 view 实现一个类似 TextView 的控件。

首先，让我们现在 res/values/styles 文件中增加一个自定义布局属性。

        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

这些标签都是什么意思呢？

首先：

MyView 是自定义布局属性的名字，也就是标签也就是入口，在 onDraw 中，用 context.obtainStyledAttributes(attrs, R.styleable.MyView); 获得自定义布局属性的全部子项。

其次：

attr 中的 name 便是你属性的名字，比如说这个 text_size 、text_color 、text_text 这三个属性，在布局文件中就是：

最后：

format 标签，format 标签指定的是数据类型，具体可以看这篇，我在这里就不重复了 -> 点击前往 https://blog.csdn.net/pgalxx/article/details/6766677

解析和引用

上面我们先定义了属性，又在布局中对其赋值，那么实际中，我们如何在自定义控件里，获得它的实际值呢？让我们先写下构造方法，在构造方法中获得这些值的大小：

    private int textSize;
    private String textText;
    private int textColor;

    public MyView(Context context) {
        super(context);
    }

    public MyView(Context context, AttributeSet attrs) {
        super(context, attrs);

        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.MyView);

        textSize = array.getDimensionPixelSize(R.styleable.MyView_text_size, 15);
        textText = array.getString(R.styleable.MyView_text_text);
        textColor = array.getColor(R.styleable.MyView_text_color,Color.BLACK);

        array.recycle();
    }

建立一个 TypeArray 对象，用于存储自定义属性所传入的的值。obtainStyledAttributes 方法又两个参数，第二个参数就是我们在styles.xml文件中的标签，即属性集合的标签，在R文件中名称为R.styleable+name
然后根据 array 对象，获取传入的值。一般来说，它的方法有两个属性，第一个参数为属性集合里面的属性，R文件名称：R.styleable+属性集合名称+下划线+属性名称，第二个参数为，如果没有设置这个属性，则设置的默认的值
最后记得将TypedArray对象回收

来重写下 onDraw() 方法。

由于在构造方法中，我们已经获得基本的值，所以在 onDraw() 中，将这些东西绘制出来就行了，这里直接上代码：

    @Override
    protected void onDraw(Canvas canvas) {
        // 调用父View的onDraw函数，因为View这个类帮我们实现了一些
        // 基本的而绘制功能，比如绘制背景颜色、背景图片等
        super.onDraw(canvas);
        int r = getMeasuredWidth() / 2;//也可以是getMeasuredHeight()/2,本例中我们已经将宽高设置相等了
        // 圆心的横坐标为当前的View的左边起始位置+半径
        int centerX = r;
        // 圆心的纵坐标为当前的View的顶部起始位置+半径
        int centerY = r;
        // 定义灰色画笔，绘制圆形
        Paint bacPaint = new Paint();
        bacPaint.setColor(Color.GRAY);
        canvas.drawCircle(centerX, centerY, r, bacPaint);
        // 定义蓝色画笔，绘制文字
        Paint paint = new Paint();
        paint.setColor(textColor);
        paint.setTextSize(textSize);
        canvas.drawText(textText, 0, r+paint.getTextSize()/2, paint);
    }

运行一下下：perfect ！