Add edge-to-edge opt-in support by zoontek · Pull Request #52088 · facebook/react-native

zoontek · 2025-06-17T15:55:02Z

Summary:

This follows #47554

Compared to the initial proposal, I had to remove the edgeToEdgeEnabled property from the root gradle.properties and put it in the app gradle.properties instead (explaining the AgpConfiguratorUtils.kt / GenerateEntryPointTask.kt / ProjectUtils.kt / PropertyUtils.kt changes)

This PR:

Enable edge-to-edge for MainActivity (when edgeToEdgeEnabled is set to true)
Disable StatusBar backgroundColor and translucent (when edgeToEdgeEnabled is set to true)
Enforce statusBarTranslucent and navigationBarTranslucent on Modal when edge-to-edge is enabled
Add an isEdgeToEdge constant to DeviceInfoModule for react-native-is-edge-to-edge detection

Changelog:

[Android] [Added] - Add edge-to-edge opt-in support

Test Plan:

Update enableEdgeToEdge value in packages/rn-tester/android/app/gradle.properties
Recompile

demo.mp4

facebook-github-bot · 2025-06-17T18:03:41Z

@sbuggay has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

facebook-github-bot · 2025-06-18T23:43:49Z

@sbuggay has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

zoontek · 2025-06-20T13:51:16Z

@sbuggay Do you need me to rebase?

cortinico · 2025-06-20T14:20:20Z

@sbuggay Do you need me to rebase?

Yeah that would be good. Also this PR is now driven by @alanleedev

zoontek · 2025-06-20T14:41:48Z

@cortinico @alanleedev Commits squashed + branch rebased against main ✅

facebook-github-bot · 2025-06-20T15:12:38Z

@alanleedev has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

alanleedev · 2025-06-23T15:11:35Z

@zoontek Need to fix code here: https://github.com/facebook/react-native/blob/main/packages/react-native/ReactCxxPlatform/react/coremodules/DeviceInfoModule.h#L31

using DeviceInfoConstants = NativeDeviceInfoDeviceInfoConstants<
    DimensionsPayload,
    std::optional<bool>,
    std::optional<bool>>;

zoontek · 2025-06-23T15:41:47Z

@alanleedev Done ✅

zoontek · 2025-06-25T05:58:05Z

@alanleedev I addressed the 2 feedbacks

facebook-github-bot · 2025-06-26T16:13:42Z

@alanleedev has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

facebook-github-bot · 2025-06-27T13:20:22Z

@alanleedev merged this pull request in 09ef774.

react-native-bot · 2025-06-27T13:20:23Z

This pull request was successfully merged by @zoontek in 09ef774

^{When will my fix make it into a release? | How to file a pick request?}

## 📜 Description This PR updates `react-native-is-edge-to-edge` to the latest version: `1.2.1` to support the `edgeToEdgeEnabled` flag that will be available in the next React Native release (facebook/react-native#52088) ## 📢 Changelog - Update `react-native-is-edge-to-edge`

## Summary This PR updates `react-native-is-edge-to-edge` to the latest version: `1.2.1`. As `edgeToEdgeEnabled` will be available in the next React Native release (facebook/react-native#52088), we need a new release of `react-native-reanimated`, as it uses a fixed version of the dependency for the moment. To prevent this kind of issue, if it must happens again, I removed the strict requirement on the version number (for reference, `react-native-screens` doesn't fix the version https://github.com/software-mansion/react-native-screens/blob/62eb784c6457be366a2daf6d6d074b7a586fa61e/package.json#L72)

## Summary This PR updates `react-native-is-edge-to-edge` to the latest version: `1.2.1`. As `edgeToEdgeEnabled` will be available in the next React Native release (facebook/react-native#52088), we need to ensure that `react-native-is-edge-to-edge` supports both `react-native-edge-to-edge` and `edgeToEdgeEnabled`. Similar issue on reanimated: software-mansion/react-native-reanimated#7729

fabiendem · 2025-08-28T17:50:35Z

@zoontek Sorry for the dumb question, but how does this play with your library https://github.com/zoontek/react-native-edge-to-edge/?
Does this PR mean that your library is not needed (I am assuming that's not the case but I am not sure) if I want to support edge-to-edge in my app? Is an update of React Native to 0.81 enough?

I can't tell from the blog post https://reactnative.dev/blog/2025/08/12/react-native-0.81#highlights-1 and your repo.

Cheers!

zoontek · 2025-08-29T08:18:54Z

@fabiendem Good question, actually! I answered here.

fabiendem · 2025-08-29T12:20:10Z

@fabiendem Good question, actually! I answered here.

Great thanks, will check and discuss over there 👍

facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Jun 17, 2025

zoontek mentioned this pull request Jun 17, 2025

Fix Dimensions window values on Android < 15 #47554

Closed

facebook-github-bot added the Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. label Jun 17, 2025

alanleedev reviewed Jun 17, 2025

View reviewed changes

Comment thread packages/react-native/ReactAndroid/src/main/java/com/facebook/react/common/EdgeToEdge.kt Outdated

cortinico reviewed Jun 18, 2025

View reviewed changes

zoontek mentioned this pull request Jun 18, 2025

Add edgeToEdgeEnabled gradle property react-native-community/template#144

Merged

zoontek force-pushed the add-enable-edge-to-edge branch 2 times, most recently from 0515f30 to 63da6e7 Compare June 20, 2025 14:40

zoontek force-pushed the add-enable-edge-to-edge branch from c431f28 to b1614e2 Compare June 20, 2025 14:44

alanleedev reviewed Jun 24, 2025

View reviewed changes

Comment thread ...e-plugin/react-native-gradle-plugin/src/main/kotlin/com/facebook/react/utils/ProjectUtils.kt Outdated

alanleedev reviewed Jun 24, 2025

View reviewed changes

Comment thread packages/react-native/ReactAndroid/src/main/java/com/facebook/react/ReactActivityDelegate.java Outdated

zoontek added 3 commits June 25, 2025 06:59

Implement enableEdgeToEdge

cf8e836

Fix DeviceInfoModule.h constants

c9d290c

Fix nullable window lint error

63a176a

zoontek force-pushed the add-enable-edge-to-edge branch from 7f341b8 to c9d290c Compare June 25, 2025 05:52

alanleedev reviewed Jun 25, 2025

View reviewed changes

Comment thread ...react-native/ReactAndroid/src/main/java/com/facebook/react/views/modal/ReactModalHostView.kt Outdated

alanleedev reviewed Jun 26, 2025

View reviewed changes

Comment thread ...ct-native/ReactAndroid/src/main/java/com/facebook/react/modules/statusbar/StatusBarModule.kt

Override getter instead of setter

376f312

zoontek mentioned this pull request Jun 26, 2025

Add mention of ReactActivity in the edgeToEdgeEnabled comment react-native-community/template#145

Merged

facebook-github-bot closed this in 09ef774 Jun 27, 2025

facebook-github-bot added the Merged This PR has been merged. label Jun 27, 2025

zoontek deleted the add-enable-edge-to-edge branch June 27, 2025 13:31

zoontek mentioned this pull request Jul 14, 2025

chore: update react-native-is-edge-to-edge to 1.2.1 software-mansion/react-native-screens#2995

Merged

taylorkline mentioned this pull request Nov 3, 2025

KeyboardProvider handes edgeToEdgeEnabled=false differently than React Native for Android versions 14 and below kirillzyusko/react-native-keyboard-controller#1192

Open

Conversation

zoontek commented Jun 17, 2025

Summary:

Changelog:

Test Plan:

Uh oh!

facebook-github-bot commented Jun 17, 2025

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

facebook-github-bot commented Jun 18, 2025

Uh oh!

zoontek commented Jun 20, 2025

Uh oh!

cortinico commented Jun 20, 2025

Uh oh!

zoontek commented Jun 20, 2025

Uh oh!

facebook-github-bot commented Jun 20, 2025

Uh oh!

alanleedev commented Jun 23, 2025

Uh oh!

zoontek commented Jun 23, 2025

Uh oh!

Uh oh!

Uh oh!

zoontek commented Jun 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

facebook-github-bot commented Jun 26, 2025

Uh oh!

facebook-github-bot commented Jun 27, 2025

Uh oh!

react-native-bot commented Jun 27, 2025

Uh oh!

fabiendem commented Aug 28, 2025

Uh oh!

zoontek commented Aug 29, 2025

Uh oh!

fabiendem commented Aug 29, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

zoontek commented Jun 25, 2025 •

edited

Loading