[英]React Native panResponderMove get X position of touch
當用戶觸摸圖形容器視圖時,如何在用戶移動手指時獲得手指的X位置? 我懷疑它需要放在onPanResponderMove中:(evt)
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Dimensions,
PanResponder,
TouchableWithoutFeedback,
Animated
} from 'react-native';
var data = [1,2,3,4,5,6];
export default class graph extends Component {
componentWillMount() {
this._panResponder = PanResponder.create({
onPanResponderMove: (evt) => {
},
});
}
render() {
let key = 0;
var Points = data.map(b => {
key = key+1;
return (
<View key={key} style={styles.dataPointContainer}>
</View>
)
});
return (
<View style={styles.container}>
<View style={styles.graphContainer} {...this._panResponder.panHandlers}>
{ Points }
</View>
</View>
);
}
}
var window = Dimensions.get('window');
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
graphContainer: {
borderLeftWidth: 1,
borderBottomWidth: 1,
height: window.height*0.4,
width: window.width*0.9,
flexDirection: "row"
},
dataPointContainer: {
flex: 1/data.length,
borderRightWidth: 0.2
}
});
AppRegistry.registerComponent('graph', () => graph);
嘗試這個:
this._panResponder = PanResponder.create({
onMoveShouldSetPanResponder: (e, gs) => true,
onMoveShouldSetPanResponderCapture: (e, gs) => true,
onPanResponderMove: (e, gs) => {
// X position relative to the page
console.log(e.nativeEvent.pageX);
// The X position of the touch, relative to the element
console.log(e.nativeEvent.positionX);
},
});
記錄在這里: https : //facebook.github.io/react-native/docs/panresponder.html
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.