使用 canvas 画出背景图
补充 xfermode
Xfermode 国外有大神称之为过渡模式, 这种翻译比较贴切但恐怕不易理解, 大家也可以直接称之为图像混合模式, 因为所谓的 "过渡" 其实就是图像混合的一种, 这个方法跟我们上面讲到的 setColorFilter 蛮相似的.
查看 API 文档发现其果然有三个子类: AvoidXfermode, PixelXorXfermode 和 PorterDuffXfermode, 这三个子类实现的功能要比 setColorFilter 的三个子类复杂得多.
由于 AvoidXfermode, PixelXorXfermode 都已经被标注为过时了, 所以这次主要研究的是仍然在使用的 PorterDuffXfermode:
该类同样有且只有一个含参的构造方法 PorterDuffXfermode(PorterDuff.Mode mode)
其中的 mode 有十八种模式, 后面谷歌又添加了 Add 和 Overlayl 两种模式, 下面是十六种模式的图解
我们怎么去理解这张图呢? 我们只要记住一点, 先画 dst, 再画 src, 有同学说不好记啊, 简单, 教你个口诀, 先画底 (dst), 再画上 (src)
第一个模式 clear 是清除
第二个 src 则是只显示上层图片
第三个 dst 则是只显示底层图片
第四个 srcOver 如图所示, 显示出 dst 图片的四分之三, 显示 src 的全部
其他的不多说了,
我们即将用到的是 dsc_out, 讲解一下
先画 dst, 再画 src,src 消失, 只剩下 dst, 这其实就是橡皮擦的原理, 我们利用这个擦除遮盖层就可以显示出信息层中的图片了
明白了原理之后, 我们来看 onDraw 方法, 在 onDraw 方法中, 使用 canvas 将背景图画出, 这里顺序是先画信息层, 之后再到遮盖层, 遮盖层将 mBitmap 直接画出来, 回顾一下, 这里是使用到了双缓冲技术, canvas 直接复制了 mBitmap, 在 View 中显示出来, mBitmap 其实是 mCanvas 在上面画出了用户手指的移动痕迹
- canvas.drawBitmap(background,0,0,null);// 画出信息层
- canvas.drawBitmap(mBitmap, 0,0, null);// 画出遮盖层
- mOutterPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));// 设置 xfermode dst\_out
- mCanvas.drawPath(mPath, mOutterPaint);//mCanvas 在 mBitmap 中画出用户的手指的移动痕迹
来源: https://www.cnblogs.com/kexing/p/9502029.html