3

I am developing a React Native application using REACT NAVIGATION V5. I would like to add a custom transition for my navigation: fade out the current screen -> a white background -> fade in the new screen.

I have tried cardStyleInterpolator but it's not working as expected. I have the fade effect but the current screen overlaps the new one. Here is my fade implementation:

export const forFade = ({ current, next, index, closing }) => {
    const opacity = current.progress.interpolate({
        inputRange: [0, index],
        outputRange: [0, 1],
    });

    return {
        cardStyle: {
            opacity,
        },
    };
};

Any advice would be appreciated.

0 Answers0