Блог

У меня есть навигатор нижней вкладки, и при нажатии кнопки он переместит меня на экран стека. На устройстве Android переход осуществляется снизу вверх. Я хочу добиться перехода слева направо, как на iOS, но я не знаю, как этого добиться.

Я добавил это на свой экран стека,

 <Stack.Navigator
  screenOptions={{
    cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS
  }}
>
    <Stack.Screen name="Screen 1" component={ScreenComponent1} />
    <Stack.Screen name="Screen 2" component={ScreenComponent2} />
</Stack.Navigator>
  

но он работает только с экрана стека 1 на экран 2, а не с экрана с нижней вкладкой на экран стека.
Пожалуйста, если у вас есть какое-либо решение?

Это мой нижний навигатор вкладок:

 <Tab.Navigator>
  <Tab.Screen name="Home" component={Home} />
  <Tab.Screen name="Profile" component={Profile} />
</Tab.Navigator>
  

И это главная:

 import React from 'react';
import {StyleSheet, Text, View} from 'react-native';
import {Button} from '../../components';

const Home = () => {
  return (
    <View>
      <Text>Go To Screen1</Text>
      <Button title="Screen1" />
    </View>
  );
};

export default Home;
  

Попробуйте это

 import {
  CardStyleInterpolators,
} from '@react-navigation/stack';

<NavigationContainer ref={NavigationService.navigationRef}>
        <Navigator
          
          screenOptions={{
            cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS, // Transition as IOS
          }}
      
          {...{headerMode}}>
          {screens.map(({name, component}, key) => (
            <Screen
              {...{name, component, key}}
              initialParams={
                name === 'App'
                  ? {
                      initRoute,
                      params,
                    }
                  : {}
              }
            />
          ))}
        </Navigator>
      </NavigationContainer>