React Native Native-Stack: disable transition animation on iOS

Question

React Native 0.68 with Native-Stack: transition animation is disabled on android but not on iOS 15.4.1(screen slides from right to left).

import React, {Component} from 'react';
import {Platform} from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import Map from './screens/map';
import Splash from './screens/splash';

const Stack = createNativeStackNavigator();

export default class App extends Component {
  render() {
    return ( 
      <NavigationContainer>  
        <Stack.Navigator initialRouteName="Splash">
          <Stack.Screen name="Splash" component={Splash} options={{headerShown: false, gestureEnabled: false, animation: 'none'}}/>
          <Stack.Screen name="Map" component={Map} options={{headerShown: false, gestureEnabled: false, animation: 'none'}}/>
        </Stack.Navigator>
      </NavigationContainer> 
    );
  }
}

Any idea?

Answer 1

For native stack, you can use the presets provided by the library or disable by passing 'none' to the animation props.

It is an option so it can be passed to the navigator as a screenOptions or can be configured per screen with options.

Added a working demo - https://snack.expo.dev/Hq4U52f0i

https://reactnavigation.org/docs/native-stack-navigator/#animation