react-native-screens icon indicating copy to clipboard operation
react-native-screens copied to clipboard

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

Open gkueny opened this issue 2 years ago • 11 comments

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

gkueny avatar Nov 21 '22 16:11 gkueny

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.

kkafar avatar Nov 29 '22 14:11 kkafar

Hi @kkafar ,

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

gkueny avatar Nov 29 '22 15:11 gkueny

Thank you, I'll look into this

kkafar avatar Nov 29 '22 15:11 kkafar

We're experiencing the same issue. Any update?

techgerm avatar Dec 24 '22 00:12 techgerm

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

gkueny avatar Mar 15 '23 16:03 gkueny

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

cam-shaw avatar Apr 17 '23 02:04 cam-shaw

Facing this same issue

Sumit2202 avatar Apr 27 '23 21:04 Sumit2202

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

Sumit2202 avatar May 03 '23 15:05 Sumit2202

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

Lakston avatar May 22 '23 15:05 Lakston

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

gkueny avatar Feb 27 '24 17:02 gkueny