通过clipPath裁剪实现圆角ImageView

目前实现圆角图片的方法有很多种,有自定义ImageView的(裁剪bitmap,裁剪canvas),也有借助图片加载框架的(glide,picaso),本文介绍的是通过裁剪canvas,即通过canvas.clipPath实现的。

直接上代码 源码地址

public class RoundImageView extends ImageView {
    private Path mPath;
    private RectF mRectF;
    /**
     * 利用clip剪切的四个角半径,八个数据分别代表左上角(x轴半径,y轴半径),右上角(**),右下角(**),左下角(**)
     */
    private float[] rids = new float[8];
    private PaintFlagsDrawFilter paintFlagsDrawFilter;
    public RoundImageView(Context context) {
        this(context, null,0);
    }

    public RoundImageView(Context context, @Nullable AttributeSet attrs) {
        this(context,attrs,0);
    }

    public RoundImageView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.RoundImageView);
        /**
         * 此处圆角半径为四个角的半径
         */
        float mRadius = array.getDimension(R.styleable.RoundImageView_radius, 10);
        rids[0] = mRadius;
        rids[1] = mRadius;
        rids[2] = mRadius;
        rids[3] = mRadius;
        rids[4] = mRadius;
        rids[5] = mRadius;
        rids[6] = mRadius;
        rids[7] = mRadius;
        array.recycle();
        mPath = new Path();
        paintFlagsDrawFilter = new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
        setLayerType(View.LAYER_TYPE_HARDWARE, null);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        mPath.reset();
        mPath.addRoundRect(mRectF, rids, Path.Direction.CW);
        canvas.setDrawFilter(paintFlagsDrawFilter);
        canvas.save();
        canvas.clipPath(mPath);
        super.onDraw(canvas);
        canvas.restore();
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mRectF = new RectF(0, 0, w, h);
    }
}

猜你喜欢

转载自blog.csdn.net/cdye_1234/article/details/79818016