Android刮刮卡效果实现代码

本文实例为大家分享了android刮刮卡效果，供大家参考，具体内容如下

android实现底层一张图片，上层一个遮罩层，触摸滑动按手指滑动路径实现去除遮罩效果，类似于抽奖的刮刮卡一样，不多说先上张效果图：

直接上代码：

xfermodeview.java 

/** 
 * created by 57 on 2016-4-21. 
 */ 
public class xfermodeview extends view{ 
 private bitmap mbgbitmap,mfgbitmap; 
 private paint mpaint; 
 private canvas mcanvas; 
 private path mpath; 
 
 public xfermodeview(context context) { 
 super(context); 
 init(); 
 } 
 
 
 public xfermodeview(context context, attributeset attrs) { 
 super(context, attrs); 
 init(); 
 } 
 
 public xfermodeview(context context, attributeset attrs, int defstyleattr) { 
 super(context, attrs, defstyleattr); 
 init(); 
 } 
 
 @override 
 protected void ondraw(canvas canvas) { 
 
 canvas.drawbitmap(mbgbitmap,0,0,null); 
 canvas.drawbitmap(mfgbitmap,0,0,null); 
 } 
 
 
 private void init() { 
 mpaint = new paint(); 
 mpaint.setalpha(0); 
 mpaint.setxfermode(new porterduffxfermode(porterduff.mode.dst_in)); 
 mpaint.setstyle(paint.style.stroke); 
 mpaint.setstrokejoin(paint.join.round); 
 mpaint.setstrokewidth(50); 
 mpaint.setstrokecap(paint.cap.round); 
 mpath = new path(); 
 mbgbitmap = bitmapfactory.decoderesource(getresources(), r.drawable.test5); 
 mfgbitmap = bitmap.createbitmap(mbgbitmap.getwidth(),mbgbitmap.getheight(),bitmap.config.argb_8888); 
 mcanvas = new canvas(mfgbitmap); 
 mcanvas.drawcolor(color.gray); 
 
 } 
 
 @override 
 public boolean ontouchevent(motionevent event) { 
 switch(event.getaction()){ 
  case motionevent.action_down: 
  mpath.reset(); 
  mpath.moveto(event.getx(),event.gety()); 
  break; 
  case motionevent.action_move: 
  mpath.lineto(event.getx(),event.gety()); 
  break; 
 } 
 mcanvas.drawpath(mpath,mpaint); 
 invalidate(); 
 return true; 
 } 
} 

xfermode有三个子类 :
avoidxfermode  指定了一个颜色和容差，强制paint避免在它上面绘图(或者只在它上面绘图)。
pixelxorxfermode  当覆盖已有的颜色时，应用一个简单的像素异或操作。
porterduffxfermode  这是一个非常强大的转换模式，使用它，可以使用图像合成的16条porter-duff规则的任意一条来控制paint

如何与已有的canvas图像进行交互。

从上面我们可以看到porterduff.mode为枚举类,一共有16个枚举值:
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
  取两图层全部区域，交集部分变为透明色

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。