appandflow / appandflow/react-native-safe-area-context

ios Safe Area is Not Working in the model

Open
#677 12 comments 11 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
2.8k
Forks
258
Avg merge
3d 1h
Merged PRs (30d)
2

Description

### Description

Description

When rendering a inside a native React Native , safe area insets are not applied on iOS devices (e.g., notch or home indicator areas are ignored).

The same SafeAreaView works correctly when used in the main app tree.

Expected Behavior

SafeAreaView should respect safe area insets on iOS even when rendered inside a .

Actual Behavior

Insets are always 0 inside on iOS. The content touches the notch and bottom safe areas.

### Steps to reproduce

1. Wrap app with at the root.
2. Create a with a inside.
3. Render it on an iPhone with a notch.
4. Observe that there’s no padding at the top or bottom.

### Snack or a link to a repository

nope

### Safe Area Context version

5.6.2

### React Native version

0.81.5

### Platforms

iOS

### Build type

Debug mode

### Device

iOS simulator

### Device model

iphone 16 pro max

### Acknowledgements

Yes

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.