alexbrillant / react-native-deck-swiper

tinder like react-native deck swiper
ISC License
1.57k stars 464 forks source link

ScrollView is not working inside the Swiper. #302

Closed kalyanijamunkar10 closed 4 years ago

kalyanijamunkar10 commented 4 years ago

@alexbrillant Is there any way to enable scroll inside the card swiper?

hbarylskyi commented 4 years ago

@kalyanijamunkar10 I suggest you look into Swiper.js and find the reason for it :)

hbarylskyi commented 4 years ago

but why do you have the scroll view inside the card?

kalyanijamunkar10 commented 4 years ago

It worked when i used

thame commented 4 years ago

See #165

nescroft commented 3 years ago

i think the issue is actually that the renderOverlayLabel has a width and height of 100% and a flex:1 with absolute position so it is covering the scrollview.. the 'like' and 'nope' is covering the scrollview. at least that is part of the issue. in swiper.js

AnatuGreen commented 2 years ago

If anyone is still having this issue, here is the latest solution in January 2022:

You have to cover the child or childern of the View inside your 'renderCard' with a 'ScrollView' and a TouchableOpacity. See the section of the code below:

.... renderCard = (cards, index) => { return (

  <View style={styles.card}>

  <ScrollView>
  <TouchableOpacity>

   <Text> {cards} </Text>

   </TouchableOpacity>
   </ScrollView>

  </View>
)

}; ....

Remember to disable vertical scrolling first using verticalSwipe={false} if you wish.

Also, to reduce the opacity change on when you scroll, use the activeOpacity prop to manually edit this, like: : <TouchableOpacity activeOpacity={.7}>