画板效果图

页面代码

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);}@Overrideprotected 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);}@Overridepublic void draw(Canvas canvas) {super.draw(canvas);mCanvas.drawPath(mPath, mPaint);canvas.drawBitmap(mBitmap, 0, 0, null);}@Overridepublic 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);}@Overrideprotected 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); //初始化BitmapmCanvas = new Canvas(mBitmap);mCanvas.drawColor(Color.parseColor("#c0c0c0"));//设置画板背景}@Overrideprotected 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);}@Overridepublic 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);}@Overrideprotected 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); // 初始化bitmapmCanvas = 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);//效果二：背景为图片}@Overrideprotected 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);}@Overridepublic 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的效果

參考链接：Android 自己定义控件实现刮刮卡效果 真的就仅仅是刮刮卡么