React native随笔——解决navigation导航栏 android和ios样式不统一

navigation导航栏存在android和ios样式不统一的问题。Android手机上标题不居中,导航栏与状态栏重合。

解决方法为在navigationOptions中进行如下配置。

一、Android中标题不居中

headerTitleStyle: {
  alignSelf: center,
  textAlign: center,
  flex: 1
},

 

二、Android中导航栏与状态栏重合

判断为Android手机,margin上面状态栏的高度。

headerStyle: {
  marginTop: $IS_ANDROID ? $STATUS_BAR_HEIGHT : 0,
  height: 44,
  elevation: 0,
  borderBottomWidth: 0
},

 

End---------------

 

React native随笔——解决navigation导航栏 android和ios样式不统一

上一篇:flutter android 开发笔记(四.根据路由进入不同的flutter页面)


下一篇:WARNING: Heavy swapping observed on system in last 5 mins.