1 监听布局改变
组件内部拥有onLayout方法
onLayout={this._onLayout}
//如何动态布局呢
//1 当然是监听横竖屏之后
//2 使用this.setState 动态改变布局咯
_onLayout(event){
let {x,y,width,height} = event.nativeEvent.layout;
console.log("X:"+x+"y:"+y+"width:"+width+"height:"+height);
if(height>width){
console.log("竖屏");
}else{
console.log("横屏");
}
}
2 改变状态机
<View style={styles.container}>
<TouchableOpacity onPress ={() => {this.setState({change:true})}}>
{
(this.state.change == true)
? (<Image source={'./images/img1.png'} /> )
: (<Image source={'./images/img2.png'} />)
}
</TouchableOpacity>
</View>