Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ReactNative get the absolute position of a view relative to the screen

Tags:

react-native

with react native.

I can get the position and size with onLayout, but I want to get the absolute position of a view relative to the screen

please! the absolute position of a view relative to the screen

not the absolute position of a view relative to the parent view

What should I do?

like image 833
weijia.wang Avatar asked Sep 14 '17 10:09

weijia.wang


People also ask

How do you get position of a view in React Native?

To get the position of an element with React Native, we can get it from the View 's onLayout callback. to add a View with the onLayout prop set to a function that gets the position values from the event. nativeEvent. layout property.

How do you use position absolute and relative in React Native?

position ​ position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent. If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

How do you get touch position in React Native?

To get the coordinates of a touch event with React Native, we can get it from the touch event object. to set the TouchableOpacity 's onPress prop to onPress . Then we get the x and y coordinate of the touch from the evt.


1 Answers

you can use measure(callback) it Determines the location on screen, width, and height of the given view and returns the values via an async callback.

a better example can be found here React Native: Getting the position of an element

<View
  ref={(ref) => { this.marker = ref }}
  onLayout={({nativeEvent}) => {
    if (this.marker) {
      this.marker.measure((x, y, width, height, pageX, pageY) => {
                console.log(x, y, width, height, pageX, pageY);
       })
    }
  }}
 >
like image 59
Mohamed Khalil Avatar answered Sep 29 '22 03:09

Mohamed Khalil