Заголовок с TabNavigation React Navigation - PullRequest
Новая
       6

Заголовок с TabNavigation React Navigation

0 голосов
/ 29 октября 2018

Каков наилучший способ иметь заголовок с заголовком страницы с помощью навигатора вкладок с реагировать родной? Я знаю, что есть способ обернуть вас TabNavigator внутри StackNavigator, но я не понимаю, как это сделать с различными компонентами в разных классах ...

Это то, что я делаю для настройки TabNavigator:

Внутри App.js: 

export default createBottomTabNavigator(
{
  Activity: Activity,
  Front: Front
},
{
  navigationOptions: ({ navigation }) => ({
    tabBarIcon: ({ focused, horizontal, tintColor }) => {
      const { routeName } = navigation.state;
      let iconName;
      if (routeName === 'Activity') {
        iconName = `ios-information-circle${focused ? '' : '-outline'}`;
      } else if (routeName === 'Front') {
        iconName = `ios-cog`;
      }
      return <Ionicons name={iconName} size={horizontal ? 20 : 25} color={tintColor} />;
  },
}),
tabBarOptions: {
  activeTintColor: 'tomato',
  inactiveTintColor: 'gray',
},
});

1 Ответ

0 голосов
/ 29 октября 2018

Каждая вкладка может быть StackNavigator, например: 

const activityStackNavigator = createStackNavigator({
  Activity: {
    screen: Activity,
    navigationOption: {
      headerTitle: 'Some title...'
    }
  }
})

А затем в вашем TabNavigator просто используйте StackNavigator, который вы только что создали в качестве экрана: 

export default createBottomTabNavigator(
  {
    Activity: activityStackNavigator,
    Front: Front
  },
  ...
}

Вот некоторые , прочитанные из документов React-Navigation.

...