mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Hans Halverson
a3d9e91203
Summary: We will soon be enforcing that flow suppressions will only apply when on an error's primary location ([post](https://fb.workplace.com/groups/179614562644215/permalink/559286354677032/)). This diff uses the codemod created in D20008770 to move all suppression comments to their primary locations in the `xplat/js` flow root, and deletes suppression comments that are not on any primary locations. This diff was generated with: ``` ~/fbsource/fbcode/flow/packages/flow-dev-tools/bin/tool suppression-primary-locations --json-file ~/www/errors.json ~/fbsource/xplat/js hg st -n | xargs grep -l -P '@(partially-)?generated' | xargs hg revert hg st -n | xargs grep -l 'format' | xargs prettier --write ``` Changelog: [Internal] bypass-lint Reviewed By: dsainati1 Differential Revision: D20122544 fbshipit-source-id: d94e409aadb18bb399a1ddbf9f3f2494fe4fb54c
108 lines
2.7 KiB
JavaScript
108 lines
2.7 KiB
JavaScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
* @flow strict-local
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
const React = require('react');
|
|
const ReactNative = require('react-native');
|
|
const {Component} = React;
|
|
const {
|
|
StyleSheet,
|
|
Text,
|
|
View,
|
|
Animated,
|
|
Easing,
|
|
TouchableOpacity,
|
|
Dimensions,
|
|
} = ReactNative;
|
|
|
|
class ScrollViewAnimatedExample extends Component<{...}> {
|
|
_scrollViewPos = new Animated.Value(0);
|
|
|
|
startAnimation: () => void = () => {
|
|
this._scrollViewPos.setValue(0);
|
|
Animated.timing(this._scrollViewPos, {
|
|
toValue: 100,
|
|
duration: 10000,
|
|
easing: Easing.linear,
|
|
useNativeDriver: true,
|
|
}).start();
|
|
};
|
|
|
|
render(): React.Node {
|
|
const interpolated = this._scrollViewPos.interpolate({
|
|
inputRange: [0, 1],
|
|
/* $FlowFixMe(>=0.38.0) - Flow error detected during the deployment of
|
|
* v0.38.0. To see the error, remove this comment and run flow */
|
|
outputRange: [0, 0.1],
|
|
});
|
|
const interpolated2 = this._scrollViewPos.interpolate({
|
|
inputRange: [0, 1],
|
|
/* $FlowFixMe(>=0.38.0) - Flow error detected during the deployment of
|
|
* v0.38.0. To see the error, remove this comment and run flow */
|
|
outputRange: ['0deg', '1deg'],
|
|
});
|
|
return (
|
|
<View style={styles.container}>
|
|
<Animated.View
|
|
style={{
|
|
width: 100,
|
|
height: 100,
|
|
backgroundColor: 'black',
|
|
transform: [{translateX: interpolated}, {rotate: interpolated2}],
|
|
}}
|
|
/>
|
|
<Animated.ScrollView
|
|
horizontal
|
|
scrollEventThrottle={16}
|
|
onScroll={Animated.event(
|
|
[{nativeEvent: {contentOffset: {x: this._scrollViewPos}}}],
|
|
{useNativeDriver: true},
|
|
)}>
|
|
<TouchableOpacity onPress={this.startAnimation}>
|
|
<View style={styles.button}>
|
|
<Text>Scroll me horizontally</Text>
|
|
</View>
|
|
</TouchableOpacity>
|
|
</Animated.ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const {width, height} = Dimensions.get('window');
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
backgroundColor: '#F5FCFF',
|
|
},
|
|
button: {
|
|
margin: 50,
|
|
width: width,
|
|
marginRight: width,
|
|
height: height / 2,
|
|
},
|
|
});
|
|
|
|
exports.title = '<ScrollViewAnimated>';
|
|
exports.description = 'Component that is animated when ScrollView is offset.';
|
|
|
|
exports.examples = [
|
|
{
|
|
title: 'Animated by scroll view',
|
|
render: function(): React.Element<typeof ScrollViewAnimatedExample> {
|
|
return <ScrollViewAnimatedExample />;
|
|
},
|
|
},
|
|
];
|