Android freeze not working if layout changes since >= 3.30.0

[adxzhang1]

Description

Since react-native-screens: >= 3.30.0, using freezeOnBlur: true in @react-navigation/bottom-tabs or using enableFreeze directly from react-native-screens, tabs that are not in focus still trigger onLayout changes for the following scenarios:

• rotating the device
• changing status bar visibility
• changing fullscreen mode

I would expect that a tab which is not in focus to not undergo a layout change.

Notice in the video, when rotating the device, the home page, which is not in focus, still has a layout change.

video.mp4

Steps to reproduce

1. Use freezeOnBlur: true in Tab.Navigator screenOptions from @react-navigation/bottom-tabs or directly call enableFreeze from react-native-screens
2. Switch to a new tab
3. Rotate the device OR have the change status bar visibility OR change fullscreen mode
4. Notice how layout changes occur for a view that is not in focus

Snack or a link to a repository

https://github.com/adxzhang1/react-native-screens/tree/unfocus-freeze

Screens version

>= 3.30.0

React Native version

>= 0.72

Platforms

Android

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[alduzy]

@adxzhang1 Thanks for submitting the issue! I can confirm that the issue is reproducible and I'm working on a possible fix.

[kkafar]

Hey, @adxzhang1 I believe the freeze works as expected. If you try to trigger the render of the component you have set the onLayout callback on, e.g. by setting state in the callback - you will notice that the component won't render.

Currently we're unsure why the onLayout is triggered, we're even unsure whether this is an invalid behaviour. The leading hypothesis is that this is just divergence in react-native behaviour between platforms.

I'm closing the issue, because it seems that the freeze works as expected (preventing renders).

If you believe that I should not close the issue & that this behaviour is problematic let us know about the use case.