需求

刮开浮层显示奖品
没有中奖:显示遗憾没有中奖
中奖:显示奖品名字
刮开后与后台进行数据交互,告知后台是否中奖

原理

画浮层,然后利用Paint可以与现有cancve进行交互,来实现擦除浮层的效果
paint.setXfermode(Xfermode object);

代码

package com.treevc.lixiaoxuedemo;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.Xfermode;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;

/**
 * Created by xxli on 10/9/16.
 */
public class ScratchView extends View {
    private Paint mashPaint;
    private Paint eraserPaint;
    private Canvas mMashCanvas;
    private Bitmap mBitmap;
    private float mStartX;
    private float mStartY;
    private Path mPath;

    public ScratchView(Context context) {
        super(context);
        init(null);
    }

    public ScratchView(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.ScratchView);
        init(array);
    }

    public ScratchView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.ScratchView);
        init(array);
    }



    public ScratchView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        this(context, attrs, defStyleAttr);
    }

    private void init(TypedArray array) {
        if(array != null){

        }

        mashPaint = new Paint();
        mashPaint.setAntiAlias(true);
        mashPaint.setColor(Color.GRAY);
        mashPaint.setStyle(Paint.Style.FILL);
        eraserPaint = new Paint();
        eraserPaint.setAntiAlias(true);
        eraserPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
        eraserPaint.setColor(Color.RED);
        eraserPaint.setStrokeCap(Paint.Cap.ROUND);//设置笔尖形状，让绘制的边缘圆滑
        eraserPaint.setStyle(Paint.Style.STROKE); //必须指定,不然画path画不了
        eraserPaint.setStrokeWidth(20);
        mPath = new Path();
        createMashBitmap();
    }

    private void createMashBitmap() {
        mBitmap = Bitmap.createBitmap(mashBitMap.getWidth(), mashBitMap.getHeight(), Bitmap.Config.ARGB_8888);
        mMashCanvas = new Canvas(mBitmap);
        Rect rect = new Rect(0,0,mashBitMap.getWidth(),mashBitMap.getHeight());
        Paint paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setStyle(Paint.Style.FILL);
        mMashCanvas.drawRect(rect, paint);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(mBitmap, 0, 0, mashPaint);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                mStartX = event.getX();
                mStartY = event.getY();
                startEraser();
                break;
            case MotionEvent.ACTION_MOVE:
                eraser(event.getX(),event.getY());
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                endEraser();
                break;
        }
        return true;
    }

    private void endEraser() {
        mPath.reset();
    }
    private void startEraser() {
        mPath.moveTo(mStartX,mStartX);
    }

    private void eraser(float x, float y) {
        //TODO: 10/10/16
        //滚动了
        float dx = Math.abs(x - mStartX);
        float dy = Math.abs(y - mStartY);
        Log.i("ScratchView", "dx:" + dx + "dy" + dy);
        if(dx > 10 || dy > 10){
            mStartY = y;
            mStartX = x;
            mPath.lineTo(x,y);
            mMashCanvas.drawPath(mPath,eraserPaint);
            mPath.moveTo(mStartX,mStartY);
        }
    }
}

在进一步,图层样子不是单纯的颜色,画图片就好

private void createMashBitmap() {
        mashBitMap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_member_vertificate);
        mBitmap = Bitmap.createBitmap(mashBitMap.getWidth(), mashBitMap.getHeight(), Bitmap.Config.ARGB_8888);
        mMashCanvas = new Canvas(mBitmap);
        Rect rect = new Rect(0,0,mashBitMap.getWidth(),mashBitMap.getHeight());
        Paint paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setStyle(Paint.Style.FILL);
        mMashCanvas.drawBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.ic_member_vertificate),0,0,paint);
    }