Wrap list in SafeAreaView

example/App.js

@@ -1,7 +1,11 @@
 import React from 'react';
 import Expo from 'expo';
 import { FlatList, I18nManager } from 'react-native';
-import { createAppContainer } from '@react-navigation/native';
+import {
+  createAppContainer,
+  SafeAreaView,
+  ScrollView,
+} from '@react-navigation/native';
 import {
   Assets as StackAssets,
   createStackNavigator,
@@ -99,6 +103,7 @@ class Home extends React.Component {
         ItemSeparatorComponent={Divider}
         renderItem={this._renderItem}
         keyExtractor={this._keyExtractor}
+        renderScrollComponent={props => <SafeAreaScrollView {...props} />}
         data={data}
         style={{ backgroundColor: '#fff' }}
       />
@@ -106,6 +111,17 @@ class Home extends React.Component {
   }
 }
 
+class SafeAreaScrollView extends React.Component {
+  render() {
+    let { children, ...scrollViewProps } = this.props;
+    return (
+      <ScrollView {...scrollViewProps}>
+        <SafeAreaView forceInset={{ top: 'never' }}>{children}</SafeAreaView>
+      </ScrollView>
+    );
+  }
+}
+
 const Root = createStackNavigator(
   {
     Home: createStackNavigator({ Home }),

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-navigation-stack",
-  "version": "1.0.0-alpha.27",
+  "version": "1.0.0-alpha.28",
   "description": "Stack navigator component for React Navigation",
   "main": "dist/index.js",
   "files": [