feat(Android, Stack v5): header background color customization

[kligarski]

Description

Adds support for modifying the background color of the header in regular and collapsed/lifted state.

Closes https://github.com/software-mansion/react-native-screens-labs/issues/907.
Closes https://github.com/software-mansion/react-native-screens-labs/issues/906.

Changes

• add backgroundColor property that maps to appBarLayout.background
• add scrolledBackgroundColor property:
  • for small header it maps to appBarLayout.liftOnScrollColor and requires liftOnScroll to be enabled
  • for medium/large header it maps to collapsingToolbarLayout.contentScrimColor and removes appBarLayout.liftOnScrollColor
• handle runtime changes for small header when app bar is lifted

Before & after - visual documentation

4522.mp4

Test plan

Run test-stack-header-background-android SFT.

Checklist

• Included code example that can be used to test this change.
• For visual changes, included screenshots / GIFs / recordings documenting the change.
• For API changes, updated relevant public types.
• Ensured that CI passes

---

_{Stack created with GitHub Stacks CLI • Give Feedback 💬}

[Copilot]

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Adds Android stack header background customization by exposing backgroundColor and scrolledBackgroundColor through the JS/TS types and wiring them into the native Android header implementation, plus a manual test scenario to validate the visual behavior.

Changes:

• Exposed backgroundColor / scrolledBackgroundColor in Fabric/native props and public Android header config types.
• Added Android native plumbing (config provider props, invalidation flags, view manager setters) and applied colors in the header applicator.
• Added a new single-feature manual test scenario for validating background/scrim/lift behavior.

Reviewed changes

Copilot reviewed 12 out of 12 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
src/fabric/stack/StackHeaderConfigAndroidNativeComponent.ts	Adds new native prop types for background colors.
src/components/stack/header/StackHeaderConfig.android.types.ts	Documents and exposes new Android header color props.
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-background-android/scenario.md	Manual QA steps for verifying color behavior and transitions.
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-background-android/scenario-description.ts	Registers the scenario metadata.
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-background-android/index.tsx	Implements the interactive test screen for the new props.
apps/src/tests/single-feature-tests/stack-v5/index.ts	Adds the new scenario to the scenario group exports/registry.
android/src/main/java/com/swmansion/rnscreens/stack/header/config/StackHeaderInvalidationFlags.kt	Adds invalidation flag for background color changes.
android/src/main/java/com/swmansion/rnscreens/stack/header/config/StackHeaderConfigurationProviding.kt	Adds background color fields to the configuration provider contract.
android/src/main/java/com/swmansion/rnscreens/stack/header/config/StackHeaderConfigViewManager.kt	Wires new props from RN to the view.
android/src/main/java/com/swmansion/rnscreens/stack/header/config/StackHeaderConfig.kt	Stores new props and invalidates appropriately.
android/src/main/java/com/swmansion/rnscreens/stack/header/StackHeaderCoordinatorLayout.kt	Applies background colors when invalidated.
android/src/main/java/com/swmansion/rnscreens/stack/header/StackHeaderApplicator.kt	Implements application of background/scrim/lift colors.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: d07de3ee-34dd-47cf-a92f-cc316616e02f

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}