0

I want to stop a ScrollView from scrolling in React Native. I don't want to completely disable it, I just want it to stop scrolling at a specific point, so that I can scroll it again afterwards.

Since the scrolling momentum still persists afterwards, I can't simply disable it when a certain condition is met, so the following code does not work.

    <ScrollView
        onScroll={e => {
            if (e.nativeEvent.contentOffset.y > 500) {
                setStopScroll(true)
            }
        }}
        scrollEnabled={!stopScroll}
    />

I omitted the part in which is enabled the scroll view again to continue scrolling.

Ken White
  • 123,280
  • 14
  • 225
  • 444

1 Answers1

1

You are looking for snapToOffsets. This takes an array of positions where you want it to stop. After it stops, if you scroll again, it will stop at the next offset. Also make sure snapToEnd is set to false.

<ScrollView
 snapToOffsets={[100,500,800]}
 decelerationRate="fast"
 snapToEnd={false}
 snapToStart={false}
 disableIntervalMomentum={true}
 onScroll={onScroll}
>
 ... your code here
</ScrollView>
paperskyline
  • 329
  • 1
  • 10