search

erksch / react-native-wheely

An all JavaScript wheel picker for react-native without any native code.
440 stars 60 forks source link

Haptic Feedback on scroll #54

Open ucheNkadiCode opened 1 year ago

ucheNkadiCode commented 1 year ago

First of all, thanks so much for making this package! I'm so glad I found it.

I'd love to know, would it be possible to create a method to detect as the user scrolls to a new value, even before they lift their finger to perform onValueChange?

I am trying to make the scrolling of this wheel nice and responsive so as they go from 1 to 5, it should lightly vibrate 4 times. Unfortunately, since I can only trigger haptic feedback onValueChange, I can only trigger 1 light vibration once I land on 5

Any help would be appreciated @erksch

erksch commented 1 year ago

Sounds like an interesting feature. Sadly I currently do not have time to build something like this, but I'd be happy to review a PR!

willashley23 commented 1 year ago

I also want this feature! I'm willing to take a crack at it and open a PR. I'd like to find a solution in the meantime though, any thoughts on how one could do this from the consumer end? When I wrap the <WheelPicker> in a GestureDetector, it doesn't fire any pan gestures, it seems like the scrolling of the wheel "eats" the gesture.

Update: I took a stab at it but ran into an issue here: https://github.com/willashley23/react-native-wheely/blob/394df7c47f0cfc24adde09adb2e11d885a9028a3/src/WheelPicker.tsx#L143

The implementation should be straightforward – every itemHeight scrolled, trigger haptic feedback. However it seems like the onScroll callback has some type of throttling – it doesn't necessarily trigger every pixel, making it impossible to accurately trigger feedback every itemHeight of scroll. I thought useNativeDriver was supposed to fix that but maybe it's just an inherent limitation the platform, like the JS bridge just can't send those events without triggering frame drops.