Hello,
I am trying to align an Android view (such as Weviiew) with image target. I cannot use textures with openGL (as illustrated in the Video Playback sample).
With iOS, this can be achieved by applying the transformation matrix to UIView animation layer.
But for Android, I am having a very hard time to get the same result. Here are the steps I am following:
1. obtain transformation matrix by multiplying projection matrix with modelview matrix
2. obtain translate, scale, and rotation by following this algorithm: https://math.stackexchange.com/questions/237369/given-this-transformation-matrix-how-do-i-decompose-it-into-translation-rotati
3. Further decompose the rotation matrix to get axis angles: http://nghiaho.com/?page_id=846
4. Apply translate, scale, and rotation via Android ViewPropertyAnimation
here is my code:
public void updateWebView(final Matrix44F modelViewMatrix, final Matrix44F projectionMatrix, final Size targetSize){ runOnUiThread(new Runnable() { @Override public void run() { float[] modelViewMatrixData = modelViewMatrix.getData();
WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE); Display display = wm.getDefaultDisplay();
android.opengl.Matrix.translateM(modelViewMatrixData, 0, 0.0f, 0.0f, 3.0f); android.opengl.Matrix.multiplyMM(modelViewMatrixData, 0, projectionMatrix.getData(), 0, modelViewMatrixData, 0);
double scaleX = java.lang.Math.sqrt(modelViewMatrixData[0] * modelViewMatrixData[0] + modelViewMatrixData[1] * modelViewMatrixData[1] + modelViewMatrixData[2] * modelViewMatrixData[2]); double scaleY = java.lang.Math.sqrt(modelViewMatrixData[4] * modelViewMatrixData[4] + modelViewMatrixData[5] * modelViewMatrixData[5] + modelViewMatrixData[6] * modelViewMatrixData[6]); double scaleZ = java.lang.Math.sqrt(modelViewMatrixData[8] * modelViewMatrixData[8] + modelViewMatrixData[9] * modelViewMatrixData[9] + modelViewMatrixData[10] * modelViewMatrixData[10]);
double[][] m = {{modelViewMatrixData[0]/scaleX, modelViewMatrixData[4]/scaleY, modelViewMatrixData[8]/scaleZ}, {modelViewMatrixData[1]/scaleX, modelViewMatrixData[5]/scaleY, modelViewMatrixData[9]/scaleZ}, {modelViewMatrixData[2]/scaleX, modelViewMatrixData[6]/scaleY, modelViewMatrixData[10]/scaleZ}};
GLUtilities.Angle angle = GLUtilities.extractAngleFromRotationMatrix(m);
if(counter % 5 == 0) { mXview.animate() .x(modelViewMatrixData[12]) .y(modelViewMatrixData[13]) .scaleX((float) scaleX * targetSize.getWidth() / targetSize.getHeight()) .scaleY((float) scaleY) .rotation(angle.getAz()) .rotationX(-angle.getAx()) .rotationY(angle.getAy()); } counter ++; } }); }
The above code does not result in the right translate and scale. Only the rotation seems correct.
Anybody had similar experience? Am I going down the correct path?
Thanks.
Take a look into Books sample
Take a look into Books sample. There we generate a texture from an android view which is used as an augmentation for the book cover.
Also the matrices we use should work the same way on iOS and Android. We are using the same gl code for android and iOS.