8

我想歪斜（如果这不是正确的词，请纠正我）位图，使其看起来有深度。可视化我所要求的一个好方法是星球大战的学分如何倾斜以显示深度。

我尝试了以下方法：

canvas.getMatrix().postSkew(kx,ky,px,py);

和

canvas.skew(sx,sy);

但我没有取得太大的成功。上述方法似乎总是将位图转换为平行四边形。有没有办法将位图转换为梯形？

这是我从 Romain 指出的示例中提取的代码片段。

canvas.rotate(-mOrientation[0] + mHeading, mCenterX, mCenterY);

camera.save();

if (mReverse) {
    camera.translate(0.0f, 0.0f, mDepthZ * interpolatedTime);
} else {
    camera.translate(0.0f, 0.0f, mDepthZ * (1.0f - interpolatedTime));
}

camera.rotateX(mOrientation[1]);
camera.applyToCanvas(canvas);
canvas.drawPath(mPath, mPaint);
canvas.drawCircle(mCenterX, mCenterY, mRadius - 37, mPaint);

camera.restore();
4

3 回答 3

13

我今天花了很多时间来解决这个问题（遇到了同样的问题）并想出了下面的代码。

需要注意的关键点是，您需要将 preTranslate() 和 postTranslate() 设置为 Canvas 区域的中心（或其他地方）。这似乎意味着它使用图像的中心来应用转换，而不是默认情况下的左上角 (x=0,y=0)。这就是为什么你会得到一个平行四边形而不是你所期望的梯形（谢谢你教我这些名字）。

我捡到的另一件重要的事是画布/相机上的保存/恢复功能。基本上，如果您连续调用 Rotate 函数 3 次而不每次都恢复状态，那么您将在每次绘制时不断旋转对象。这可能是你想要的，但在我的情况下我当然没有。同样适用于画布，因为您基本上是将相机对象中的矩阵应用到画布上，并且需要重置它，否则会发生同样的事情。

希望这可以帮助某人，这对于初学者来说没有很好的记录。提示阅读本文的任何人，请查看 SDK 示例中的 APIDemos 文件夹。还有一个 Rotate3dAnimation.java 文件也演示了这一点。

//Snippet from a function used to handle a draw
mCanvas.save(); //save a 'clean' matrix that doesn't have any camera rotation in it's matrix
ApplyMatrix(); //apply rotated matrix to canvas
Draw(); //Does drawing
mCanvas.restore(); //restore clean matrix
//    

public void ApplyMatrix() {
  mCamera.save();
  mCamera.rotateX(-66);
  mCamera.rotateY(0);
  mCamera.rotateZ(0);
  mCamera.getMatrix(mMatrix);

  int CenterX = mWidth / 2;
  int CenterY = mHeight / 2; 
  mMatrix.preTranslate(-CenterX, -CenterY); //This is the key to getting the correct viewing perspective
  mMatrix.postTranslate(CenterX, CenterY); 

  mCanvas.concat(mMatrix);
  mCamera.restore();    
}
于 2011-05-19T04:38:57.187 回答
6

使用 skew() 无法达到您想要的效果。但是，您可以使用 Camera 对象和 3D 旋转来实现此效果。相机将为您生成一个矩阵，然后您可以将其应用到画布上。请注意，结果不会是透视正确的，但足以满足您的目的。例如，这是在 Honeycomb 的 Launcher（以及许多其他应用程序）中完成 3D 旋转的方式。

于 2011-03-18T17:11:56.837 回答
1

我不认为“星球大战效应”是仿射变换，我认为这是唯一支持的操作Matrix。

于 2011-03-18T15:44:51.193 回答