Объединить TabNavigator и Drawernavigator

Я использую реагирующую навигацию и хочу использовать TabNavigator и DrawerNavigator вместе. Я знаю, что вы можете вложить навигаторы, но тогда, например, только одна ссылка ящика имеет мои вкладки.

Я хотел бы, чтобы навигация по вкладкам всегда была видна, а ящик должен быть доступен.

Ящик перемещается по вкладкам

Таким образом, три вкладки вверху должны быть всегда видны. И ящик может выдвигаться, чтобы связать разные сцены.

const CustomTabRouter = TabRouter({
  Tab1: {
    screen: Tab1,
    path: '1',
  },
  Tab2: {
    screen: Tab2,
    path: '2',
  },
  Tab3: {
    screen: Tab3,
    path: '3',
  },
}, {
  initialRouteName: 'Tab2',
})

const TabNavigation = createNavigationContainer(
  createNavigator(CustomTabRouter)(CustomTabView)
)

const AppNavigation = DrawerNavigator({
  Home: {
    screen: TabNavigation
  },
  ScreenOne: {
    screen: ScreenOne
  },
  ScreenTwo: {
    screen: ScreenTwo
  },
}, {
  headerMode: 'none',
  initialRouteName: 'Home',
  drawerPosition: 'right',
  contentComponent: props => Slider(props),
  contentOptions: {
    inactiveTintColor: Colors.primary,
    activeTintColor: Colors.orange,
    activeBackgroundColor: Colors.white
  },
})

Но проблема с моим кодом в том, что вкладки только для одной сцены. Также пробовал StackNavigators, но должно быть другое решение для совместного использования обоих Navigator.


react-native navigation-drawer navigation react-navigation tabnavigator
person Markus Günther    schedule 17.07.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Если вам нужно, чтобы вкладки всегда были видны, вам нужно использовать TabNavigation в качестве маршрутизатора верхнего уровня, а в него вложить другие параметры навигации.

person Muaz    schedule 09.05.2019