我认为这对你有帮助:

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
        systemNavigationBarColor: Colors.white, // navigation bar color
        statusBarColor: Colors.white, // status bar color
        statusBarIconBrightness: Brightness.dark, // status bar icons' color
        systemNavigationBarIconBrightness: Brightness.dark, //navigation bar icons' color
    ));

适用于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

大多数答案都是使用只适用于安卓系统的SystemChrome。我的解决方案是将AnnotatedRegion和SafeArea合并到新的小部件中，这样它也可以在iOS中工作。我可以在没有AppBar的情况下使用它。

class ColoredStatusBar extends StatelessWidget {
  const ColoredStatusBar({
    Key key,
    this.color,
    this.child,
    this.brightness = Brightness.dark,
  }) : super(key: key);

  final Color color;
  final Widget child;
  final Brightness brightness;

  @override
  Widget build(BuildContext context) {
    final defaultColor = Colors.blue;
    final androidIconBrightness =
        brightness == Brightness.dark ? Brightness.light : Brightness.dark;
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: color ?? defaultColor,
        statusBarIconBrightness: androidIconBrightness,
        statusBarBrightness: brightness,
      ),
      child: Container(
        color: color ?? defaultColor,
        child: SafeArea(
          bottom: false,
          child: Container(
            child: child,
          ),
        ),
      ),
    );
  }
}

用法:把它放在页面小部件的顶部。

@override
Widget build(BuildContext context) {
  return ColoredStatusBar(
    child: /* your child here */,
  );
}

我通过改变整个背景颜色来解决这个问题，如下所示:

在主界面:

return Scaffold(
      backgroundColor: Colors.black,
      body: SafeArea(
     ),
);

使它像你的应用程序栏颜色

import 'package:flutter/material.dart';

 Widget build(BuildContext context) {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
      systemNavigationBarColor: Colors.transparent,
  ));
 }