エキサイト株式会社の高野です。
今回はFlutterを書いていく中でiOSでstatusBarが表示されない(消えてる)問題の解決に当たっていたのでその辺りについて書いていこうと思います。
環境
iOS: 14.5 Flutter: 2.0.6 Android Studio: 4.1.3
解決方法
先にXcodeの方でProjectの設定を確認しておきます。
XcodeでProjectをクリック→TARGETSをクリック→Deployment Info
こちらを確認して Status Bar Style の Hide status bar のチェックボックスが外れていることを確認します。
外れていれば次にコードを紹介します。
import 'package:flutter/services.dart';
こちらをインポートし、以下のメソッドを使用していきます。
SystemChrome.setEnabledSystemUIOverlays([]);
こちらを使用することにより、statusBarを非表示にすることができます。
ですが、このまま使うとAndroidの方にも影響が出てしまうので[]のなかに
SystemUiOverlay.bottom を追加します。
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
表示にする場合は、さらに SystemUiOverlay.top を追加してあげることにより表示することができます。
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top, SystemUiOverlay.bottom]);
自分の好きなタイミングで発火しましょう。
まとめ
これで柔軟にstatusBarの表示非表示をハンドリングできます。 他にもやる方法があるよという部分や疑問に思ったところがあればコメントしていただけると幸いです。
