画板效果图

页面代码

public class ActionerView extends View {
          private Paint mPaint = new Paint();    private Path mPath = new Path();//手指滑动路径    private Canvas mCanvas;//缓存画布    private Bitmap mBitmap;//缓存图片    private float pointX, pointY;//触点坐标    public ActionerView(Context context, AttributeSet attrs) {        super(context, attrs);    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int width = getMeasuredWidth();        int height = getMeasuredHeight();        initPaint();//初始化画笔        mBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);        mCanvas = new Canvas(mBitmap);    }    @Override    public void draw(Canvas canvas) {        super.draw(canvas);        mCanvas.drawPath(mPath, mPaint);        canvas.drawBitmap(mBitmap, 0, 0, null);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        pointX = event.getX();        pointY = event.getY();        switch (event.getAction()) {            case MotionEvent.ACTION_DOWN:                mPath.moveTo(pointX, pointY);//将路径移动到点(pointX, pointY)，不绘制                break;            case MotionEvent.ACTION_MOVE:                mPath.lineTo(pointX, pointY);//绘制一条从上个触点到点(pointX, pointY)的线条                break;        }        invalidate();//又一次画图        return true;    }    private void initPaint() {
     //初始化画笔        mPaint.setDither(true);//图片抖动处理        mPaint.setAntiAlias(true);        mPaint.setStrokeWidth(20);        mPaint.setStyle(Paint.Style.STROKE);        mPaint.setStrokeCap(Paint.Cap.ROUND);//设置笔头为圆角        mPaint.setStrokeJoin(Paint.Join.ROUND);    }}

橡皮擦效果图

页面代码

public class ActionView extends View {
          private Paint mPaint = new Paint();    private Path mPath = new Path();//手指滑动路径    private Canvas mCanvas;//缓存画布    private Bitmap mBitmap;//缓存图片    private float pointX, pointY;//触点坐标    public ActionView(Context context, AttributeSet attrs) {        super(context, attrs);    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int width = getMeasuredWidth();        int height = getMeasuredHeight();        initPaint();//初始化画笔        mBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); //初始化Bitmap        mCanvas = new Canvas(mBitmap);        mCanvas.drawColor(Color.parseColor("#c0c0c0"));//设置画板背景    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Bitmap mBackBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.bg);        canvas.drawBitmap(mBackBitmap, 0, 0, null);        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));        mCanvas.drawPath(mPath, mPaint);        canvas.drawBitmap(mBitmap, 0, 0, null);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        pointX = event.getX();        pointY = event.getY();        switch (event.getAction()) {            case MotionEvent.ACTION_DOWN:                mPath.moveTo(pointX, pointY);//将路径移动到点(pointX, pointY)。不绘制                break;            case MotionEvent.ACTION_MOVE:                mPath.lineTo(pointX, pointY);//绘制一条从上个触点到点(pointX, pointY)的线条                break;        }        invalidate();//又一次画图        return true;    }    private void initPaint() {
     //初始化画笔        mPaint.setDither(true);//设定是否使用图像抖动处理。会使绘制出来的图片颜色更加平滑和饱满，图像更加清晰        mPaint.setAntiAlias(true);//设置抗锯齿        mPaint.setStrokeWidth(30);        mPaint.setColor(Color.RED);//设置画笔颜色        mPaint.setStyle(Paint.Style.STROKE);        mPaint.setStrokeCap(Paint.Cap.ROUND);        mPaint.setStrokeJoin(Paint.Join.ROUND);//圆角        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST));    }}

刮刮乐效果图

页面代码

public class ActionersView extends View {
          private Paint mPaint = new Paint();    private Paint txtPaint = new Paint();//文字画笔    private Path mPath = new Path();//手指滑动路径    private Canvas mCanvas;//缓存画布    private Bitmap mBitmap;//缓存图片    private float pointX, pointY;//触点坐标    private String txtStr = "￥5,000,000";    public ActionersView(Context context, AttributeSet attrs) {        super(context, attrs);    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int width = getMeasuredWidth();        int height = getMeasuredHeight();        mBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); // 初始化bitmap        mCanvas = new Canvas(mBitmap);        initPaint();//初始化画笔//        mCanvas.drawRoundRect(new RectF(100, 500, width - 100, height - 500), 30, 30, mPaint);//效果一：背景为灰色的矩形        mCanvas.drawBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.bg1), null, new RectF(100, 500, width - 100, height - 500), null);//效果二：背景为图片    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        txtPaint.setTextSize(60);        canvas.drawText(txtStr, getWidth() / 2 - 150, getHeight() / 2, txtPaint);        mCanvas.drawPath(mPath, mPaint);        canvas.drawBitmap(mBitmap, 0, 0, null);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        pointX = event.getX();        pointY = event.getY();        switch (event.getAction()) {            case MotionEvent.ACTION_DOWN:                mPath.moveTo(pointX, pointY);//将路径移动到点(pointX, pointY)，不绘制                break;            case MotionEvent.ACTION_MOVE:                mPath.lineTo(pointX, pointY);//绘制一条从上个触点到点(pointX, pointY)的线条                break;        }        invalidate();//又一次画图        return true;    }    private void initPaint() {
     //初始化画笔        mPaint.setDither(true);        mPaint.setAntiAlias(true);        mPaint.setStrokeWidth(30);        mPaint.setStyle(Paint.Style.STROKE);        mPaint.setStrokeCap(Paint.Cap.ROUND);        mPaint.setStrokeJoin(Paint.Join.ROUND);        mPaint.setColor(Color.parseColor("#c0c0c0"));        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));    }}

附：Xfermode的效果

參考链接：