在Android画布内拖动旋转的文本无法按预期方式工作

Question

我遗漏了一些东西,所以我希望你能分享一些关于我的事.

我在画布里面画了一些文字.为此我有一堂课Word

public class Word {
     private int    x;
     private int    y;
     private String text;
}

该应用程序允许用户旋转文本,我处理旋转 onDraw

protected void onDraw(Canvas canvas) {
    canvas.save(Canvas.MATRIX_SAVE_FLAG);
    canvas.rotate(angle, centerX, centerY)
    ...
    canvas.drawText(word.getText(), word.getX(), word.getY())
    ....
    canvas.restore();
}

我得到的问题是当用户拖动画布并且有一个旋转集时.当角度= 0时,运动按预期进行.

@Override
    public boolean onTouchEvent(MotionEvent event) {
       case MotionEvent.ACTION_DOWN:
            initialX = (int) event.getX();
            initialY = (int) event.getY();
        break;
      case MotionEvent.ACTION_MOVE:
             int currentX = (int) event.getX();
             int currentY = (int) event.getY();
             int xMovement = currentX - initialX;
             int yMovement = currentY - initialY;

            dragWords(xMovement, yMovement);
   .....

并且dragWords对于我所做的每个单词:

private void dragText(int xMovement, int yMovement){
for (Word word : words) {
    word.setX(word.getX() + xMovement);
    word.setY(word.getY() + yMovement);
}
invalidate();

}

当旋转角度为0时,向上/向下/向左/向右移动使得单词移动相同的距离.随着角度变大,单词开始以不同的方向移动,例如在60,它开始向斜上方移动,当180它只向上/向下移动而不是向左/向右移动时.

我想我需要根据角度计算某种差异并将其添加到xMovement/yMovement ......但是我应该怎么做呢？

LE:这是一个关于它如何表现的图像: 蓝线是文本在拖动时移动的方式,而橙色是手指在屏幕上拖动.当角度为0时,它工作得很好,当角度增加时,它开始沿左/右对角移动,而当角度更大时,它只上下移动而不响应左/右

Answer 1

在ellipses以下代码部分：

dragWords(xMovement, yMovement);
.....   <<<--------------------- I hope you are updating initialX and initialY

initialX = currentX;
initialY = currentY;

否则，您的 x 和 y 值将无法与触摸手势期间移动的距离正确对应。

正如用户matiash所指示的，您应该使用Matrix#mapPoints(float[])来转换您的 x 和 y 值。声明并初始化一个 Matrix：

Matrix correctionMatrix;

// Your view's constructor
public MyView() {
    ....
    correctionMatrix = new Matrix();
}

你的样子onDraw(Canvas)应该是这样的：

@Override
protected void onDraw(Canvas canvas) {
    canvas.save(Canvas.MATRIX_SAVE_FLAG);
    canvas.rotate(angle, centerX, centerY);
    ...

    // Neutralize the rotation
    correctionMatrix.setRotate(-angle, centerX, centerY);

    // Initialize a float array that holds the original coordinates
    float[] src = {word.getX(), word.getY()};

    // Load transformed values into `src` array
    correctionMatrix.mapPoints(src);

    // `src[0]` and `src[1]` hold the transformed `X` and `Y` coordinates
    canvas.drawText(word.text, src[0], src[1], somePaint);
    ....
    canvas.restore();
}

这应该会为您提供所需的结果 - X 和 Y 轴上的移动，无论画布旋转如何。

显然，您可以将呼叫移至setRotate(float, float, float)更好的位置。更改值后只需调用一次angle。