Xfermode（图片混排模式）在Google文档中找是这样描述的：Xfermode是在绘图通道中自定义“传输模式”的基类。静态函数创建可以调用或者返回任意作为模式枚举指定的预定义子类实例。当Xfermode分配给Paint，然后绘制对象的Paint就具备了所添加的xfermode。
Xfermode有3个子类：AvoidXfermode、PixelXorXfermode、PorterDuffXfermode。不过，AvoidXfermode 和 PixelXorXfermode 在高于 API16的系统上已经配抛弃了，所以，今天我们重点学习一下 PorterDuffXfermode 这个类。
先看一下使用 PorterDuffXfermode 的效果：
xfermode.png
现在看一下 Google官网对 PorterDuffXfermode 18中模式的介绍：
PorterDuff.Mode的18种混排模式及算法
原理：系统是通过对Sa（Source alpha，Src的透明度）、Da（Destination alpha，Dat的透明度）、Sc（Source Color，Src的颜色）、Dc（Destination Color，Dat的透明度），四个值来进行运算来达到变换的效果。
我们通常可以理解为：将XFermode解释成图层的并集交集的叠放。正片叠低效果就是把两个图层中的颜色进行叠加，这样暗的部分会被加强；滤色效果也是对两个图层中的颜色进行叠加，但亮的部分会被加强。
| 属性名 | 属性常量 | 属性说明 |
|---|---|---|
| CLEAR | PorterDuff.Mode.CLEAR | 所有的图层都不会在画布上展示 |
| SRC | PorterDuff.Mode.SRC | 只显示顶层图层的图像 |
| DST | PorterDuff.Mode.DST | 只显示底层图层的图像 |
| SRC_OVER | PorterDuff.Mode.SRC_OVER | 显示所有图层，顶层图层位于底层图层上面（默认效果） |
| DST_OVER | PorterDuff.Mode.DST_OVER | 显示所有图层，底层图层位于顶层图层上面 |
| SRC_IN | PorterDuff.Mode.SRC_IN | 显示两个图层的交集，顶层图层位于底层图层上面 |
| DST_IN | PorterDuff.Mode.DST_IN | 显示两个图层的交集，底层图层位于顶层图层上面 |
| SRC_OUT | PorterDuff.Mode.SRC_OUT | 显示两个图层的部分非交集，只显示顶层图层的非交集部分 |
| DST_OUT | PorterDuff.Mode.DST_OUT | 显示两个图层的部分非交集，只显示底层图层的非交集部分 |
| SRC_ATOP | PorterDuff.Mode.SRC_ATOP | 显示底层图层和两个图层的交集部分，顶层位于底层图层的上面 |
| DST_ATOP | PorterDuff.Mode.DST_ATOP | 显示顶层图层和两个图层的交集部分，底层图层位于顶层图层上面 |
| XOR | PorterDuff.Mode.XOR | 显示两个图层的完整非交集 |
| DARKEN | PorterDuff.Mode.DARKEN | 显示所有图层，顶层位于底层图层上面，相交部位变暗 |
| LIGHTEN | PorterDuff.Mode.LIGHTEN | 显示所有图层，顶层位于底层图层上面，相交部位变亮 |
| MULTIPLY | PorterDuff.Mode.MULTIPLY | 显示两个图层的交集，颜色变换类似于PS中的“正片叠底”效果 |
| SCREEN | PorterDuff.Mode.SCREEN | 显示两个图层的并集，颜色变换类似于PS中的“滤色”效果 |
| ADD | PorterDuff.Mode.ADD | 显示两个图层的叠加，颜色变换类似于PS中的“正片叠底”效果，使饱和 |
| OVERLAY | PorterDuff.Mode.OVERLAY | 显示两个图层的叠加 |
问题：
- CLEAR 模式下 在Goodle的API Demo中清除所有图层，不知道为什么我这是显示上图层非交集区域。
- DARKEN，LIGHTEN 显示的效果一样的，应该是我设置的颜色的饱和度都满的原因，形成不了差异。
代码实现
//定义一个绘制圆形Bitmap的方法
private Bitmap makeDst(int w, int h) {
Bitmap bm = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bm);
Paint p = new Paint(Paint.ANTI_ALIAS_FLAG);
p.setColor(Color.rgb(255,203,68));
c.drawOval(new RectF(0, 0, w * 3 / 4, h * 3 / 4), p);
return bm;
}
//定义一个绘制矩形的Bitmap的方法
private Bitmap makeSrc(int w, int h) {
Bitmap bm = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bm);
Paint p = new Paint(Paint.ANTI_ALIAS_FLAG);
p.setColor(Color.rgb(103,169,255));
c.drawRect(w / 3, h / 3, w * 19 / 20, h * 19 / 20, p);
return bm;
}
@Overrideprotected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setStyle(Paint.Style.FILL);
// 原上图层
canvas.drawBitmap(srcBitmap, (screenW / 3 - width) / 2, (screenH* 3 / 4 - height) / 2, paint);
// 原下图层
canvas.drawBitmap(dstBitmap, (screenW / 3 - width) / 2 + screenW / 3, (screenH* 3 / 4 - height) / 2, paint);
canvas.drawText("srcBitmap",(screenW / 3 - width) / 2,screenH * 3 / 4,mPaint3);
canvas.drawText("dstBitmap",(screenW / 3 - width) / 2 + screenW / 3,screenH * 3 / 4,mPaint3);
//创建一个图层，在图层上演示图形混合后的效果
int sc = canvas.saveLayer(0, 0, screenW, screenH, null,
Canvas.MATRIX_SAVE_FLAG |
Canvas.CLIP_SAVE_FLAG |
Canvas.HAS_ALPHA_LAYER_SAVE_FLAG |
Canvas.FULL_COLOR_LAYER_SAVE_FLAG |
Canvas.CLIP_TO_LAYER_SAVE_FLAG);
canvas.drawBitmap(dstBitmap, (screenW / 3 - width) / 2 + screenW / 3 * 2, (screenH* 3 / 4 - height) / 2, paint);
//设置Paint的Xfermode
paint.setXfermode(pdXfermode);
canvas.drawBitmap(srcBitmap, (screenW / 3 - width) / 2 + screenW / 3 * 2, (screenH* 3 / 4 - height) / 2, paint);
canvas.drawText(modeStr,(screenW / 3 - width) / 2 + screenW / 3 * 2,screenH * 3 / 4,mPaint3);
paint.setXfermode(null);
// 还原画布
canvas.restoreToCount(sc);
}
总结：
Xfermode很强大，效果格式各样，在一些自定义View中很有用，比如：实现图片的 圆形、矩形裁剪。 所以，我们有必要去掌握它的用法和原理。
DEMO 源码地址