自定义圆角控件 圆形控件 超级简单

自定义圆角控件 圆形控件 超级简单的实现方式

圆形图片控件和圆角控件网上一搜一大把，有的代码很多很复杂，后来看的烦了，就自己写了个简单的自定义方式

- **以ImageView为例（其他控件也可以）

- **继承ImageView之后重写draw总调度方法，对canvas进行裁切

---

@Override
    public void draw(Canvas canvas) {
        if (null != path){
            path.reset();//释放path
            path.addCircle(getWidth()/2 , getHeight()/2 , getWidth()/2 , Path.Direction.CCW);//添加圆形路径
            //设置抗锯齿，似乎无效？可能需要关闭硬件加速，这里我没测试，我裁切完成之后会在图片边缘画个圆形框，所以锯齿会被覆盖，看不到
            canvas.setDrawFilter(new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG));
            canvas.save();//保存canvas的状态
            canvas.clipPath(path);//裁剪
            super.draw(canvas);//这里所有在path以外的内容都会被裁剪掉
            canvas.restore();//释放canvas
        }else {
            super.draw(canvas);
        }
    }

怎么样，就是这么简单！
这里示例添加的圆是以控件的中心为圆心，二分之一的宽度为半径裁切的，所以在布局文件里面需要将宽高设置一致才是正常的。
这是简单的示例裁切圆，按照此方法可以随意裁切控件形状，只需要设置path就行了；当然，这里的触摸事件还是整个方形控件的，如果你要细化触摸事件响应，可以自己去计算处理，后面有时间我可能会写一篇关于触摸事件的文章。

---

太短了，再写一点吧，只要圆的情况下，我们可以定义一个圆半径
在attrs.xml里面添加如下代码

    <declare-styleable name="CircleImgView">
        <attr name="radius" format="dimension"/>
    </declare-styleable>

初始化得到这个属性

public CircleImgView(Context context) {
        super(context);
        init(context,null);
    }

    public CircleImgView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
    }

    public CircleImgView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        this(context, attrs);
    }

private void init(Context context, AttributeSet attrs) {
        if (null != attrs){
            TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CircleImgView);
            dimensionR = typedArray.getDimension(R.styleable.CircleImgView_radius, 0);
            typedArray.recycle();
        }
    }

重写onMeasure，直接设置宽高，抛弃布局文件中的宽高设置

@Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        if (0 != dimensionR){
            setMeasuredDimension((int) dimensionR*2 , (int) dimensionR*2);
            if (null == path) path = new Path();
        }
    }

这样，我们就只需要给布局文件填写一个半径，宽高随意写，我们以半径为准

<com.xxx.xxx.CircleImgView
            android:id="@+id/user_head"
            android:src="@drawable/home_demo1"
            app:radius="28dp"
            android:scaleType="centerCrop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

效果就是这样，可以根据需求画边框，都很简单，就不写了

---

需要圆角控件，也是同样的简单实现，只要注意 圆角控件不要覆盖了布局宽高，然后把半径作为圆角半径来初始化path今天就这么多