how to fix the wrong coordinates of zoomed canvas in Android

问题

I have a custom paint_view that extends image_view and is zoommalble with matrix. i set this matrix for canvas and scale it and drag it by this matrix, but after canvas scale or translate, paths or drawable objects were drew in wrong coordinates. i have trid to set the coordinates, but i dont know optimized way to it set.
here is my code:

public class PaintView extends View {


private Path     drawPath;
private Paint    drawPaint;
private Paint    rect_paint;
public boolean   zoomMode    = false;
private Matrix   matrix      = new Matrix();
private Matrix   savedMatrix = new Matrix();
float            oldDist;
PointF           start       = new PointF();
PointF           mid         = new PointF();

static final int NONE        = 0;
static final int DRAG        = 1;
static final int ZOOM        = 2;
int              mode        = NONE;


public PaintView(Context context) {
    super(context);
}


public PaintView(Context context, AttributeSet attrs) {
    super(context, attrs);
    setupDrawing();
}


public PaintView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
}


private void setupDrawing() {
    drawPath = new Path();
    drawPaint = new Paint();
    drawPaint.setColor(Color.BLACK);
    drawPaint.setAntiAlias(true);
    drawPaint.setStyle(Paint.Style.STROKE);
    drawPaint.setStrokeJoin(Paint.Join.ROUND);
    drawPaint.setStrokeCap(Paint.Cap.ROUND);
    drawPaint.setStrokeWidth(10);
    rect_paint = new Paint();
    rect_paint.setColor(Color.BLACK);
    rect_paint.setAntiAlias(true);
    rect_paint.setStyle(Paint.Style.STROKE);
    rect_paint.setStrokeJoin(Paint.Join.ROUND);
    rect_paint.setStrokeCap(Paint.Cap.ROUND);
    rect_paint.setStrokeWidth(20);
}


protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    canvas.setMatrix(matrix);
    canvas.drawRect(0, 0, canvas.getWidth(), canvas.getHeight(), rect_paint);
    canvas.drawPath(drawPath, drawPaint);
}


public boolean onTouchEvent(MotionEvent event) {
    if (zoomMode) {
        switch (event.getAction() & MotionEvent.ACTION_MASK) {
            case MotionEvent.ACTION_DOWN:
                savedMatrix.set(matrix);
                start.set(event.getX(), event.getY());
                mode = DRAG;
                break;
            case MotionEvent.ACTION_POINTER_DOWN:
                oldDist = spacing(event);
                if (oldDist > 10f) {
                    savedMatrix.set(matrix);
                    midPoint(mid, event);
                    mode = ZOOM;
                }
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_POINTER_UP:
                mode = NONE;
                break;
            case MotionEvent.ACTION_MOVE:
                if (mode == DRAG) {
                    matrix.set(savedMatrix);
                    matrix.postTranslate(event.getX() - start.x,
                            event.getY() - start.y);
                }
                else if (mode == ZOOM) {
                    float newDist = spacing(event);
                    if (newDist > 10f) {
                        matrix.set(savedMatrix);
                        float scale = newDist / oldDist;
                        matrix.postScale(scale, scale, mid.x, mid.y);
                    }
                }
                break;

        }
    } else {
        float touchX = event.getX();
        float touchY = event.getY();
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                drawPath.moveTo(touchX, touchY);
                break;
            case MotionEvent.ACTION_MOVE:
                drawPath.lineTo(touchX, touchY);
                break;
            case MotionEvent.ACTION_UP:
                drawPath.lineTo(touchX, touchY);
                break;
        }
    }
    invalidate();
    return true;
}


private float spacing(MotionEvent event) {
    float x = event.getX(0) - event.getX(1);
    float y = event.getY(0) - event.getY(1);
    return FloatMath.sqrt(x * x + y * y);
}


private void midPoint(PointF point, MotionEvent event) {
    float x = event.getX(0) + event.getX(1);
    float y = event.getY(0) + event.getY(1);
    point.set(x / 2, y / 2);
}}

回答1:

just need to convert the screen coordinates to the modified canvas coordinates:

//If i have moved(transleted) the canvas: TouchX = TouchX-translatedX; TouchY=TouchY - translatedY;

// if i have scale the canvas: TouchX = TouchX/scaleFactor; TouchY = TouchY/scaleFactor;

//if i have translated and moved the canvas: TouchX= (TouchX-translatedX)/scaleFactor; TouchY = (TouchY-translatedY)/scaleFactor;

//And then we should draw with this TouchX and TouchY.

来源：https://stackoverflow.com/questions/58116457/how-to-fix-the-wrong-coordinates-of-zoomed-canvas-in-android