-
-
Notifications
You must be signed in to change notification settings - Fork 1k
Description
Description
Since Pressable doesn't support any swipe gesture guards apparently you have to wrap it with tap gesture detector to have both native ripple effect and intuitive interactions, mostly for scroll lists.
Problem that the ripple effect plays only once on repeated taps on same element. You have to press elsewhere to reset it, despite that all pressable events work simultaneously anyway, so it's just visual inconsistency.
Without gesture detector, ripple show as expected on repeat taps.
I added a demo but have to run on real device of course.
The reason for this gesture hack is while typically scroll list block taps while scrolling, it may still fail during momentum scrolling and doing short flicks on pressable list items. So if you do fast scrolling back and forth, maybe when searching for an item, it may trigger a press which could open a menu or navigate away - annoying.
There are alternatives of course, like avoid using rgnh components inside scroll lists and use gestures only, with custom feedback through reanimated if necessary, or disable pressable during momentum scroll somehow.
Steps to reproduce
touch one button repeatedly - no ripple
alternate between buttons or background - ripple shows correctly.
A link to a Gist, an Expo Snack or a link to a repository based on this template that reproduces the bug.
https://snack.expo.dev/@gregsm/gnarly-violet-truffles
Gesture Handler version
2.30.0
React Native version
0.81.5
Platforms
Android
JavaScript runtime
Hermes
Workflow
Using Expo Prebuild or an Expo development build
Architecture
New Architecture (Fabric)
Build type
Release mode
Device
Real device
Device model
Samsung S21 Ultra
Acknowledgements
Yes