あるSEのつぶやき・改

IT・システム開発に関することをつぶやいています。

React Native+Expo+NativeBaseのAndroidでヘッダーが通知バーに覆いかぶさってしまう現象の解決方法


React Native + Expo + NativeBase のアプリで、Android の場合にヘッダーが通知バーに覆いかぶさってしまう現象が発生しました。

f:id:fnyablog:20191130230112p:plain:w480

解決方法は簡単で、app.jsonに以下の記述を追加するだけです。

    "androidStatusBarColor": "#334393",
    "androidStatusBar": {
      "barStyle": "light-content",
      "backgroundColor": "#334393"
    },

追加方法は、こちら を参考にするとよいかも。

一度、エミュレータを終了してから、再度表示するとちゃんと表示されました!

f:id:fnyablog:20191130230427p:plain:w480

デフォルト設定でちゃんと表示されないのには、若干疑問はありますけど。。

下記のissueを参考にさせていただきました。

github.com