Android ImageView 四个角自定义角度，以及角度的变换-Toy模板网

这篇具有很好参考价值的文章主要介绍了Android ImageView 四个角自定义角度，以及角度的变换。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

背景：

在正常开发过程中，我们经常会发现一些图片有各种各样的显示，有圆角、直角、圆形、不规则图形等?比较常见的是圆形，还有圆角。今天我们将讲述圆角、四个角不同度数以及通过圆角巧妙变成圆形

1.如果大家不熟悉圆形或者path的以及canvas.clipPath，可以参考我的一篇文章：圆形头像

2.今天我们依旧通过Canvas的画布剪切来完成，有所不同的是，这次的path不是一个圆，而是在矩形中画圆addRoundRect

废话不多说：直接上代码

public class MyRoundJiaoImageView extends AppCompatImageView {

    private int leftTopRadius;
    private int rightTopRadius;
    private int leftBottomRadius;
    private int rightBottomRadius;
    private int allRadius;

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

    public MyRoundJiaoImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initAtter(context, attrs);
    }

    private void initAtter(Context context, AttributeSet attrs) {
        TypedArray typed = context.obtainStyledAttributes(attrs, R.styleable.roundRadion);

        if (typed == null)
            return;


        leftTopRadius = typed.getInt(R.styleable.roundRadion_mleftTopRadius, 0);
        rightTopRadius = typed.getInt(R.styleable.roundRadion_mrightRadius, 0);
        leftBottomRadius = typed.getInt(R.styleable.roundRadion_mleftButtomRadius, 0);
        rightBottomRadius = typed.getInt(R.styleable.roundRadion_mrightButtomRadius, 0);
        allRadius = typed.getInt(R.styleable.roundRadion_allRadius, 0);


        typed.recycle();
    }


    @Override
    protected void onDraw(Canvas canvas) {

        int width = getMeasuredWidth();
        int height = getMeasuredHeight();
        Path path = new Path();
        /*向路径中添加圆角矩形。radii数组定义圆角矩形的四个圆角的x,y半径。radii长度必须为8*/

        if (allRadius > 0) {
            float rids[] = {allRadius, allRadius, allRadius, allRadius, allRadius, allRadius, allRadius, allRadius};
            path.addRoundRect(new RectF(0, 0, width, height), rids, Path.Direction.CW);

        } else {
            float rids[] = {leftTopRadius, leftTopRadius, rightTopRadius, rightTopRadius, leftBottomRadius, leftBottomRadius, rightBottomRadius, rightBottomRadius};
            path.addRoundRect(new RectF(0, 0, width, height), rids, Path.Direction.CW);
        }


        canvas.clipPath(path);

        super.onDraw(canvas);
    }

    public void setAllRadius(int allRadius) {
        this.allRadius = allRadius;
        invalidate();
    }
}

讲解：

如果对画布的操作，需要在onDraw的super之前完成，否则将不会生效

1.我们这边是通过自定义圆角角度，如何自定义参数，可参考Android View自定义参数declare-styleable介绍与使用

参数如下：

<declare-styleable name="roundRadion">

    <attr name="mleftTopRadius" format="integer" />
    <attr name="mrightRadius" format="integer" />
    <attr name="mleftButtomRadius" format="integer" />
    <attr name="mrightButtomRadius" format="integer" />
    <attr name="allRadius" format="integer" />

</declare-styleable>

2.path的addRoundRect的使用

public void addRoundRect(RectF rect, float[] radii, Direction dir)

RectF :矩形的范围

radii：四个角的角度参数，正常需要8个值，因为我们知道一个角确定下来需要两个角度的坐标

Android ImageView 四个角自定义角度，以及角度的变换

所以这个数组正常就是：

float rids[] = {leftTopRadius, leftTopRadius, rightTopRadius, rightTopRadius, leftBottomRadius, leftBottomRadius, rightBottomRadius, rightBottomRadius};



A.(leftTopRadius, leftTopRadius)

B(rightTopRadius, rightTopRadius)

C(leftBottomRadius, leftBottomRadius)

D(rightBottomRadius, rightBottomRadius)

Android ImageView 四个角自定义角度，以及角度的变换