StackNavigator() 调用的时候第二个参数
中如下设置
navigationOptions: {
headerBackTitle: null,
headerBackTitleStyle: {
color: 'white',
},
headerStyle: {
backgroundColor: '#647cff',
},
headerTitleStyle: {
color: 'white',
alignSelf: 'center',
},
headerTintColor: 'white',
headerRight: <View style={{width: 40, height: 1,}}/>,
}
headerBackTitle: null, 屏蔽所有的导航左上角返回标题
headerBackTitleStyle: { color: 'white', }, 左上角返回标题为白色
headerStyle: { backgroundColor: '#647cff', },统一修改导航背景颜色
而安卓导航标题默认是居左的,比较难看
修改方法是 headerTitleStyle: {alignSelf: 'center',},
如此,标题会居中放置
但是,这么设置还是不行,可以看到标题在中间靠右位置。
因为 左上角 有返回按钮,标题在除了 左上角按钮的 其余剩余空间居中,而右上角什么都没有,导致靠右
最简单的做法就是,右上角放置占位视图
headerRight: <View style={{width: 40, height: 1,}}/>,
默认宽度 40,40和左上角按钮宽度大致一样
就可以使标题完美居中