Summary:
This diff formats the Java class files inside xplat/js/react-native-github. Since google-java-format was enabled in D16071401 we want to codemode the existing code so that users don't have to deal with formatter lint noise at diff-time.
```arc f --paths-cmd 'hg files -I "**/*.java"'```
drop-conflicts
Reviewed By: cpojer
Differential Revision: D16071725
fbshipit-source-id: fc6e3852e45742c109f0c5ac4065d64201c74204
Summary:
Prior to this commit React Native on Android was not properly setting
the transform's scale properly correctly when setting it to 0. In order
to properly set one would need to use values close to 0, like 0.0001.
This was happing due to BaseViewManager sharing sMatrixDecompositionContext
across all views in a React Native app.
In some cases the decomposeMatrix() method from the MatrixMathHelper would
return early and not set any new values in sMatrixDecompositionContext
(this is, the new transform values) and
since this is a shared object the BaseViewManager would set the transform values
from the a previous transform.
In order to prevent this issue, before setting the new transform values
always reset the sMatrixDecompositionContext values.
## Changelog
[Android] [Fixed] - Reset sMatrixDecompositionContext before applying transformations
Pull Request resolved: https://github.com/facebook/react-native/pull/25438
Test Plan:
Run the code below on an Android device/emulator and you should see the following results:
### Android without the patch - current implementation
Notice that the scale 0 is not properly applied to the last rectangle and the second rectangle does not animate properly.
### Android with the patch
Everything works fine
### iOS - current implementation
Everything works fine
```javascript
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* format
* flow
*/
import React from 'react';
import { Animated, Button, StyleSheet, View, Text, SafeAreaView } from 'react-native';
const HorizontalContainer = ({ children, title }) => (
<View style={styles.horizontalContainer}>
{children}
<Text style={styles.text}>{title}</Text>
</View>
);
const App = () => {
const animValue1 = React.useRef(new Animated.Value(1)).current;
const animValue2 = React.useRef(new Animated.Value(1)).current;
const onStartAnim = React.useCallback(() => {
animValue1.setValue(0);
animValue2.setValue(0);
Animated.sequence([
Animated.timing(animValue1, {
toValue: 1,
duration: 300,
useNativeDriver: true,
}),
Animated.timing(animValue2, {
toValue: 1,
delay: 700,
duration: 300,
useNativeDriver: true,
})
]).start();
}, [animValue1, animValue2]);
return (
<SafeAreaView style={styles.container}>
<Button title="Start Animation" onPress={onStartAnim} />
<HorizontalContainer title="Animated scale from 0 to 1">
<Animated.View style={[styles.view, { transform: [{ scaleX: animValue1 }] }]} />
</HorizontalContainer>
<HorizontalContainer title="Animated scale from 0 to 1 - delayed">
<Animated.View style={[styles.view, { transform: [{ scaleX: animValue2 }] }]} />
</HorizontalContainer>
<HorizontalContainer title="Scale 0.4">
<View style={[styles.view, { transform: [{ scaleX: 0.4 }] }]} />
</HorizontalContainer>
<HorizontalContainer title="Scale 0.2">
<View style={[styles.view, { transform: [{ scaleX: 0.2 }] }]} />
</HorizontalContainer>
<HorizontalContainer title="Scale 0">
<View style={[styles.view, { transform: [{ scaleX: 0 }, { translateY: 100 }] }]} />
</HorizontalContainer>
</SafeAreaView>
);
};
export default App;
const styles = StyleSheet.create({
text: {
fontSize: 10,
color: 'black',
marginLeft: 10,
},
horizontalContainer: {
justifyContent: 'center',
alignItems: 'center',
flex: 1,
flexDirection: 'row',
},
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
view: {
width: 100,
height: 100,
backgroundColor: 'indigo',
marginVertical: 5,
}
});
```
Closes https://github.com/facebook/react-native/issues/25205
Closes https://github.com/facebook/react-native/issues/6278
Closes https://github.com/facebook/react-native/issues/6278
Differential Revision: D16071126
Pulled By: cpojer
fbshipit-source-id: 50820229db2e3c22cf6296831413d26b42f57070
Summary: Adds copyright headers to all files that are missing them.
Reviewed By: hramos
Differential Revision: D12837494
fbshipit-source-id: 6330a18919676dec9ff2c03b7c9329ed9127d930
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:
Android:
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
Summary:
According to #11992 fix skew transform in native code as well
janicduplessis vjeux
Closes https://github.com/facebook/react-native/pull/12106
Differential Revision: D4479880
fbshipit-source-id: d84780842b555f6352d84d229b5b6c5c3c6a0647
Summary:
In #7916 I moved transform matrix decomposition logic from JS to java. The next step is to accept list of transforms instead oftransform matrix as a transform ReactProp. This way there is no extra processing required on JS side for the transform param (at least for android now) and this on the other hand allow us to execute transform updates (through offloaded animation) solely on the UI thread.
After this change there is a whole bunch of stuff from `Libraries/Utilities/MatrixMath.js` that can be deleted (methods like: determinant, inverse, transpose). Although astreet mentioned under one of my previous commits that the code is still being referenced internally at fb, so I decided not to delete it here.
**Test plan (required)**
Run UIExplorer Transform example before and after - compare the results
Run android unit test: com.facebook.react.uimanager.MatrixMathHelperTest
Closes https://github.com/facebook/react-native/pull/8892
Differential Revision: D3676017
Pulled By: astreet
fbshipit-source-id: 5275e30805a85c12c89bea44e8b3a2b2ec7b33fa
Summary:
This diff translates implementation of transform matrix decomposition from JS to java. This is to support offloading animations of transform property, in which case it is required that we can calculate decomposed transform in the UI thread.
Since the matrix decomposition code is not being used for other platform I went ahead and deleted parts that are no longer being used.
**Test plan**
Run UIExplorer Transform example before and after - compare the results
Closes https://github.com/facebook/react-native/pull/7916
Reviewed By: ritzau
Differential Revision: D3398393
Pulled By: astreet
fbshipit-source-id: 9881c3f565e2050e415849b0f76a0cefe11c6afb
Oleksandr Melnykov
Guilherme Iscaro
Tim Yung
Krzysztof Magiera
Max Graey
Krzysztof Magiera
