如何在Flutter中更改状态栏颜色？

Question

我正在尝试将状态栏颜色更改为白色。我发现这个酒吧扑腾https://pub.dartlang.org/packages/flutter_statusbarcolor。我试图在我的dart文件（main和其他）上使用示例代码。

Answer 1

在我的应用程序中工作完全正常

import 'package:flutter_statusbarcolor/flutter_statusbarcolor.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    FlutterStatusbarcolor.setStatusBarColor(Colors.white);
    return MaterialApp(
      title: app_title,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(title: home_title),
    );
  }
}

UPD：另一个解决方案

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.white
));

Answer 2

您可以使用SystemChrome类更改状态栏和导航栏颜色。首先进口

import 'package:flutter/services.dart';

在此之后，您需要添加以下行（更好的位置将这些行放在您的main()方法中）

void main() {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    systemNavigationBarColor: Colors.blue, // navigation bar color
    statusBarColor: Colors.pink, // status bar color
  ));
}

Answer 3

你也可以使用这个lib eazy和short flutter_statusbarcolor 0.2.0进行自定义

Answer 4

试试这个：

return MaterialApp(
    ...
    theme: ThemeData(
        primarySwatch: Colors.deepPurple
    ),
    ...
);

Answer 5

在main.dart文件导入服务，如下

  import 'package:flutter/services.dart';

和内部构建方法只需在返回之前添加此行

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.orange
)); 

像这样：

@override
 Widget build(BuildContext context) {
   SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
       statusBarColor: CustomColors.appbarcolor
    ));
    return MaterialApp(
    home: MySplash(),
    theme: ThemeData(
      brightness: Brightness.light,
      primaryColor: CustomColors.appbarcolor,
    ),
  );
 }

Answer 6

你想要的是主题。它们比AppBar颜色更重要。

https://flutter.io/cookbook/design/themes/