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---------------