React Native获取组件位置和大小

1. onLayout事件属性

// 在元素上设置onLayout属性
<View onLayout={this._onLayout}><View>

_onLayout = (e) => {
	let {x,y,width,height} = e.nativeEvent.layout
}

2.measure方法

// 建议使用函数方式设置ref，否则可能会出一些奇怪的错误
<View ref={(ref) => this.ref_view = ref}></View>

// 这里加一个延时，相当于放入异步执行队列，时长不重要
componentDidMount(){
   setTimeOut(() => {
     this.ref_view.measure((x,y,width,height,pageX, pageY) => {
       //todo
       })
   });
}

3. 使用UIManager measure方法

import { UIManager, findNodeHandle} from 'react-native'

// ref属性参考方法二设置
onClick = () => {
	UIManager.measure(findNodeHandle(this.buttonRef),                
      (x,y,width,height,pageX,pageY)=>{
		// todo
    })	
}