Flutter - Status Bar背景色和文字颜色

5,177 阅读1分钟

1, 设置Status Bar的背景颜色
直接在main()函数中,runApp()函数的下方,设置statusBarColor
注意下面的设置方式,都是在if (Platform.isAndroid) 安卓平台下设置的。

void main() {
  runApp(MyApp());
  if (Platform.isAndroid) {
    SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(
        statusBarColor: Colors.green, //设置为透明
        );
    SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
  }
}

如果想status bar的背景颜色设置成和AppBar颜色一直,只要设置statusBarColor: Colors.transparent

2,设置Status Bar上文字,icon的颜色
有两种颜色dark(黑色)和light(白色) 分为两种情况:
(1)AppBar存在的情况

        appBar: AppBar(
          backgroundColor: Colors.purple, //这样会覆盖primaryColor的设置
          title: Text("Cams"),
          brightness: Brightness.light, //带appbar的这里设置light,statusbar的文字颜色就是dark,刚好相反
        ),

设置了AppBar的brightness为Brightness.light,status bar上文字和icon颜色就是相反的,为dark。 有AppBar的情况,在main()函数中设置statusBarIconBrightness是不生效的。
(2)不存在AppBar的情况
直接在main()函数中设置

void main() {
  runApp(MyApp());
  if (Platform.isAndroid) {
    SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(
        statusBarColor: Colors.green, //设置为透明
        statusBarIconBrightness: Brightness.light
        );
    SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
  }
}

3,如果不想要状态栏(比如splash界面)

SystemChrome.setEnabledSystemUIOverlays([]);//全屏,不显示状态栏,也不现实底部虚拟键盘

想要控制它显示 :
 SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]); //top : bottom