search

software-mansion / react-native-screens

Native navigation primitives for your React Native app.
MIT License
2.9k stars 498 forks source link

White flash on tab change with @react-navigation/bottom-tabs #1645

Open gkueny opened 1 year ago

gkueny commented 1 year ago

Description

When I'm using @react-navigation/bottom-tabs with the native stack navigator, I see a white flash on tab transition in IOS.

If I replace @react-navigation/native-stack by @react-navigation/stack, white flash disappear.

I think it can be related to https://github.com/software-mansion/react-native-screens/issues/1276 but I'm not sure we talk about the same issue.

https://user-images.githubusercontent.com/10655690/203101057-2af9f31c-674b-47eb-9dba-dded56bb9753.mp4

Steps to reproduce

  1. Get Minimal reproduction repo https://github.com/gkueny/native-stack-flash-issue-reproduction
  2. Install dependencies
  3. Run APP
  4. Navigate between tab screen

Snack or a link to a repository

https://github.com/gkueny/native-stack-flash-issue-reproduction

Screens version

3.20.0 & 3.29.0

React Native version

0.69.7 & 0.73.6

Platforms

iOS

JavaScript runtime

No response

Workflow

React Native (without Expo)

Architecture

No response

Build type

Debug mode

Device

iOS simulator

Device model

No response

Acknowledgements

Yes

kkafar commented 1 year ago

Hi @gkueny, would you mind confirming whether this issue appears on iOS 15.x? There've been quite a few issues recently, that are specific to iOS 16 and are caused by internal system changes. Would like to know if it is the case.

gkueny commented 1 year ago

Hi @kkafar ,

I can confirm that I reproduce the issue in iOS 15.5 (simulator)

kkafar commented 1 year ago

Thank you, I'll look into this

techgerm commented 1 year ago

We're experiencing the same issue. Any update?

gkueny commented 1 year ago

@techgerm not on my end. I update the minimal reproduction repo with latest version of @react-navigation/* & react-native-screens but with no luck

cam-shaw commented 1 year ago

I get this issue as well. Wonder if it's related to this conversation where "flickering" is discussed? https://github.com/react-navigation/react-navigation/issues/11285

Sumit2202 commented 1 year ago

Facing this same issue

Sumit2202 commented 1 year ago

@kkafar has there been any moment on this issue so far?

Lakston commented 1 year ago

Curious about this also, same setup, ios, botom navigator and latest version of native screens

gkueny commented 4 months ago

I updated minimal reproduction with latest version of each lib & latest version of react-native : https://github.com/gkueny/native-stack-flash-issue-reproduction/commit/46045f1671d122943b78c0fc9badd71e4a69a888

Issue is still present

alduzy commented 2 weeks ago

I can confirm the issue is reproducible on Paper architecture, Fabric works fine.