react-native-swipeable-item
react-native-swipeable-item copied to clipboard
Can't press buttons during the swiping
Describe the bug It's not possible to press elements during the swiping. We have two buttons on the right side. When I swipe to the left, I can press them after the swiping process stops (+ need to wait for ~ 100 ms after a stop).
Steps to reproduce the behavior:
Swipe and try to press any elements that have onPress
handlers. Handlers will not be triggered.
Platform & Dependencies Please list any applicable dependencies in addition to those below (react-navigation etc).
Platform (iOS):
React Native: 0.67.4
react-native-reanimated
version: 2.2.4
react-native-gesture-handler
version: 2.1.0
Here is an example https://snack.expo.dev/@moro/swipeable-draggable-list
If you swipe and press delete
it will not trigger the action, you need to wait until the swiping stops.
We've found the cause of this:
- pointer events are disabled based on which open direction is set [code]
- this is currently set onAnimationEnd [code]
- this results in pointer events being blocked until the animation is fully done, even if item is visible
We've validated this by calling onComplete
here which results in onAnimationEnd being called and the openDirection state being updated. This makes the underlay pressable.
Happy to open a PR to fix this, but I'm not sure of the best way to do this. Would it be sufficient to update the open direction via a set state call run on JS thread here (same location as onComplete call above)? Not sure if there will be other downstream impact from this.
@jmif your solution and PR would be very welcome.
edit: I've tested your proposed solution and it seems to work. The PR is here https://github.com/computerjazz/react-native-swipeable-item/pull/55.
Thanks @vbylen!
please try https://github.com/computerjazz/react-native-swipeable-item/releases/tag/v2.0.8 and let me know if it fixes the issue.
@computerjazz it's working great, thank you!