Changing the direction of the animation for a particular screen in StackNavigator?

Viewed 642

I need to change the animation of navigation to bottom-to-top for a particular screen in the stack-navigator in Navigation 5.0.

1 Answers

I looked for the answers in StackOverflow but didn't find a solution related to a single screen. So here's the solution if someone is looking for the answer.

options={{cardStyleInterpolator: CardStyleInterpolators.forVerticalIOS}}

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

<AppStack.Navigator headerMode="none" initialRouteName={"Home"}>
          <AppStack.Screen name="Home" component={HomeScreen} />
          <AppStack.Screen
            options={{
              cardStyleInterpolator: CardStyleInterpolators.forVerticalIOS,
            }}
            name="Edit"
            component={EditScreen}
          />
          <AppStack.Screen name="Settings" component={SettingScreen} />
        </>
      )}
</AppStack.Navigator>
Related