andorid中圆形图片很早就有啦，今天算是搞了一把，自己写了出来，并且可以实际使用的代码。
先看效果图：
图片的原图是：
先看看xml的布局文件是怎么样的：
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="/apk/res/android"xmlns:tools="/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"android:paddingBottom="@dimen/activity_vertical_margin"tools:context=".MainActivity"><com.husy.surfaceviewexample.PorterDuffViewImage android:layout_width="60dp"android:layout_height="60dp"android:src="@mipmap/zly"android:visibility="visible"/></LinearLayout>
布局文件很简单，只要是ImageView的属性都可以在自定义的圆形图片组件中使用。
由于布局文件中规定了图片大小60dp，所以你看到效果图中，相对于原图来说，是由缩放效果的，但是整体的图片是居中进行缩放显示。
好了，说到这里，首先补充一些基础知识。
代码中使用到了PorterDuffXfermode 类：
PorterDuffXfermode 这是一个非常强大的转换模式，使用它，可以使用图像合成的16条Porter-Duff规则的任意一条来控制Paint如何与已有的Canvas图像进行交互。
该类的用法如下：
//创建PorterDuffXfermodePorterDuffXfermode mode=new PorterDuffXfermode(PorterDuff.Mode.DST_IN);//设置mode画笔风格paintnew.setXfermode(mode);
这样设置画笔，到底什么效果，看看Google的效果图：
1.PorterDuff.Mode.CLEAR
所绘制不会提交到画布上。
2.PorterDuff.Mode.SRC
显示上层绘制图片
3.PorterDuff.Mode.DST
显示下层绘制图片
4.PorterDuff.Mode.SRC_OVER
正常绘制显示，上下层绘制叠盖。
5.PorterDuff.Mode.DST_OVER
上下层都显示。下层居上显示。
6.PorterDuff.Mode.SRC_IN
取两层绘制交集。显示上层。
7.PorterDuff.Mode.DST_IN
取两层绘制交集。显示下层。
8.PorterDuff.Mode.SRC_OUT
取上层绘制非交集部分。
9.PorterDuff.Mode.DST_OUT
取下层绘制非交集部分。
10.PorterDuff.Mode.SRC_ATOP
取下层非交集部分与上层交集部分
11.PorterDuff.Mode.DST_ATOP
取上层非交集部分与下层交集部分
12.PorterDuff.Mode.XOR
异或：去除两图层交集部分
13.PorterDuff.Mode.DARKEN
取两图层全部区域，交集部分颜色加深
14.PorterDuff.Mode.LIGHTEN
取两图层全部，点亮交集部分颜色
15.PorterDuff.Mode.MULTIPLY
取两图层交集部分叠加后颜色
16.PorterDuff.Mode.SCREEN
取两图层全部区域，交集部分变为透明色
（以上内容参考我的博友的文章内容：原文链接请猛戳这里是个妹子呦~~~哈哈）
看了上面的内容，我觉得对于刚开始接触这个类的同学来说，太过抽象啦。
下面我给解释一下，希望能达到解惑的目的吧。
首先看上面的16副图中的第二幅和第三幅图，里面都是一幅图片，Src代表原图，是一个正方形，Dst代表目的图，是一个圆形。
下面接着看第四幅图，SrcOver模式，你会发现正方形放在了圆形的上面，并且正方形显示完全，圆形被正方形覆盖了一部分。这就是SrcOver模式的效果。
下面再看第五幅图，PorterDuff.Mode.DST_OVER，你会发现圆形放在了正方形的上面，圆形显示完全，正方形被覆盖了，这就是这种模式达到的效果。
我们看了这几幅图之后，就可以做一个总结啦。
也就是说上面的PorterDuffXfermode 类完成的效果，应该是两幅图或者说两个位图完成的效果。
这个时候，你在看下面的11中模式，会发现都是在两幅图或者两幅位图的基础上进行显示的效果。
下面我们就有了画圆形图头像的思路了。
利用的就是上面的PorterDuff.Mode.SRC_IN或者是PorterDuff.Mode.DST_IN这两种模式达到的效果。
首先说说PorterDuff.Mode.SRC_IN这种模式的思路：
这种效果如上图。正方形在圆形图上面的部分显示出来，正方形的其他部分不显示。并且圆形图也不显示。
我们可以把正方形的部分设置我们要显示的头像图片，把圆形部分设置为我们的圆形的位图，并且这两个图都居中显示，这样达到的效果就是圆形头像图片的效果！！
再说说PorterDuff.Mode.DST_IN这种模式的思路：
这种效果图上，正方形部分不显示，只显示圆形图在正方形重合的部分，圆形图的其他部分不显示。
这个模式下，我们把圆形图设置为我们想要显示的头像图片，把正方形设置为圆形的位图，并且这两个图都居中显示，这样达到的效果就是圆形头像的效果。
对比上面两种模式下的思路，会发现我们只是把图片调换了以下就可以啦。
好了，下面给出两种模式下的代码，首先给出PorterDuff.Mode.SRC_IN模式下的代码：
public class MyXfermode extends View{private int width;private int height;private Paint mpaint;private Bitmap mbitmap;private Bitmap moutbitmap;public MyXfermode(Context context) {super(context);}public MyXfermode(Context context, AttributeSet attrs) {super(context, attrs);initBitmap();}public void initBitmap(){//禁用硬件加速器，因为有些硬件加速器不支持setLayerType(LAYER_TYPE_SOFTWARE, null);//设置抗锯齿mpaint=new Paint(Paint.ANTI_ALIAS_FLAG);mpaint.setColor(Color.YELLOW);mbitmap=BitmapFactory.decodeResource(getResources(),R.drawable.yourimg);//以后的绘制都将显示在moutbitmap上面moutbitmap=Bitmap.createBitmap(mbitmap.getWidth(), mbitmap.getHeight(), Config.ARGB_8888);Log.d("图片信息", mbitmap.getWidth()+ "高"+mbitmap.getHeight());Canvas canvas_outbitmap=new Canvas(moutbitmap);//Dstcanvas_outbitmap.drawCircle(mbitmap.getWidth()/2, mbitmap.getHeight()/2,mbitmap.getWidth()/2,mpaint);PorterDuffXfermode mode=new PorterDuffXfermode(Mode.SRC_IN); mpaint.setXfermode(mode);//Srccanvas_outbitmap.drawBitmap(mbitmap, 0, 0, mpaint);}@Overrideprotected void onDraw(Canvas canvas) {canvas.drawBitmap(moutbitmap,0,0,null);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);}}
布局文件就很简单啦：
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" android:gravity="center"><com.example.myview.MyXfermode android:id="@+id/myarcprogress"android:layout_width="400dp"android:layout_height="400dp" /></LinearLayout>
（这里实例代码是我从妹子的博客里面搞过来的，你会发现这里代码不通用，使用的资源文件图片，我们先要实现的是xml布局文件中进行的设置的图片或者代码中设置的图片，请看下面的另一种方式）
第二种方式，PorterDuff.Mode.DST_IN
代码如下：
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.RectF;import android.graphics.Xfermode;import android.graphics.drawable.BitmapDrawable;import android.util.AttributeSet;import android.util.Log;import android.widget.ImageView;/*** Created by husy on /10/18.* @link /u010156024* @description：*/public class PorterDuffViewImage extends ImageView {private Paint mpaint;private static Xfermode xfermode;private static Bitmap bitmap;private RectF rect;public PorterDuffViewImage(Context context) {super(context);init();}public PorterDuffViewImage(Context context, AttributeSet attrs) {super(context, attrs);init();}public PorterDuffViewImage(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}private void init(){setLayerType(LAYER_TYPE_SOFTWARE, null);xfermode = new PorterDuffXfermode(PorterDuff.Mode.DST_IN);mpaint = new Paint(Paint.ANTI_ALIAS_FLAG);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);int width = getWidth();int height = getHeight();Bitmap.Config config = Bitmap.Config.ARGB_8888;Canvas canvas1=null;BitmapDrawable drawable = (BitmapDrawable)getDrawable();drawable.setBounds(0, 0, width, height);drawable.draw(canvas);if (bitmap == null){Log.i("porterduffviewimage","bitmap==null");Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);rect = new RectF(0,0,width,height);bitmap = Bitmap.createBitmap(width, height, config);canvas1 = new Canvas(bitmap);canvas1.drawOval(rect, paint);}mpaint.setXfermode(xfermode);canvas.drawBitmap(bitmap,0,0,mpaint);}}
布局文件：
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="/apk/res/android"xmlns:tools="/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"android:paddingBottom="@dimen/activity_vertical_margin"tools:context=".MainActivity"><com.husy.surfaceviewexample.PorterDuffViewImage android:layout_width="60dp"android:layout_height="60dp"android:src="@mipmap/zly"android:visibility="visible"/></LinearLayout>
显示效果就是文章开头实现的效果图。
下面我对第二种方式的代码一一进行解释：
首先是三个构造器。这个是实现自定义view中必须的，当然，你也会看到只实现前两个构造器的，但是标准来说，应该是实现这两个构造器。并且从API 21开始增加了下面一种构造器：
public PorterDuffViewImage(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {super(context, attrs, defStyleAttr, defStyleRes);}
不过，不影响，不实现这第四个构造器也没有问题的。
接着是初始化的方法init(),在这里面进行初始化对象，利用绘制过程中使用到的画笔、模式等等。下面是重写onDraw()方法。这个是该类的重点。
int width = getWidth();int height = getHeight();
这两行代码是获取组件的大小宽高。
BitmapDrawable drawable = (BitmapDrawable)getDrawable();drawable.setBounds(0, 0, width, height);drawable.draw(canvas);
这几行代码是绘制目标图片，也就是头像图片在这几行代码中完成，绘制到画板上面，此时是矩形的图片，为什么是矩形图片呢？因为在布局文件中使用android:src=”@drawable/zly”或者是在代码中设置：((PorterDuffViewImage)findViewById(R.id.porter))
.setImageResource(R.mipmap.zly);
这样通过getDrawable()获取的就是原始图片。
需要注意的是：画板中绘制PorterDuff.Mode类型的图片，需要先绘制目的DST图片！！在回事SRC图片！请理解这句话！！
然后的代码请看：
if (bitmap == null){Log.i("porterduffviewimage","bitmap==null");Bitmap.Config config = Bitmap.Config.ARGB_8888;Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);rect = new RectF(0,0,width,height);bitmap = Bitmap.createBitmap(width, height, config);canvas1 = new Canvas(bitmap);canvas1.drawOval(rect, paint);}
这个代码中绘制一个位图bitmap的圆形位图，这就是SRC图！！为什么是圆形呢？因为我们想要的效果就是圆形头像！而这个bitmap位图没有图像，只是一个圆形区域，那么头像图片从何而来呢？就是从上面绘制的DST图中而来！！
要知道，我们此时采用的模式是：PorterDuff.Mode.DST_IN
这种模式是DST图在SRC图中重合的部分显示出来，DST图的重合区域外部不显示，并且SRC图整个不显示。
这里的代码使用了if判断，是因为为了复用！利用static修饰，当重复使用圆形图的时候，只用创建一个类变量！！！
不过我们上面只是利用canvas1画板得到一个圆形位图，要显示圆形头像图片，还要把圆形位图画在原来的画板上，所以有了以下的代码：
mpaint.setXfermode(xfermode);canvas.drawBitmap(bitmap,0,0,mpaint);
设置画笔的模式，同时把位图显示在canvas上！！
这样，我们就得到了圆形头像！！效果就是刚开始展示的图像！！
既然有了自定义view，我们可能不在布局中定义android：src=”@drawable/zly”,我们可能在代码中定义：
public class MainActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);((PorterDuffViewImage)findViewById(R.id.porter)).setImageResource(R.mipmap.zly);}}
这样也是OK的，布局中就简单了：
<com.husy.surfaceviewexample.PorterDuffViewImageandroid:id="@+id/porter"android:layout_width="60dp"android:layout_height="60dp"/>
显示效果和文章开始的图像一样：
到此，具有实际应用价值的自定义的圆形头像代码完成！！！
有点小感慨啊，看着挺简单的东西，自己一步步搞出来，遇到各种问题。建议大家好好敲一遍代码！
