React Native: Disabling ScrollView's scroll when pressing on a nested View element

Viewed 261

I am using a ScrollView to enable multiple pages in my application. On one page, I am trying to implement a custom made slider. However, I am facing problems as any sliding motion triggers the ScrollView to start changing pages.

In pseudo-code, it is something like this:

<ScrollView horizontal={true}>
    <View style={styles.page}><Text>First Page</Text></View>

    <View style={styles.page}>
         <View style={styles.slider}>
              <View style={styles.sliderRange}>
              </View>
         </View>
    </View>
</ScrollView>

How can I disable this scroll when touching my custom Slider Range? I could probably manually reverse the ScrollView's scrolling effect by calculating and reversing X, but that seems like unnecessary effort.

Thanks!

0 Answers
Related