2011-03-18 101 views
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(); 

回答

6

您無法通過skew()實現您想要的效果。但是,您可以使用Camera對象和3D旋轉來實現此效果。相機將爲您生成一個矩陣,然後您可以將其應用於畫布上。請注意,結果不會是透視正確的,但足夠滿足您的目的。這是如何在蜂窩的啓動器(和許多其他應用程序)完成3D旋轉。

+0

太棒了!我不知道這件事。 – 2011-03-18 17:14:01

+3

是的,在ApiDemos中有一個例子 - 旋轉3D動畫,它使用Camera類來完成此操作。創建一個新的android項目,並選擇「從現有示例創建項目」,選擇目標os然後ApiDemos。當應用程序運行時,選擇視圖>動畫> 3D轉換 – Lumis 2011-03-18 17:33:14

+0

我不認爲動畫是要走的路。我正在基於恆定的設備傳感器值流(增強現實)操縱畫布上的圖形。有沒有其他方法可以做到這一點?我應該像使用OpenGL一樣使用3D圖形嗎?謝謝。 – mdupls 2011-03-19 19:25:57

1

我不認爲「星球大戰效應」是一個affine transformation,我認爲這是由Matrix支持的唯一操作。

12

我花了很多時間在今天工作(遇到同樣的問題)並提出了下面的代碼。

要注意的是,您需要將preTranslate()和postTranslate()設置爲Canvas區域的中心(或其他位置)。這似乎意味着它默認使用圖像的中心來應用轉換,而不是左上角(x = 0,y = 0)。這就是爲什麼你會得到一個平行四邊形而不是你所期望的,一個梯形(謝謝你教我的名字)。

我選擇的另一件重要的事情是Canvas/Camera上的Save/Restore功能。基本上,如果每次連續調用Rotate函數三次而不恢復狀態,則每次繪製時都會繼續圍繞和旋轉對象。這可能是你想要的,但我當然沒有在我的情況下。同樣適用於畫布,因爲您基本上是將相機對象中的矩陣應用於畫布,並且需要將其重置,否則會發生同樣的情況。

希望這可以幫助別人,這對於初學者來說沒有很好的記錄。提示任何閱讀此內容的人,請查看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();  
} 
+0

這似乎正在跟蹤我想要的。我仍然很難使用方向值(方位角,俯仰角,滾轉角)來轉換矩陣並操作畫布。我試圖獲得類似於股票Android圖庫的效果,圖片似乎在設備左右傾斜時保持固定(基於用戶視圖的方向)。 – mdupls 2011-05-22 03:23:55

+0

這看起來像是一個類似的問題,我只處理位圖和文本。你可以看看這個問題:http://stackoverflow.com/q/32180534/878126 – 2015-08-25 08:07:32