I have a horizontal ScrollView with paging enabled and each page is vertical FlatList.

Often, when users try to scroll down on FlatList, horizontal scroll happens and they end up on next ScrollView page.

Is there a way to configure ScrollView sensitivity so it triggers only when horizontal drag is larger, if that makes sense?

I've already looked into documentation, but haven't found anything.

<ScrollView
    ref={swiperRef}
    horizontal={true}
    decelerationRate={'normal'}
    snapToInterval={screenWidth} 
    snapToAlignment={'center'}
    pagingEnabled={true}
    disableIntervalMomentum={true}
    >
    {categories.map((category, index) => {
        return (
            <View key={category?.code}>
               <FlatList
                  data={categories[index]}
                  renderItem={renderBox}
                  keyExtractor={(item, index) => index}
                  contentContainerStyle={styles.categoryNewsContainer}
                  onEndReached={({ distanceFromEnd }) => {
                    loadMore()
                  }}
                  onEndReachedThreshold={0.1}
                  onRefresh={() => refresh()}
                  refreshing={isRefreshing}
                />
            </View>
                )
    })}
</ScrollView>

CodePudding user response：

I had a similar problem, but with the vertical scrolling being too sensitive. This was my solution in native Android, so maybe it could help:

https://github.com/gavingt/upcoming-games/blob/master/app/src/main/java/com/gavinsappcreations/upcominggames/ui/detail/NestedScrollingParentScrollView.kt

CodePudding user response：

You can just user decelerationRate for speed either "fast"/"normal" or just any float