How to change screen background while in transition?

[mohsinulhaq]

I have an app with a full-screen image background added at the top level. I have made every screen background transparent. But on iOS, the transition between screens leads to a brief overlap of contents of the incoming screen and the outgoing screen. Is it possible to set a different background color for the incoming screen while it's in transition?

[chybisov]

Maybe related to #804

[WoLewicki]

You can use navigation events: https://github.com/software-mansion/react-native-screens/tree/master/native-stack#transitionstart and https://github.com/software-mansion/react-native-screens/tree/master/native-stack#transitionend to change options for during the transition.

[mohsinulhaq]

@WoLewicki would that mean that now I would need to keep the Navigator screen options in a state instead of a normal global var I have it now as?

PS:
I wanted the same effect as cardStyleInterpolator

[mohsinulhaq]

Also it seems it's available per screen via navigation prop.
Is it possible to do it at the top navigator level for all screens?

[WoLewicki]

you can use navigation.setOptions to control the options in the current screen. As for the transition events, it should work the same as in other react-navigation navigators.

[mohsinulhaq]

@WoLewicki yes, got it! but can I do it for all screens from a single place?