react-nativeでandroidだけデバイス表示されない

こんにちは投資ロウトです。

背景

react-nativeで画面を実装する際に、iOSは問題ないが、androidだけ画面の上部が見切れてしまうという事象が発生してしまっている。

解決策

下記リンクが役立ちました。

https://stackoverflow.com/questions/51289587/how-to-use-safeareaview-for-android-notch-devices

結論から言いますと以下のソースコードをsafeareaviewのstyleに適用させれば解決しました。

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