discussions-and-proposals
discussions-and-proposals copied to clipboard
Get element by position (X and Y) in react-native
Introduction
On web, you can get any element by its position:
document.elementFromPoint(x, y)
Is there something similar in React Native? Can it be done with a native bridge (Java/Objective C)?
Details
I would like to get an element on screen by position X and Y (Ignoring empty places and following transformation or styling calculations like padding, margin, borderRadius) then set it a native prop or dispatch events.
OBS: I'm not referring to onLayout property or any other declared in the component's construction/render, my idea is from any X and Y position get an element that corresponds to these coordinates then get a reference to it.
Use case for example:
- Create a virtual cursor that dispatch click events on correct components, following margin/padding and ignoring pointerEvents none.
- Drag & Drop stuff.
- Acessibility.

-
Using onLayout for desired elements (or creating a generic component and using it everywhere in your application), storing values in arrays, updating when necessary, using your own algorithms to get the result you want from the data you already have.
-
An alternative (thinking Android, but not exactly getting react native components by its x and y position) could be dispatching MotionEvents by native code and letting React Native handle it, with events from onPress, pointerMove (still in development) for example...