自定义View练习 - 手写板

自定义View练习 - 手写板

练习来源

自定义控件-使用Canvas绘图定义一个手写板

效果图

主要代码

WriteView.java

public class WriteView extends View {

    //画笔
    private Paint paint;

    //用户触摸的路径
    private Path path;

    public WriteView(Context context) {
        this(context, null);
    }

    public WriteView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public WriteView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    private void init() {
        paint = new Paint();
        paint.setAntiAlias(true); //抗锯齿
        paint.setDither(true); //防抖动
        paint.setColor(Color.BLACK);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeJoin(Paint.Join.ROUND);//设置画笔连接处圆润
        paint.setStrokeWidth(10f);//画笔大小

        path = new Path();

    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        float x = event.getX();
        float y = event.getY();
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                path.moveTo(x,y);
                return true;
            case MotionEvent.ACTION_MOVE:
                path.lineTo(x,y);
                break;
            case MotionEvent.ACTION_UP:
                break;
        }
        postInvalidate();//重绘
        return false;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawPath(path,paint); //绘制路径
    }

    /**
     * 清空路径
     */
    public void reset(){
        path.reset();
        postInvalidate();
    }
}

学习知识

1. 将用户Touch的轨迹存储到Path中. 使用drawPath()来实时绘制.
2. 调用postInvalidate()会进而一步一步的调用的View#onDraw().
3. 在View#onTouchEvent()中MotionEvent.Action_DOWN事件中一定要返回true, 表示接下来的Move,Up事件都有当前View来消费.
4. 清空画布,只需将path清空,重新绘制即可.
5. 使用AndroidStudio快速生成自定义View的构造方法的快捷输入为ViewConstructors.

github: https://github.com/cizkey/CustomPractice/tree/master/WriteView