I want to present a screen modally that pushes the other screen to the back similar to how it is done in swift for iOS apps. I don't want the modal to come from the bottom and then cover the whole page, i just want it to come from the bottom and push the other screen to the back.

Here is an image of what i mean.

How can I do this in react native?

Here is my code:

> import { StyleSheet, Text, View } from 'react-native' import React
> from 'react' import { createStackNavigator } from
> '@react-navigation/stack' import { LoginScreen } from
> '../../features/account/screens/login.screen' import { RegisterScreen
> } from '../../features/account/screens/register.screen'
> 
> const Stack = createStackNavigator()
> 
> export const AccountNavigator = () => (
>     
>     <Stack.Navigator >
>         
>         <Stack.Screen
>             name="Login"
>             component={LoginScreen}
>             options={{
>                 headerShown:false,
>                 
>             }}
>         />
> 
>          <Stack.Screen
>             name="Register"
>             component={RegisterScreen}
>             options={{
>                 
>             }}
>            
>         />
> 
>     </Stack.Navigator>   
     )