react native 布局问题

1. Text组件里面的 文字垂直居中

<Text style={styles.confirmButtonStyle}>确认</Text>

confirmButtonStyle:{
    width:135,height:44,backgroundColor:'#335484',
    color:'#FFFFFF',fontSize:16, borderRadius:2,
    textAlign:'center',textAlignVertical:'center', //就是这两行
}

 最后实现的效果图,如下

 

 

2. 给TextInput组件设置高度时,出现光标在中部的情况

添加一行代码: textAlignVertical: "top",就会显示在顶部

 

 

3. React Native – TouchableOpacity无法在绝对定位的View中工作(也就是点击事件失效

解决办法就是将定位属性放在TouchableOpacity组件上

 

<TouchableOpacity 
      style={{position:'absolute',bottom: 60,right: 15,}}
      onPress={()=>this.props.navigation.navigate('minemessagescreen')}  
 >
      <View style={styles.customerMessageBox}>
           <Image style={{height:23, width:23}} source={require("../imgs/message2_icon.png")}/>
      </View> 
</TouchableOpacity>

 

 

 

 



posted @ 2020-08-06 15:26  tengyuxin  阅读(492)  评论(0编辑  收藏  举报