Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Content overlapping on screen transitions [createNativeStackNavigator]

See original GitHub issue

react native : 0.62 react navigation v5 : react-navigation/native : ^5.7.3 react-navigation/stack : ^5.9.0 expo - 38.0.8

glitch

I am using createNativeStackNavigator and i have headerLargeTitle enabled . This glitch usually happens for longer lists but , does happen on shorter lists too.

Repro-

You can reproduce this error on iOS (i am not sure if this error occurs on android) by putting two screens in a createNativeStackNavigator and setting the headerLargeTitle to true

Issue Analytics

State:
Created 3 years ago
Comments:5 (3 by maintainers)

Top GitHub Comments

1reaction

WoLewickicommented, Aug 26, 2020

Great! Can I close this issue then?

1reaction

WoLewickicommented, Aug 26, 2020

I think it is not a glitch. You provided headerStyle: { backgroundColor: "#ffffff00" } which means it has 0 alpha value, so it is transparent. At the beginning of the transition, the content of the below screen appears under that header and it is fully visible due to that 0 alpha value. After the transition, it stops to be transparent since you didn’t provide headerTranslucent: true which would enable the content to go under the screen, so now it is opaque. Am I right or am I not seeing something?