This PR introduces renderScrollComponent, enhancing the scrolling experience when using pressable components inside scrollable views (e.g., ScrollView, FlatList, FlashList).
What it does
Prevents accidental activations of pressable components during scrolling
Adds a short delay (75ms) to distinguish between scrolls and taps
This PR introduces
renderScrollComponent
, enhancing the scrolling experience when using pressable components inside scrollable views (e.g., ScrollView, FlatList, FlashList).What it does
How to use it
Implementation details
makeMutable
from 'react-native-reanimated' to createscrollableInfoShared
, tracking scroll and tap state efficientlyInternalScrollView
, a forwarded ref component wrapping ScrollView and providing scrollable contextonTouchStart
: Sets a 75ms timeout to activate taponScrollBeginDrag
: Clears timeout and marks scrolling as activeonScrollEndDrag
: Marks scrolling as inactiveonTouchEnd
: Clears timeout and resets tap staterenderScrollComponent
that applies these callbacks to the scroll viewThis approach allows for precise distinction between scrolling and tapping intentions, improving overall user experience.
https://github.com/user-attachments/assets/6c6c22fb-9a72-433c-b7c3-96ae443e5a52