[iOS] Large title does not collapse if scroll view is displayed after a delay

Description

The navigation bar with a large title does not collapse if a scroll view is rendered after a delay, e.g. if data is loaded from the network and another view is shown as a placeholder. Additionally, the refresh control remains inside the scroll view, instead of being repositioned inside the navigation bar.

After rotating the device to landscape and going back to portrait, the large title collapses as expected and the refresh control is inside the navigation bar.

I suspect that an additional layout pass should be triggered in the navigation bar when the scroll view is mounted, though I am not sure which component should be in charge of that. In fact, I am not entirely sure whether this issue belongs here, in react-navigation or react-native. If you believe it should be resolved somewhere else, I am happy to open a new issue in the appropriate repo.

Steps to reproduce

1. Create a stack navigator with a single Home screen and enable headerLargeTitle in the options prop
2. Define the Home screen as a bottom navigator with a single screen (and hide the header in the props)
3. Define the screen as a component that shows a placeholder, and after a couple of seconds displays a scroll view with a refresh control

https://github.com/user-attachments/assets/aff207d2-7f28-49d4-8133-915a889598a2

Snack or a link to a repository

https://snack.expo.dev/@erudel/0a1940

Screens version

4.4.0

React Native version

0.77

Platforms

iOS

JavaScript runtime

None

Workflow

None

Architecture

Fabric (New Architecture)

Build type

None

Device

iOS simulator

Device model

No response

Acknowledgements

Yes