“This is the third day of my participation in the Gwen Challenge in November. Check out the details: The last Gwen Challenge in 2021.”

First, new a class inherits fromView

public class SignatureView extends View
Copy the code

Custom view, drawing an image with a brush Define the width of a brush slide and also need to track the brush so that the content area can accommodate strokes

private static final float STROKE_WIDTH = 5f;
private static final float HALF_STROKE_WIDTH = STROKE_WIDTH / 2;
Copy the code

Optimize rendering by invalidating the least possible region

private Paint paint = new Paint();
private Path path = new Path();

private float lastTouchX;
private float lastTouchY;
private final RectF dirtyRect = new RectF();
Copy the code

Constructor to initialize the brush

public SignatureView(Context context, AttributeSet attrs) {
    super(context, attrs);

    paint.setAntiAlias(true);
    paint.setColor(Color.BLACK);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeJoin(Paint.Join.ROUND);
    paint.setStrokeWidth(STROKE_WIDTH);
}
Copy the code

Handle gestures and trigger brush paths

@Override
public boolean onTouchEvent(MotionEvent event) {
    float eventX = event.getX();
    float eventY = event.getY();

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            path.moveTo(eventX, eventY);
            lastTouchX = eventX;
            lastTouchY = eventY;
            // There is no end yet, so don't waste cycles invalidating them.
            return true;

        case MotionEvent.ACTION_MOVE:
        case MotionEvent.ACTION_UP:
            // Start following the brush area.
            resetDirtyRect(eventX, eventY);

            // When hardware tracks events faster than they can be delivered
            // Events will contain a history of these skip points.
            int historySize = event.getHistorySize();
            for (int i = 0; i < historySize; i++) {
                float historicalX = event.getHistoricalX(i);
                float historicalY = event.getHistoricalY(i);
                expandDirtyRect(historicalX, historicalY);
                path.lineTo(historicalX, historicalY);
            }

            // After playing back the history, connect the line to the contact.
            path.lineTo(eventX, eventY);
            break;

        default:

            return false;
    }

    // Include half the stroke width to avoid clipping
    invalidate(
            (int) (dirtyRect.left - HALF_STROKE_WIDTH),
            (int) (dirtyRect.top - HALF_STROKE_WIDTH),
            (int) (dirtyRect.right + HALF_STROKE_WIDTH),
            (int) (dirtyRect.bottom + HALF_STROKE_WIDTH));

    lastTouchX = eventX;
    lastTouchY = eventY;

    return true;
}
@Override
protected void onDraw(Canvas canvas) {
    canvas.drawPath(path, paint);
}
Copy the code

Called when lifted to ensure that all paths are included

private void expandDirtyRect(float historicalX, float historicalY) { if (historicalX < dirtyRect.left) { dirtyRect.left = historicalX; } else if (historicalX > dirtyRect.right) { dirtyRect.right = historicalX; } if (historicalY < dirtyRect.top) { dirtyRect.top = historicalY; } else if (historicalY > dirtyRect.bottom) { dirtyRect.bottom = historicalY; }}Copy the code

At this point, handwriting is ready to go, and now it’s time to do some processing

Resetting lastTouchX and lastTouchY during a motion event is set at the end of the action

private void resetDirtyRect(float eventX, float eventY) {
    dirtyRect.left = Math.min(lastTouchX, eventX);
    dirtyRect.right = Math.max(lastTouchX, eventX);
    dirtyRect.top = Math.min(lastTouchY, eventY);
    dirtyRect.bottom = Math.max(lastTouchY, eventY);
}
Copy the code

Remove the signature

What if it’s wrong? There must be a clear signature

public void clear() { path.reset(); // Redraw the entire view invalidate(); }Copy the code

Get the image cache

public Bitmap getBitmapFromView(a){
    this.setDrawingCacheEnabled(true);  // Enable image caching
    buildDrawingCache();  // Build the image cache
    Bitmap bitmap = Bitmap.createBitmap(getDrawingCache()); 
    setDrawingCacheEnabled(false);  // Turn off image caching
    return bitmap;
}
Copy the code

rendering