用自定義ImageView繪制圓形頭像（學習筆記）

新人學習AS，在嘗試使用自定義ImageView繪制圓形圖像時，遇到一些問題，特記錄下來。其中基礎代碼主要參考：https://www.cnblogs.com/JczmDeveloper/p/3873043.html

然後加上自己修改的一些部分，最終成果：

話不多說，上代碼：

RoundImageView.java

package com.example.tools;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

/**
 * Created by zhangjing on 2019/6/21
 */
public class RoundImageView extends ImageView {

    private Paint paint;

    public RoundImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        paint = new Paint();
    }

    /**
     * 繪制圓形圖檔
     *
     * @param canvas
     */
    @Override
    protected void onDraw(Canvas canvas) {
        //擷取圖檔
        Drawable drawable = getDrawable();
        if (drawable != null) {
            Bitmap bitmap = drawableToBitmap(drawable);
            Bitmap square = getSquareBitmap(bitmap);
            //将圖形轉換成圓形
            Bitmap result = getCircleBitmap(square);

            Rect rectSrc = new Rect(0, 0, result.getWidth(),  result.getHeight());
            Rect rectDes = new Rect(0, 0, getWidth(), getHeight());
            paint.reset();
            canvas.drawBitmap(result, rectSrc, rectDes, paint);
        }
    }

    /**
     * 截取正方形,将矩形截取成正方型
     * @param bitmap
     * @return
     */
    private Bitmap getSquareBitmap(Bitmap bitmap) {
        Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        int len = bitmap.getWidth() < bitmap.getHeight() ? bitmap.getWidth() : bitmap.getHeight();
        Rect square = new Rect(0, 0, len, len);
        Bitmap output = Bitmap.createBitmap(len, len, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
        canvas.drawRect(square, paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, square, paint);
        return output;
    }

    /**
     * 擷取圓形圖檔方法
     * 原理：在畫布上先畫個正方形，然後在畫個内切圓，兩者交集就是内切圓
     *
     * @param bitmap
     * @return
     */
    private Bitmap getCircleBitmap(Bitmap bitmap) {
        //先在畫布上畫上原圖大小的矩形
        Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
        paint.reset();
        paint.setAntiAlias(true);//抗鋸齒

        //再在畫布上或個圓圈
        int x = bitmap.getWidth();
        canvas.drawCircle(x / 2, x / 2, x / 2, paint);

        //接下來就是交集的方法很重要沒有就不能變成圓形
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        //将圖像放進去
        canvas.drawBitmap(bitmap, rect, rect, paint);
        return output;
    }

    /**
     * 将drawable轉換成栅格圖，即Bitmap
     *
     * @param drawable
     * @return
     */
    private Bitmap drawableToBitmap(Drawable drawable) {
        int w = drawable.getIntrinsicWidth();
        int h = drawable.getIntrinsicHeight();
        //ARGB_8888代表32位ARGB位圖
        Bitmap bitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        //沒有下面的canvas，圖像無法顯示
        Canvas canvas = new Canvas(bitmap);
        drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
        drawable.draw(canvas);
        //到此依然是原有的圖形
        return bitmap;
    }
}


           

其中：

• 繼承ImageView時，AS提示紅色波浪線，這個問題不影響run。
• Bitmap bitmap = ((BitmapDrawable) drawable).getBitmap();網上有很多這樣強轉的代碼，但是實際運作時會報錯，強轉失敗。解決方法，是drawableToBitmap方法。
• 采用的原理是矩形和内切圓的交集是圓形的原理，參考https://blog.csdn.net/iispring/article/details/50472485
• 優化：考慮到矩形使用原有方法裝換，會出bug。先把矩形統一轉換成正方形

xml

<com.example.tools.RoundImageView
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:src="@mipmap/ic_launcher"
            android:layout_centerInParent="true"/>