react-native从0.50.1开始，提供了SafeAreaView来确保iPhone X的兼容性，效果如下：

代码如下：

import {
  ...
  SafeAreaView
} from 'react-native';
class Main extends React.Component {
  render() {
    return (
      <SafeAreaView style={styles.safeArea}>
        <App />
      </SafeAreaView>
    )
  }
}
const styles = StyleSheet.create({
  ...,
  safeArea: {
    flex: 1,
    backgroundColor: '#ddd'
  }
})

并且，SafeAreaView会在接打电话等需要调整状态栏高度的时候自动调整状态栏的高度：