ToB企服应用市场:ToB评测及商务社交产业平台

标题: Flutter 单独页面状态栏颜色改变backgroundColor和statusBarColor [打印本页]

作者: 守听 时间: 2024-7-22 08:30
标题: 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。

差不多就是这种区别，感觉statusBarColor可能是修改的最上层的图层吧，搞不懂。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/)