search

nuclearpasta / react-native-drax

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

Hover on absolute elements #114

Closed tommyy911 closed 3 years ago

tommyy911 commented 3 years ago

Hi, I've a problem with hovering ( calculating positions ) when elements are zoomed in. I have a board with a lot of elements and there is a possibility to zoom in\out and move the board in any direction. And I have a section with draggable elements ( on this board ). I've noticed that when I'm zooming, the hover position is wrong.

(2 pics for better explanation)

Zrzut ekranu 2021-09-26 o 15 57 40

(After zoom )

Zrzut ekranu 2021-09-26 o 15 57 56

I'm not sure if it's a bug or maybe there is a prop which can I use to fix it.

Thanks for advance :)

lafiosca commented 3 years ago

I would probably not expect this to work with the current library as-is, but there may be some hacky workaround. Could you share some more detail on how the zoom works?

tommyy911 commented 3 years ago

Thanks for the response :) EDIT. Thanks once again , I was able to solve my problem by adding switch (measureAgainst) { case 'layout': view.measureLayout( nodeHandle, measureCallback, () => { // console.log('Failed to measure Drax view in relation to parent nodeHandle'); }, ); break; case 'window': view.measureInWindow( measureCallback, ); } and in buildMeasureCallback const updatedY = measureAgainst === 'layout' ? y! : y! - (marginY - (offsetY!.value / 4)); const updatedX = measureAgainst === 'layout' ? x! : x! + (marginX + (offsetX!.value / 4)); const measurements: DraxViewMeasurements | undefined = ( height === undefined ? undefined : { height, x: updatedY, y: updatedX, width: width!, } ); Many thanks for your work , your lib is awesome :)

TarikHuber commented 1 year ago

@tommyy911 could you pls explain a little bit more about how you managed to solve this issue? We have exactly the same one.