自定义android圆形ImageView
最后更新于：2022-04-01 11:26:00
### 使用自定义ImageView实现圆形Imageview
android自带的Imageview是只能调节它的宽高，不能实现一些圆形的Imageview，而很多社交软件的头像或者一些小图形都是圆形的，看起来非常美观，接下来，我就为大家实现一个自定义的imageview，能够实现圆形图案。
~~~
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;
/**
* 自定义的圆形ImageView，可以直接当组件在布局中使用。
*/
@SuppressLint("DrawAllocation")
public class CircleImageView extends ImageView{
private Paint paint ;
public CircleImageView(Context context) {
this(context,null);
}
public CircleImageView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public CircleImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
paint = new Paint();
}
/**
* 绘制圆形图片
* @author se7en
*/
@SuppressLint("DrawAllocation")
@Override
protected void onDraw(Canvas canvas) {
Drawable drawable = getDrawable();
if (drawable != null) {
Bitmap bitmap = ((BitmapDrawable) drawable).getBitmap();
Bitmap b = getCircleBitmap(bitmap, 14);
int z = Math.min(b.getWidth(),b.getHeight());
final Rect rectSrc = new Rect(0, 0, z , z);
final Rect rectDest = new Rect(0,0,getWidth(),getHeight());
paint.reset();
canvas.drawBitmap(b, rectSrc, rectDest, paint);
} else {
super.onDraw(canvas);
}
}
/**
* 获取圆形图片方法
* @param bitmap
* @param pixels
* @return Bitmap
* @author se7en
*/
private Bitmap getCircleBitmap(Bitmap bitmap, int pixels) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
int min = Math.min(bitmap.getWidth(),bitmap.getHeight());
final Rect rect = new Rect(0, 0, min , min);
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawCircle(min / 2, min / 2, min / 2, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
}
~~~
要说明的有如下几点：
1. 注意导入包的选择，请看清楚我导的那具体的包，导错了，我不保证能不能实现；
1. int z = Math.min(b.getWidth(),b.getHeight()); 这句代码非常重要，如果你原始图片的宽和长不相等的话，这句代码就能保证画出来的是一个圆。而不是那种一个圆被砍了一刀，我不知道那种图形叫什么名字，暂且这样描述；
1.
~~~
int min = Math.min(bitmap.getWidth(),bitmap.getHeight());
~~~
~~~
final Rect rect = new Rect(0, 0, min , min);
~~~
~~~
canvas.drawCircle(min / 2, min / 2, min / 2, paint); 这3句代码也是和第2点差不多，能够保证画出来的圆是一个填充满的圆，而不是椭圆或者少了一点（像是被砍了一刀）的圆；
~~~
1.
~~~
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));这句代码是为paint设置绘图模式，具体含义如下：
~~~
~~~
setXfermode设置两张图片相交时的模式。
在正常的情况下，
~~~
就是在已有的图像上绘图将会在其上面添加一层新的形状。如果新的Paint是完全不透明的，那么它将完全遮挡住下面的Paint；如果它是部分透明的，那么它将会被染上下面的颜色。
而setXfermode就可以来解决这个问题 .
canvas原有的图片可以理解为背景，就是dst；
新画上去的图片可以理解为前景，就是src。请看如下图表：
自定好了CircleImageView 后就可以在xml中使用了，用起来非常的方便，大家也可以把这个代码封装起来，以后直接用就可以了；
xml的代码如下：
~~~
<pre name="code" class="html"><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ray_menu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/menu_bg"
android:orientation="vertical"
android:gravity="center" >
<com.youle.bige.view.CircleImageView
android:id="@+id/person_title_image"
android:layout_width="200dp"
android:layout_height="200dp"
android:src="@drawable/zhoujielun" />
</LinearLayout>
~~~
效果如下：
1. 
现在看起来就非常漂亮和美观了；好了下班吃饭了！88