0

I am using Stack Navigator with a transitionConfig. In the scene interpolator I have defined myCustomTransition() which is being applied to all the screens in the stack.

Is is possible to have the myCustomTransition() applied to only particular screens, and the default stack navigator transition to the rest?

This is the transitionConfig:

const transitionConfig = () => {
    return {
        transitionSpec: {
            duration: 500,
            easing: Easing.out(Easing.poly(4)),
            timing: Animated.timing,
            useNativeDriver: true,
        },

        screenInterpolator: sceneProps => {
            const { scene, position, layout } = sceneProps;

            const sceneIndex = scene.index;
            const height = layout.initHeight;

            // is it possible to have a switch statement 
            switch (scene.route.routeName) {
                case 'searchScreen':
                    return myCustomTransition();

                default:
                    return defaultTransition();
            }
        },
    };
};

Is it possible to have a switch statement to apply myCustomTransition() only to the searchScreen?

Thanks.

Vinay Sharma
  • 3,291
  • 4
  • 30
  • 66

1 Answers1

0

@Vinay Sharma Use this

Example:

const AppStack = createStackNavigator(
    {
        headerMode: "none",
        animationEnabed: true,
        transitionConfig: () => ({
            transitionSpec: {
                easing: Easing.bezier(.88,0.83,.82,.95),
                delay: 100,
                duration: 250,
            },
        }),
    }
);
Elango
  • 272
  • 3
  • 16
  • Create ``createStackNavigator``, it may contain only one screen... – Elango Feb 06 '20 at 09:13
  • Hi Elango, I have mentioned that I have multiple screens. This solution is totally out of context as it nowhere specifies how to use custom transition. – Vinay Sharma Feb 06 '20 at 11:39