Flutter 单独页面状态栏颜色改变backgroundColor和statusBarColor-Toy模板网

这篇具有很好参考价值的文章主要介绍了Flutter 单独页面状态栏颜色改变backgroundColor和statusBarColor。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.flutter中如果整个应用状态栏颜色是同一种颜色，可以在main方法里设置：

//设置状态栏颜色
SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(
    statusBarColor: Colors.transparent, //状态栏背景颜色
    statusBarIconBrightness: Brightness.dark // dark:一般显示黑色   light：一般显示白色
    ));

2.有些页面可能需要状态栏颜色和当前页面的颜色接近，需要单独修改，则在页面的appbar里进行设置：

   appBar: AppBar(
              elevation: 0,//去除状态栏下的一条阴影
              toolbarHeight: 0,
              systemOverlayStyle: SystemUiOverlayStyle(
                // statusBarColor: R.color.WHITE,
                  statusBarColor: Colors.transparent,
                systemNavigationBarColor: Color(0xFF000000),
                systemNavigationBarIconBrightness: Brightness.light,
                statusBarIconBrightness: Brightness.dark,
                statusBarBrightness: Brightness.light,
              ),
              // systemOverlayStyle: SystemUiOverlayStyle.dark,
              backgroundColor: R.color.WHITE,
            ),

这里backgroundColor和statusBarColor都是改变的是状态栏的颜色，statusBarColor是只生效于Android6.0以上的机器，并且statusBarColor会覆盖掉backgroundColor，如果前一个页面设置了statusBarColor，在这个页面没有重新设置的话，显示的依旧是上一个页面的statusBarColor；当设置statusBarColor为透明色的时候，那么状态栏的颜色就是backgroundColor。

对于页面自身来说，statusBarColor和backgroundColor没有太大区别，但是当这个页面使用弹窗时，如果statusBarColor不是透明话，弹窗时顶部的状态栏颜色也会是statusBarColor而不是阴影覆盖，所以有弹窗的页面最好还是把statusBarColor设为透明，backgroundColor设为想要的状态栏颜色，这样展示效果好一些，emmmmmm。

Flutter 单独页面状态栏颜色改变backgroundColor和statusBarColor