search

nuclearpasta / react-native-drax

A drag-and-drop system for React Native
MIT License
552 stars 69 forks source link

Repositioning with an Offset? #172

Open rajleechaudry opened 2 months ago

rajleechaudry commented 2 months ago

Thanks for creating this library. Is there a way to control the drag offset? My use case is as follows:

(A) I have a bottom sheet using react-native Animated (the standard RN Animated not Reanimated).
(B)In the bottom sheet, I have some icons for various apps, e.g., Facebook, Insta, etc., which are all DraxView draggables.
(C) Issue: When I start to drag, for whatever reason, the DraxView starts a few inches above where my mouse is.

Hypothesis: I think DraxView for some reason is offsetting the starting position with my bottom sheet -- not sure why. Is there a way to control this?

Adding 3 files. One is the page. The other is the bottom sheet. The other is the widget component I created wrapping DraxView Archive.zip

lafiosca commented 2 months ago

Drax in general has not been maintained well for a long time, and offset problems like this can be tricky to debug. It is usually a question of whether the provider view is located in the correct position relative to what you are trying to do. But you can sometimes use the various DraxViewStyle props to fudge an offset: https://github.com/nuclearpasta/react-native-drax/blob/dbedea923ff87860da1b3112f06387fe879ad091/src/types.ts#L644

ofersadgat commented 1 month ago

FYI I have noted this as well. The problem is with flex. If you have 4 items in a flex vertical list, the items will be moved around within the vertical space. This moving causes drax to note the wrong position. In order to fix it, I added justifyContent:'flex-start',alignSelf:'flex-start' which made things stop moving around and then drax worked fine.