react-native-draggable-flatlist
react-native-draggable-flatlist copied to clipboard
fix: bad initial scrollInit value causes auto-scroll when drag begins
Thank you for your work on this project!
Problem:
- lists auto-scroll unnecessarily when drag begins when scrollY is not at 0
Reproduce:
- scrolled down the draggable list any amount
- trigger the "drag"
- component auto-scrolls unnecessarily, then stops
This is especially noticeable if you increase the auto-scroll speed, as it can displace the dragging item by multiple slots before you move your finger.
Technical problem:
- in the
useAnimatedReaction
hook inanimatedValueContext.tsx
, thescrollInit
value updates in the render AFTERactiveIndexAnim
is set. Therefore,autoScrollDistance
triggers, but with an initially-inaccuratescrollInit
. On the next render,scrollInit
is accurate, but it's too late because the auto-scroll animation already caused a jump
Solution:
- initialize
scrollInit
to -1, resetting the value when the active index resets. While it's -1 (uninitialized), forceautoScrollDistance
to return zero.
Before: https://github.com/computerjazz/react-native-draggable-flatlist/assets/66435161/c132b0c2-9165-4081-9525-287de7dd6cfa
After:
https://github.com/computerjazz/react-native-draggable-flatlist/assets/66435161/d6350655-e091-443f-882b-c0149acdf5e8