我正在尝试改变状态栏的颜色为白色。我偶然发现了这家酒吧。我尝试在我的dart文件中使用示例代码。


当前回答

你可以改变它没有appbar给脚手架(backgroundColor: color);如果你把身体包裹起来,问题可能就解决了。我的意思是这个解决方案不是实践,但如果你不使用appbar,你可以用这种方式实现。

其他回答

你可以这样做,

SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        statusBarColor: Colors.grey.withOpacity(0.5),
        statusBarIconBrightness: Brightness.dark,
        statusBarBrightness:
            Platform.isAndroid ? Brightness.dark : Brightness.light,
        systemNavigationBarColor: Colors.white,
        systemNavigationBarDividerColor: Colors.grey,
        systemNavigationBarIconBrightness: Brightness.dark,
      ),
    );

将此代码添加到主程序中。省道构建方法,

编辑为Flutter 2.0.0

当你在屏幕上有一个应用程序栏时,下面的答案就不再适用了。现在需要配置AppBarTheme。亮度和AppBarTheme。在这种情况下,systemOverlayStyle正确。

回答

而不是经常建议SystemChrome.setSystemUIOverlayStyle(),这是一个系统范围的服务,不会在不同的路由上重置,你可以使用AnnotatedRegion<SystemUiOverlayStyle>,这是一个小部件,只对你包装的小部件有效。

AnnotatedRegion<SystemUiOverlayStyle>(
   value: SystemUiOverlayStyle(
      statusBarColor: Colors.white,
  ),
  child: Scaffold(
      ...
  ),
)

使用AnnotatedRegion是最适合我的,特别是如果我没有AppBar

import 'package:flutter/services.dart';

...

Widget build(BuildContext context) {
   return Scaffold(
      body: AnnotatedRegion<SystemUiOverlayStyle>(
         value: SystemUiOverlayStyle.light,                
         child: ...,
      ),
   );
}

适用于iOS和Android

import 'package:flutter/services.dart';

@override
Widget build(BuildContext context) {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark);

  return Scaffold();
}
    

我不能直接在帖子中评论,因为我还没有必要的声誉,但作者问了以下问题:

唯一的问题是背景是白色的,但时钟,无线和其他文本和图标也是白色的。我不知道为什么!!

对于任何来到这个帖子的人来说,这是对我有用的方法。状态栏的文本颜色由flutter/material.dart中的亮度常数决定。要改变这一点,调整SystemChrome解决方案,如下所示来配置文本:

    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.red,
      statusBarBrightness: Brightness.dark,
    ));

亮度的可能值为亮度。黑暗和光明。

文档: https://api.flutter.dev/flutter/dart-ui/Brightness-class.html https://api.flutter.dev/flutter/services/SystemUiOverlayStyle-class.html