(React native) How to use SafeAreaView for Android notch devices?

Question

I\'m actually developing an app with react native and i\'m testing with my one plus 6 and it has a notch. The SafeAreaView is a solution for the iPhone X but for Android, it

Answer 1

Do something like

import { StyleSheet, Platform, StatusBar } from "react-native";

export default StyleSheet.create({
  AndroidSafeArea: {
    flex: 1,
    backgroundColor: "white",
    paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0
  }
});

And then In your App.js

import SafeViewAndroid from "./components/SafeViewAndroid";

 
           //OR whatever you want to render
        

This should work good as get height will take care of the knotch in android device by calculating the statusBar height and it will arrange accordingly.