自定义ImageView显示图片为圆形，并可以设置光环

原创已于 2023-07-17 13:54:55 修改 · 2.4k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

Android

于 2016-12-15 10:14:11 首次发布

本文介绍了一个自定义的ImageViewPlus组件，该组件支持圆形显示图片并带有边框效果。通过XML属性可以轻松设置边框颜色和宽度，适用于Android应用中需要美化图片展示的场景。

public class ImageViewPlus extends ImageView {
    private Paint paintBitmap = new Paint(Paint.ANTI_ALIAS_FLAG);
    private Paint paintBorder = new Paint(Paint.ANTI_ALIAS_FLAG);
    private Bitmap mRawBitmap;
    private BitmapShader mShader;
    private Matrix matrix = new Matrix();
    private float borderWidth = DEFAULT_BORDER_WIDTH;
    private int borderColor = DEFAULT_BORDER_COLOR;
    private static final int DEFAULT_BORDER_COLOR = Color.TRANSPARENT;
    private static final int DEFAULT_BORDER_WIDTH = 0;

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

    public ImageViewPlus(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

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

    public ImageViewPlus(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        this.init(context, attrs);
    }

    private void init(Context context, AttributeSet attrs) {
        if (attrs == null) {
            return;
        }
        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ImageViewPlus);
        borderColor = ta.getColor(R.styleable.ImageViewPlus_borderColor, DEFAULT_BORDER_COLOR);
        borderWidth = ta.getDimensionPixelSize(R.styleable.ImageViewPlus_borderWidth, DEFAULT_BORDER_WIDTH);
        ta.recycle();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        Bitmap rawBitmap = getBitmap(getDrawable());
        if (rawBitmap != null) {
            int viewWidth = getWidth();
            int viewHeight = getHeight();
            int viewMinSize = Math.min(viewWidth, viewHeight);
            float dstWidth = viewMinSize;
            float dstHeight = viewMinSize;
            if (mShader == null || !rawBitmap.equals(mRawBitmap)) {
                mRawBitmap = rawBitmap;
                mShader = new BitmapShader(mRawBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
            }
            if (mShader != null) {
                matrix.setScale((dstWidth - borderWidth * 2) / rawBitmap.getWidth(), (dstHeight - borderWidth * 2) / rawBitmap.getHeight());
                mShader.setLocalMatrix(matrix);
            }
            paintBitmap.setShader(mShader);
            paintBorder.setStyle(Paint.Style.STROKE);
            paintBorder.setStrokeWidth(borderWidth);
            paintBorder.setColor(borderColor);
            float radius = viewMinSize / 2.0f;
            canvas.drawCircle(radius, radius, radius - borderWidth / 2.0f, paintBorder);
            canvas.translate(borderWidth, borderWidth);
            canvas.drawCircle(radius - borderWidth, radius - borderWidth, radius - borderWidth, paintBitmap);
        } else {
            super.onDraw(canvas);
        }
    }

    /**
     * 获取imageview的bitmap  * @param drawable  * @return
     */
    private Bitmap getBitmap(Drawable drawable) {
        if (drawable instanceof BitmapDrawable) {
            return ((BitmapDrawable) drawable).getBitmap();
        } else if (drawable instanceof ColorDrawable) {
            Rect rect = drawable.getBounds();
            int width = rect.right - rect.left;
            int height = rect.bottom - rect.top;
            int color = ((ColorDrawable) drawable).getColor();
            Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
            Canvas canvas = new Canvas(bitmap);
            canvas.drawARGB(Color.alpha(color), Color.red(color), Color.green(color), Color.blue(color));
            return bitmap;
        } else {
            return null;
        }
    }

可以设置ImageViewPlus属性

在res/values文件下新建一个attrs.xml文件

    <declare-styleable name="ImageViewPlus">
    <attr name="borderColor" format="color" />
    <attr name="borderWidth" format="dimension" />
    </declare-styleable>

设置此属性自定义属性

在使用此view的布局文件引入

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/包名"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/bg_color"
    android:orientation="vertical">

<com.jiajing.administrator.gamepaynew.addition.widget.ImageViewPlus
    android:id="@+id/image"
    android:layout_width="@dimen/layout_60dp"
    android:layout_height="@dimen/layout_60dp"
    android:padding="@dimen/layout_2dp"
    android:src="@mipmap/icon"
    app:borderColor="@color/white"
    app:borderWidth="@dimen/layout_2dp" />

标签

#android