onScale和Canvas - 如何在缩放图像后调整原点？

Question

我有一个非常简单的测试应用程序,其中包含一个自定义组件MyView.java - 它显示一个可滚动且可伸缩的图像(代表一个类似Scrabble的文字游戏中的棋盘):

1)在我的比例监听器中,我调整比例因子:

public boolean onScale(ScaleGestureDetector detector) {
    mScale *= detector.getScaleFactor();

    // XXX how to adjust mOffsetX and mOffsetY ? XXX

    constrainZoom();
    constrainOffsets();
    invalidate();
    return true;
}

2)然后在我的自定义组件的绘图方法中,我应用了翻译和比例因子:

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    canvas.translate(mOffsetX, mOffsetY);
    canvas.scale(mScale, mScale);
    gameBoard.setBounds(
        0, 
        0, 
        gameBoard.getIntrinsicWidth(),
        gameBoard.getIntrinsicHeight()
    );
    gameBoard.draw(canvas);  
}

不幸的是,用捏手势缩放时似乎有一个小错误 -

我可以看到,缩放后缩放和边界的大小正确,但图像的偏移不是.

当捏合手势的焦点远离屏幕的0点时,问题变得更糟.

用文字描述问题有点困难,但是当你从GitHub检查我的测试项目时你会立即看到它(你可以随时双击以重置偏移量和比例).

这可能是解决它的标准方法的常见问题,但我还没有找到它.

董事会形象是Denelson83的CC BY-SA,代码基于如何通过反弹效果博客支持fling 手势.

Answer 1

您将移动画布两次：第一次使用translate，然后使用scale(sx,sy,px,py);。

您可以将您的焦点与您的偏移量结合起来onScale，然后使用scale(sx,sy).