kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-04-03 09:35:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix rotation matrix decomposition.

Browse Source 
Summary:
This PR fixes an issue with rotation decomposition matrix on android.

The issue can be illustrated with this sample code https://snack.expo.io/r1SHEJpVb

It surfaces when we have non-zero rotation in Y or X axis and when rotation Z is greater than 90deg or less than -90deg. In that case the decomposition code doesn't give a valid output and as a result the view gets rotated by 180deg in Z axis.

You may want to run the code linked above on android and iOS to see the difference. Basically the example app renders first image rotated only by 89deg and the next one by 91deg. As a result you should see the second view being pivoted just slightly more than the first image. Apparently on android the second image is completely flipped:

iOS:
![screen shot 2017-07-07 at 12 40 30](https://user-images.githubusercontent.com/726445/27954719-7cf6d02c-6311-11e7-9104-5c3cc8e9b9c1.png)

Android:
![screen shot 2017-07-07 at 12 41 21](https://user-images.githubusercontent.com/726445/27954737-981f57e8-6311-11e7-8c72-af1824426c30.png)

The bug seemed to be caused by the code that decomposes the matrix into axis angles. It seems like that whole code has been overly complicated and we've been converting matrix first into quaternion just to extract angles. Whereas it is sufficient to extract angles directly from rotation matrix as described here: http://nghiaho.com/?page_id=846

This formula produces way simpler code and also gives correct result in the aforementioned case, so I decided not to debug quaternion code any further.

sidenote: New formula's y angle output range is now -90 to 90deg hence changes in tests.
Closes https://github.com/facebook/react-native/pull/14888

Reviewed By: astreet

Differential Revision: D5414006

Pulled By: shergin

fbshipit-source-id: 2e0a68cf4b2a9e32f10f6bfff2d484867a337fa3
This commit is contained in:
Krzysztof Magiera
2017-07-17 18:22:17 -07:00
committed by Facebook Github Bot
parent c678f9c641
commit b60a8dc6b9
3 changed files with 31 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ReactAndroid/src/test/java/com/facebook/react/uimanager/BUCK
View File

@@ -4,7 +4,7 @@ rn_robolectric_test(
name = "uimanager",
# TODO Disabled temporarily until Yoga linking is fixed t14964130
# srcs = glob(['**/*.java']),
srcs = ["SimpleViewPropertyTest.java"],
srcs = ["SimpleViewPropertyTest.java", "MatrixMathHelperTest.java"],
# Please change the contact to the oncall of your team
contacts = ["oncall+fbandroid_sheriff@xmail.facebook.com"],
visibility = [

29
ReactAndroid/src/test/java/com/facebook/react/uimanager/MatrixMathHelperTest.java
View File

@@ -36,6 +36,20 @@ public class MatrixMathHelperTest {
assertThat(ctx.rotationDegrees).containsSequence(rotX, rotY, rotZ);
}
private void verifyRotatedMatrix(double degreesX, double degreesY, double degreesZ, double rotX, double rotY, double rotZ) {
MatrixMathHelper.MatrixDecompositionContext ctx =
new MatrixMathHelper.MatrixDecompositionContext();
double[] matrixX = createRotateX(degreesToRadians(degreesX));
double[] matrixY = createRotateY(degreesToRadians(degreesY));
double[] matrixZ = createRotateZ(degreesToRadians(degreesZ));
double[] matrix = MatrixMathHelper.createIdentityMatrix();
MatrixMathHelper.multiplyInto(matrix, matrix, matrixX);
MatrixMathHelper.multiplyInto(matrix, matrix, matrixY);
MatrixMathHelper.multiplyInto(matrix, matrix, matrixZ);
MatrixMathHelper.decomposeMatrix(matrix, ctx);
assertThat(ctx.rotationDegrees).containsSequence(rotX, rotY, rotZ);
}
@Test
public void testDecomposing4x4MatrixToProduceAccurateZaxisAngles() {
@@ -82,17 +96,17 @@ public class MatrixMathHelperTest {
@Test
public void testDecomposing4x4MatrixToProduceAccurateYaxisAngles() {
double[] angles = new double[]{30, 45, 60, 75, 90, 100, 110, 120, 133, 167};
double[] angles = new double[]{30, 45, 60, 75, 90};
for (double angle : angles) {
verifyYRotatedMatrix(angle, 0d, angle, 0d);
verifyYRotatedMatrix(-angle, 0d, -angle, 0d);
}
// all values are between 0 and 180;
// all values are between -90 and 90;
// change of sign and direction in the third and fourth quadrant
verifyYRotatedMatrix(222, 0d, -138d, 0d);
verifyYRotatedMatrix(222, -180d, -42d, -180d);
verifyYRotatedMatrix(270, 0d, -90d, 0d);
verifyYRotatedMatrix(270, -180d, -90d, -180d);
verifyYRotatedMatrix(360, 0d, 0d, 0d);
}
@@ -114,6 +128,13 @@ public class MatrixMathHelperTest {
verifyXRotatedMatrix(360, 0d, 0d, 0d);
}
@Test
public void testDecomposingComplex4x4MatrixToProduceAccurateAngles() {
verifyRotatedMatrix(10, -80, 0, 10, -80, 0);
// x and y will filp
verifyRotatedMatrix(10, -95, 0, -170, -85, -180);
}
private static double degreesToRadians(double degrees) {
return degrees * Math.PI / 180;
}