I prototyped a app in figma and choose the "on drag push" animation to transition between two views.

When I wen't to turn my prototype into a real app using React Native I haven't found a way to do the same transition. I want for my app to navigate to a new screen when i drag the screen from right to right and for the new screen to push the old screen out as I drag my finger like this:

Does anyone have any sugestoins as to how I can achieve this transition?

I'm using react-navigation to move between diferent screens in the app. My NavigationContainer is setup like this:

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';

import screen1 from './screen1';
import screen2 from './screen2';

const Stack = createNativeStackNavigator();

const App = () => {
    return (
        <NavigationContainer>
            <Stack.Navigator screenOptions={{headerShown: false}}>
            <Stack.Screen name="screen1" component={screen1}/>
            <Stack.Screen name="screen2" component={screen2}/>
            </Stack.Navigator>
        </NavigationContainer>
    );
};

export default App;

And I navigate betwen screens like this:

navigation.navigate('screen2')