Android上的React导航转换

Question

我有一个底部选项卡导航器，按下按钮，它会将我导航到堆栈屏幕。在安卓设备上，转换是从下到上的。我想在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;

Answer 1

试试这个

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>