通过在自定义视图的onDraw中设置单位矩阵来偏移画布

时间:2013-06-14 02:47:31

标签: java android matrix android-canvas android-custom-view

我通过自定义视图的onDraw方法在我的画布上设置了一个矩阵 canvas.setMatrix(matrix);然后我只使用预定义的颜料绘制网格:

canvas.drawRect(0,0,viewWidth,viewHeight, background);

for(int i=0; i <= nRows; i++){
    canvas.drawLine(0,i*cellHeight, nCols*cellWidth,i*cellHeight,lines);
    canvas.drawLine(i*cellWidth, 0, i*cellWidth, nRows*cellHeight, lines);
    if(i != nRows)
        canvas.drawText(""+i, i*cellWidth, (i+1)*cellHeight, text);
}

由于某种原因,整个画布的偏移量约为单元格高度的1.5倍。知道为什么会发生这种情况或如何解决它?因此,矩阵没有初始化,因此根据文档应该是身份。

非常感谢!

2 个答案:

答案 0 :(得分:6)

我已将此行为缩小到Matrix画布的原View已被视图位置翻译过来。但是,如果您使用MatrixCanvas.getMatrix()获得View.getMatrix(),则这一点并不明显。你将从这些调用中获得单位矩阵。

您看到的画布偏移很可能与View偏离屏幕顶部(状态栏,标题栏等)的高度完全相同。

在此用例和大多数用例中,您使用canvas.concat(matrix)代替canvas.setMatrix(matrix)是正确的。如果您真的需要原始矩阵,我在调试时会做,您必须通过View的{​​{1}}翻译手动对其进行转换:

Window

编辑在评论中回答其他问题:

要变换触摸坐标(或任何屏幕坐标)以匹配int[] viewLocation = new int[2]; mView.getLocationInWindow(viewLocation); mOriginalMatrix.setTranslate(viewLocation[0], viewLocation[1]); 的触摸坐标,只需将所有变换改为Canvas,然后在每帧之前使用该矩阵进行Matrix画画。 (或者你可以像现在一样直接对Canvas.concat()进行所有转换,并在每次绘制后使用Canvas来检索矩阵。它已被弃用,但它有效。)

然后可以使用矩阵将原始网格边界转换为屏幕上绘制的边界。在绘制网格时,你基本上和Canvas.getMatrix(mMyMatrix)做的事情完全相同,将网格的角点转换为屏幕坐标。网格现在与触摸事件处于相同的坐标系中:

Canvas

或者不推荐使用的获取矩阵的方法,它仍然有效,可能需要更少的更改:

private final Matrix mMyMatrix = new Matrix();

// Assumes that the grid covers the whole View.
private final float[] mOriginalGridCorners = new float[] {
    0, 0,                   // top left (x, y)
    getWidth(), getHeight() // bottom right (x, y)
};

private final float[] mTransformedGridCorners = new float[4];

@Override
public boolean onTouchEvent(MotionEvent event) {
    if (/* User pans the screen */) {
        mMyMatrix.postTranslate(deltaX, deltaY);
    }

    if (/* User zooms the screen */) {
        mMyMatrix.postScale(deltaScale, deltaScale);
    }

    if (/* User taps the grid */) {
        // Transform the original grid corners to where they
        // are on the screen (panned and zoomed).
        mMyMatrix.mapPoints(mTransformedGridCorners, mOriginalGridCorners);
        float gridWidth = mTransformedGridCorners[2] - mTransformedGridCorners[0];
        float gridHeight = mTransformedGridCorners[3] - mTransformedGridCorners[1];
        // Get the x and y coordinate of the tap inside the
        // grid, between 0 and 1.
        float x = (event.getX() - mTransformedGridCorners[0]) / gridWidth;
        float y = (event.getY() - mTransformedGridCorners[1]) / gridHeight;
        // To get the tapped grid cell.
        int column = (int)(x * nbrColumns);
        int row = (int)(y * nbrRows);
        // Or to get the tapped exact pixel in the original grid.
        int pixelX = (int)(x * getWidth());
        int pixelY = (int)(y * getHeight());
    }
    return true;
}

@Override
protected void onDraw(Canvas canvas) {
    // Each frame, transform your canvas with the matrix.
    canvas.save();
    canvas.concat(mMyMatrix);
    // Draw grid.
    grid.draw(canvas);
    canvas.restore();
}

答案 1 :(得分:1)

我找到了解决这个问题的方法,如果不是问题的原因。

canvas.setMatrix(matrix);替换行canvas.concat(matrix);就可以了。我认为部分原因在于设置矩阵会根据屏幕高度和宽度而不是视图来更改要计算的画布原点。但是有一些谜团,因为这也神奇地解决了我遇到的其他一些问题。

修改

事实证明,以这种方式执行操作的后果之一是event.getX()方法中的event.getY()onTouchEvent(MotionEvent event)开始返回难以处理的整数。我的自定义视图用于制作可缩放的,可平移的正方形网格,我可以单击它并获取正方形的坐标。使用此方法,我尝试获取点击事件的(x,y)坐标(MotionEvent.ACTION_UP方法中的onTouchEvent个案例)。

我尝试通过

获取x坐标
int x = (int) ((start.x - dspl.x)/(cellWidth*scaleFactor));

我说明了我已经平移了多少屏幕(dspl给出了到目前为止发生的总位移)和我已经放大了它的数量(scaleFactor给出了已发生的总比例) 。但这并没有考虑到哪些连续变焦发生了。

关于如何获得正确坐标的任何好主意?