Scrollable content does not extend into unsafe areas
Why it matters
Scrollable content without safe-area insets disappears under the notch, status bar, and home indicator during scroll — the top row of a feed vanishes behind the Dynamic Island, and the bottom action bar slides under the home indicator where it cannot be tapped. Users perceive this as content loss, not a styling bug, and the bottom home indicator collision is specifically called out in the Apple HIG as a reviewer-blocking issue.
Severity rationale
Medium because scrollable overlap degrades readability but the rest of the screen still functions.
Remediation
Wrap every ScrollView and FlatList in SafeAreaView, or set contentInsetAdjustmentBehavior="automatic" so the system manages top and bottom insets:
<SafeAreaView style={{ flex: 1 }}>
<ScrollView contentInsetAdjustmentBehavior="automatic">{/* content */}</ScrollView>
</SafeAreaView>
For lists fixed to the screen edge, prefer contentInsetAdjustmentBehavior over SafeAreaView so the scroll indicator still reaches the edge.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Mobile UX Patterns Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
Taxons
History
- 2026-04-18·v1.0.0·Initial import from mobile-ux-patterns·automated