RoundImageView圆角控件

RoundImageView圆角控件

示例代码如下：

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.Log;

import androidx.annotation.Nullable;
import androidx.appcompat.widget.AppCompatImageView;

public class RoundImageView extends AppCompatImageView {
    private static final String TAG = "RoundImageView";

    private int radius = 0;

    public RoundImageView(Context context) {
        this(context, null);
    }

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

    public RoundImageView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        setup(context, attrs, defStyleAttr);
    }

    private void setup(Context context, AttributeSet attrs, int defStyleAttr) {
        try {
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundImageView);
            radius = a.getDimensionPixelSize(R.styleable.RoundImageView_riv_radius, 0);
            Log.d(TAG, "RoundImageView: radius=" + radius);
            a.recycle();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    public void setRadius(int radius) {
        this.radius = radius;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        if (radius > 0) {
            Path path = new Path();
            path.addRoundRect(new RectF(0, 0, getWidth(), getHeight()), radius, radius, Path.Direction.CW);
            canvas.clipPath(path);//设置可显示的区域，canvas四个角会被剪裁掉
        }
        super.onDraw(canvas);
    }
}

在 attrs.xml 文件中定义控件的圆角dp值属性:

<declare-styleable name="RoundImageView">
    <attr name="riv_radius" format="dimension" />
</declare-styleable>

使用示例

<com.xx.ui.widget.RoundImageView
    android:id="@+id/image_view"
    android:layout_width="120dp"
    android:layout_height="60dp"
    android:scaleType="centerCrop"
    app:riv_radius="8dp" />