朋友,我将采用一个父母视图,在视图内我采用一个 TouchableOpacity。我将在主视图上添加 panResponder,当触摸主视图时它工作正常。但是 TouchableOpacity 不起作用,我想删除 TouchableOpacity 上的 panResponder。所以 TouchableOpacity 是有效的。
代码 :
this._panResponder = PanResponder.create({
// Ask to be the responder:
onStartShouldSetPanResponder: (evt, gestureState) => true,
onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
onMoveShouldSetPanResponder: (evt, gestureState) => true,
onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,
onPanResponderGrant: (evt, gestureState) => {
// The gesture has started. Show visual feedback so the user knows
// what is happening!
// gestureState.d{x,y} will be set to zero now
// this.toggleModal()
},
onPanResponderMove: (evt, gestureState) => {
// The most recent move distance is gestureState.move{X,Y}
// The accumulated gesture distance since becoming responder is
// gestureState.d{x,y}
console.log('onPanResponderMove');
},
onPanResponderTerminationRequest: (evt, gestureState) => true,
onPanResponderRelease: (evt, gestureState) => {
// The user has released all touches while this view is the
// responder. This typically means a gesture has succeeded
console.log('onPanResponderRelease');
this.toggleModal()
},
onPanResponderTerminate: (evt, gestureState) => {
// Another component has become the responder, so this gesture
// should be cancelled
console.log('onPanResponderTerminate');
},
onShouldBlockNativeResponder: (evt, gestureState) => {
// Returns whether this component should block native components from becoming the JS
// responder. Returns true by default. Is currently only supported on android.
console.log('onShouldBlockNativeResponder');
return true;
},
});
}
潘在家长视图中添加:
render() {
return (
<View {...this._panResponder.panHandlers}>
<TouchableOpacity onPress={this._onPressButton}>
<Image
style={styles.button}
source={require('./myButton.png')}
/>
</TouchableOpacity>
</View>
);
},
在 mainView 上添加 Pan 时,Button OnPress 事件不起作用。