search

software-mansion / react-native-gesture-handler

Declarative API exposing platform native touch and gesture system to React Native.
https://docs.swmansion.com/react-native-gesture-handler/
MIT License
6.13k stars 982 forks source link

The dragging coordinates do not follow the mouse or finger when scrolling the FlashList. #3190

Open MJRT opened 3 weeks ago

MJRT commented 3 weeks ago

Description

I want to implement scrolling the list when list item is dragging to list edge, but dragging item's translateY is unexpected, it should have same coordinates with mouse or finger.

It can reproduce on web and android, but I guess same on iOS.

test

Steps to reproduce

https://github.com/MJRT/translationXY-unexpected-at-scrolling

Snack or a link to a repository

https://github.com/MJRT/translationXY-unexpected-at-scrolling

Gesture Handler version

2.19.0

React Native version

0.75.4

Platforms

Android, Web

JavaScript runtime

Hermes

Workflow

Expo managed workflow

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

latekvo commented 3 weeks ago

Hi @MJRT, Thank you for reporting this issue.

I believe the behaviour visible in the attached video is expected and not a bug. The dragged element is attached to its moving parent and not to the mouse pointer. If you aren't actively compensating for the movement of the parent by translating the element in the reverse direction of the parent's translation, it is expected for the child to follow its parent's position.

As far as I see, in the code repro you provided, you're adjusting the element's position only by the mouse movements. To fix this issue, you need to also adjust it by the scrolling offset.