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


当前回答

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

其他回答

如果你想改变整个应用程序的状态颜色,你可以像这样使用primaryColorDark属性:

void main() {
  runApp(
    MaterialApp(
      home: HomeWidget(),
      theme: ThemeData(
        primaryColorDark: Colors.white,
      ),
    ),
  );
}

编辑为Flutter 2.0.0

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

回答

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

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

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

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),
    );
  }
}

(包)

乌利希期刊指南: 推荐解决方案(Flutter 2.0及以上)

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

对于那些有iOS和Android颜色不一致的问题的人来说,这个方法对我来说很管用:

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

return AppBar(
      systemOverlayStyle: (Platform.isIOS)
          ? SystemUiOverlayStyle.light
          : const SystemUiOverlayStyle(
            statusBarColor: pbsBlue,
            statusBarIconBrightness: Brightness.light,
            statusBarBrightness: Brightness.light,
          ),
      backgroundColor: Colors.blue,
      title: Text('Home'),
    );

请注意,这是AppBar可重用小部件的摘录。

首先你要导入这一行:

import 'package:flutter/services.dart';

然后你可以在main中使用下面这一行代码。飞镖文件

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
systemNavigationBarColor: Colors.amber, // navigation bar color
statusBarColor: Colors.white, // status bar color
statusBarIconBrightness: Brightness.dark, // status bar icon color
systemNavigationBarIconBrightness: Brightness.dark, // color of navigation controls
));

注意:如果你沿着这个陡坡走。因此你可以控制整个屏幕。但是如果你控制单个屏幕状态栏的颜色,那么你可以试试这个…

import 'package:flutter/services.dart';

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