Commit 9d18367
Fix measureInWindow on Android edge-to-edge (#56056)
Summary:
Fixes `measureInWindow` on Android when edge-to-edge is enabled.
Both `ReactSurfaceView.viewportOffset` and `RootViewUtil.getViewportOffset` subtract the visible window frame (status bar insets, split screen offsets) from `getLocationOnScreen` / `getLocationInWindow` coordinates. This is incorrect in edge-to-edge mode, where the content already extends behind system bars.
Related issue: #50509
## Changelog:
[ANDROID] [FIXED] - Fix `measureInWindow` returning incorrect coordinates when edge-to-edge is enabled
Pull Request resolved: #56056
Test Plan:
Tested `measureInWindow` with and without edge-to-edge enabled, in both single-window and split-screen configurations. Verified that returned coordinates correctly reflect the view's position relative to the visible content area.
For that, in `RNTesterActivity.kt`, comment:
```kt
// reactDelegate?.reactRootView?.let { rootView ->
// val insetsType: Int =
// WindowInsetsCompat.Type.systemBars() or WindowInsetsCompat.Type.displayCutout()
// val windowInsetsListener = { view: View, windowInsets: WindowInsetsCompat ->
// val insets = windowInsets.getInsets(insetsType)
// (view.layoutParams as FrameLayout.LayoutParams).apply {
// setMargins(insets.left, insets.top, insets.right, insets.bottom)
// }
// WindowInsetsCompat.CONSUMED
// }
// ViewCompat.setOnApplyWindowInsetsListener(rootView, windowInsetsListener)
// }
```
And in `RNTesterAppShared.js` replace `export default RNTesterApp` with:
```js
export default () => {
const ref = React.useRef<View>(null);
const [measure, setMeasure] = React.useState<string>('');
const [measureInWindow, setMeasureInWindow] = React.useState<string>('');
const [onLayoutOutput, setOnLayoutOutput] = React.useState<string>('');
React.useLayoutEffect(() => {
ref.current?.measure(
(
x: number,
y: number,
width: number,
height: number,
pageX: number,
pageY: number,
) => {
setMeasure(
`(${x}, ${y}) / ${width} x ${height}; \n page=(${pageX}, ${pageY})`,
);
},
);
}, []);
React.useLayoutEffect(() => {
ref.current?.measureInWindow(
(x: number, y: number, width: number, height: number) => {
setMeasureInWindow(`(${x}, ${y}) / ${width} x ${height};})`);
},
);
}, []);
return (
<View
ref={ref}
style={{flex: 1, justifyContent: 'center'}}
onLayout={e => {
setOnLayoutOutput(JSON.stringify(e.nativeEvent.layout));
}}>
<Text>Measure: {measure}</Text>
<Text>measureInWindow: {measureInWindow}</Text>
<Text>onLayout: {onLayoutOutput}</Text>
</View>
);
};
```
## Screenshots:
#### Android 16 / edge-to-edge on - current behavior
<img width="265" height="489" alt="Android 16 (edge-to-edge on - no fix)" src="https://github.com/user-attachments/assets/71c62742-e835-42f1-9e79-23d5fc37e9a2" />
#### Android 16 / edge-to-edge on - with fix
<img width="265" height="489" alt="Android 16 (edge-to-edge on - fixed)" src="https://github.com/user-attachments/assets/9e5b5095-3b3a-490d-bf81-2ef721a9db5e" />
#### Android 14 / edge-to-edge off - current behavior
<img width="260" height="483" alt="Android 14 (edge-to-edge off - no fix)" src="https://github.com/user-attachments/assets/31c1776b-8abc-45ac-8796-de81a62aff78" />
#### Android 14 / edge-to-edge off - with fix (no change)
<img width="260" height="483" alt="Android 14 (edge-to-edge off - fixed)" src="https://github.com/user-attachments/assets/b60e4c2f-5893-4383-8ae1-547cf07aa8c9" />
Reviewed By: javache
Differential Revision: D101308387
Pulled By: alanleedev
fbshipit-source-id: 27dfe0692b2da6c63bada685bb9c2544673f097b1 parent 4aa375b commit 9d18367
2 files changed
Lines changed: 38 additions & 17 deletions
File tree
- packages/react-native/ReactAndroid/src/main/java/com/facebook/react
- runtime
- uimanager
Lines changed: 21 additions & 10 deletions
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
15 | 15 | | |
16 | 16 | | |
17 | 17 | | |
| 18 | + | |
| 19 | + | |
18 | 20 | | |
19 | 21 | | |
20 | 22 | | |
| |||
26 | 28 | | |
27 | 29 | | |
28 | 30 | | |
| 31 | + | |
29 | 32 | | |
30 | 33 | | |
31 | 34 | | |
| |||
46 | 49 | | |
47 | 50 | | |
48 | 51 | | |
49 | | - | |
50 | | - | |
51 | | - | |
52 | | - | |
53 | | - | |
54 | | - | |
55 | | - | |
56 | | - | |
57 | | - | |
58 | | - | |
| 52 | + | |
| 53 | + | |
| 54 | + | |
| 55 | + | |
| 56 | + | |
| 57 | + | |
| 58 | + | |
| 59 | + | |
| 60 | + | |
| 61 | + | |
| 62 | + | |
| 63 | + | |
| 64 | + | |
| 65 | + | |
| 66 | + | |
| 67 | + | |
| 68 | + | |
| 69 | + | |
59 | 70 | | |
60 | 71 | | |
61 | 72 | | |
| |||
Lines changed: 17 additions & 7 deletions
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
8 | 8 | | |
9 | 9 | | |
10 | 10 | | |
11 | | - | |
12 | 11 | | |
13 | 12 | | |
| 13 | + | |
| 14 | + | |
14 | 15 | | |
| 16 | + | |
15 | 17 | | |
16 | 18 | | |
17 | 19 | | |
| |||
34 | 36 | | |
35 | 37 | | |
36 | 38 | | |
37 | | - | |
38 | | - | |
39 | | - | |
40 | | - | |
41 | | - | |
42 | | - | |
| 39 | + | |
| 40 | + | |
| 41 | + | |
| 42 | + | |
| 43 | + | |
| 44 | + | |
| 45 | + | |
| 46 | + | |
| 47 | + | |
| 48 | + | |
| 49 | + | |
| 50 | + | |
| 51 | + | |
| 52 | + | |
43 | 53 | | |
44 | 54 | | |
45 | 55 | | |
0 commit comments