Как центрировать заголовок, не затрагивая headerLeft в реагирующей навигации?

Question

Я использую реагирующую навигацию и центрирую заголовок на панели, но на него влияет headerLeft, когда я отключаю их, он работает и точно центрирует заголовок, как это сделать, не затрагивая заголовок с помощью другой левой и правой кнопки \icon

код:

const RootNavigator = createStackNavigator({
  Home: {
   screen: Home,
   navigationOptions: {
     title: "Home",
    //headerLeft: null, // here the issue
     headerStyle: {
        backgroundColor: 'rgb(42,55,68)',
     },
      headerTitleStyle: {
         flex: 1,
         textAlign: 'center',
         color: "#fff",
       }
    }
  }
 });

Answer 1

Нет проблем с вашим headerTitleStyle props, просто убедитесь, что у вас есть View для headerLeft и headerRight.

Пример:

 headerLeft : (<View><Entypo name='menu' size={28} color='white' onPress={() => navigation.openDrawer()} /></View>),
 headerRight:(<View></View>)