SafeAreaView 设置安全区的外部

render() {

        return (
            <>
            <SafeAreaView style={{flex: 0,backgroundColor:'red'}}>
              <View style={{alignItems:'center',justifyContent:'center'}}>
                <Text>top</Text>
              </View>
            </SafeAreaView>
            <SafeAreaView style={styles.container}>

              </SafeAreaView>
              <SafeAreaView style={{flex: 0,backgroundColor:'green'}}>
                <View style={{alignItems:'center',justifyContent:'center'}}>
                  <Text>bottom</Text>
                </View>

              </SafeAreaView>

            </>
        )
    }