react-native-draggable-flatlist
react-native-draggable-flatlist copied to clipboard
dragging is bugged on android device (smooth as butter on ios)
Describe the bug On a physical android device, when tapping a list item (i'm using onPressIn), the item will shoot to the top a lot of the time. On subsequent items, they seem to "remember" their original order, and jump up to to below other items you have reordered. We couldn't repro this on an iOS device (where it's super smooth!). In an android emulator, I can't repro that jumping bug, but items "landing" and sticking in place seems to take an inordinate amount of time (counted 5 seconds). This landing time bug doesn't seem reproducible on a physical android device, nor on ios sim or physical device.
To Reproduce Go on a physical android device, and try to reorder items on a list. They will jump wildly, especially the first one.
Platform & Dependencies Please list any applicable dependencies in addition to those below (react-navigation etc).
- react-native-draggable-flatlist version: 2.3.0
- Platform: android
- React Native or Expo version: 61.4
- Reanimated version: 1.3.2
- React Native Gesture Handler version: 1.4.1
I have been having the same problem, I reverted back several versions and am using version 2.0.14 and it seems to be working on android and iOS.
Please upgrade reanimated and let me know if the issue persists.
This package shouldn't really be used with reanimated < 1.4, as a critical performance feature was added then (proc
). This is why I pop up a warning, but maybe I should make that a hard requirement instead.
Upgrading from react-native-reanimated v.1.4 to 1.7.1 seems to have worked. Thanks!
upgrading reanimated to 1.8 did not resolve these issues for my app. Please let me know if there is something else you think is worth trying or info you'd like. Otherwise, I will have time to circle back on this in a few weeks and dig a little deeper.
I solved this issue by assigning the index (instead of any key in your item object) as the key in keyExtractor, not sure if it would help you.
i solved this issue by changing keyExtractor as @zhenghow93 described. initially it was keyExtractor={(item, index) => draggable-item-${item.id}
} than i changed it to keyExtractor={(item, index) => draggable-item-${item.sequence}
}. the issue is that the id of an item never change with respect to position of item in the list. so you have to use some value e.g index of item.