Skip to content

Android Header expands unexpectedly when headerSearchBarOptions are set in v4.6.0+ #2675

@marcel-happyfloat

Description

@marcel-happyfloat

Description

After upgrading from v4.5.0 to v4.6.0+, the header height on Android unexpectedly increases to a large value when navigating to a page with the search icon enabled. This issue does not occur on iOS, where the behavior remains normal.

Image

In v4.5.0, the header height functions correctly:
Image

Stack:

"react-native": "0.77.0",
"react-native-screens": "4.6.0",
"@react-navigation/native": "7.0.14",
"@react-navigation/native-stack": "7.2.0",
"react-native-reanimated": "4.0.0-beta.2",
...

Steps to reproduce

I was able to reproduce the issue in a slightly different way using a minimal example. While navigating to a new page with search works correctly, setting headerSearchBarOptions on the initial screen causes the header height to display incorrectly in v4.6.0. In v4.5.0, the height briefly flickers from the incorrect value to the correct one.

  1. npm i
  2. npx expo prebuild --clean
  3. npx expo run:android -d

Snack or a link to a repository

https://github.com/marcel-happyfloat/android-screen-issue

Screens version

4.6.0

React Native version

0.77.0

Platforms

Android

JavaScript runtime

Hermes

Workflow

None

Architecture

Fabric (New Architecture)

Build type

Debug mode

Device

None

Device model

No response

Acknowledgements

Yes

Metadata

Metadata

Assignees

No one assigned

    Labels

    platform:androidIssue related to Android part of the libraryrepro-providedA reproduction with a snack or repo is providedtype:bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions