react-native-snap-carousel: onSnapToItem & onBeforeSnapToItem do not fire reliably on left / right edges on Android
Is this a bug report, a feature request, or a question?
Bug report
Have you followed the required steps before opening a bug report?
(Check the step you’ve followed - replace the space character between the square brackets ([]) by an x.)
- I have read the guidelines regarding bug report.
- I have reviewed the documentation in its entirety, including the dedicated documentations 📚.
- I have searched for existing issues and made sure that the problem hasn’t already been reported.
- I am using the latest plugin version.
- I am following the issue template closely in order to produce a useful bug report.
Have you made sure that it wasn’t a React Native bug?
Yes.
Is the bug specific to iOS or Android? Or can it be reproduced on both platforms?
Android only, I believe
Is the bug reproductible in a production environment (not a debug one)?
Yes.
Environment
Env:
-
React: 16.6.0-alpha.8af6728
-
react-native: 0.57.4
-
react-native-snap-carousel: 3.7.5
Target platform:
- Android 7.1
Expected Behavior
Expected onSnapToItem to be fired reliably for every index.
Actual Behavior
onSnapToItem does not fire if scrolling all the way to the left or right edges.
gfycat video (look at the bottom for the Active index display)
Reproducible Demo
https://snack.expo.io/SJ6vPURhm
Steps to Reproduce
From the example, scroll to a middle slide on Android.
Scroll all the way to the left or right and release.
The state index is not updated.
About this issue
- Original URL
- State: open
- Created 6 years ago
- Reactions: 2
- Comments: 18 (5 by maintainers)
Hi @jkdf2 I had the same problem. I set the enableMomentum property to true and it worked for me.
I ran into this issue as well. Spent a few minutes logging various things inside the package and here’s what i found (in case someone finds it useful). The reason this is not an issue on iOS (or when
enableMomentumprop is enabled on Android ) is because there is over-scroll (scrollview/flatlist scrolls beyond the content). This triggers a re-render of the View and the first/last items snap.When
enableMomentumis disabled on Android (default), there’s no over-scroll. So when all the logic in the Carousel resolves and determines the next snap-to item, the View does not re-render because there is nothing to trigger the re-render. If there was over-scroll (like on iOS), scrolling just one pixel past the edges would re-render and snap the items. You can reproduce this yourself by manually setting the ScrollView offset to1when you reach0. This triggers and update and items snap and callbacks are fired.I added a very quick and hacky fix to my project by manually calling snapTo depending on the ScrollViews scroll offset.
I am also attaching a patch-file for the latest library version in case this helps someone.
In both the screenshot and the patch file, the “fix” is for vertical carousels only and may cause performance issues; however, it’s been working out so far.
@bd-arc Is there a workaround for the meanwhile?
@jkdf2 Thanks for the heads up! I’ll look into it as soon as possible.