Open tankpower1 opened 4 years ago
any solution?
I had the same problem, I fixed putying a View with the prop onStartShouldSetResponder, it's returns a function that return true value
<Swiper
style={styles.wrapper}
dot={<View style={styles.dot} />}
activeDot={<View style={styles.activeDot} />}>
{imagesFormatedArray.map((image) => (
<View onStartShouldSetResponder={() => true}>
<Image
key={image.imageId}
style={[styles.image, imageStyle]}
source={{
uri: image.uri,
}}
/>
</View>
))}
</Swiper>
I had a similar problem and was blaming this package. Changed to pointerEvents="box-none"
in the right places.
I use solution from https://github.com/leecade/react-native-swiper/issues/698#issuecomment-590179071 . And it works. No more accidental onPress trigger on TouchableOpacity when swiping. You only need to wrap TouchableOpacity inside View with onMoveShouldSetResponderCapture return true.
Example:
const items = new Array(5).fill('Banner ').map((value, index) => `${value}${index + 1}`);
.....
<Swiper
style={{ height: 200 }}
showsButtons={false}
activeDotColor="white"
autoplay>
{items.map((value, index) => {
return (
<View
key={index.toString()}
style={{ flex: 1 }}
onMoveShouldSetResponderCapture={() => true}>
<TouchableOpacity
onPress={this.onItemClicked}
style={{
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: 'royalblue',
}}>
<Text style={{ color: 'white' }}>{value}</Text>
</TouchableOpacity>
</View>
);
})}
</Swiper>
I have a TouchableOpacity with a Swiper as its first child and every time i try to swipe it activates the onPress of the TouchableOpacity. How can i fix this?