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


当前回答

没有一个答案似乎提到,你可以在你的主MaterialApp小部件ThemeData函数。

return MaterialApp(
  theme: ThemeData(
    appBarTheme: const AppBarTheme(
      systemOverlayStyle: SystemUiOverlayStyle(
        statusBarColor: Colors.white,
      ),
    ),
  ),
),

这也可以在darkTheme ThemeData中完成。

其他回答

这(在脚手架内部)创建了一个带有浅色内容的黑色状态栏。(没有Appbar)

appBar: AppBar(
      toolbarHeight: 0,
      backgroundColor: Colors.black,
      systemOverlayStyle: SystemUiOverlayStyle.light,
    ),

在主要的。飞镖文件 导入服务如下

  import 'package:flutter/services.dart';

在build方法中,在返回之前添加这一行

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

更新Flutter 2.0(推荐):

在最新的Flutter版本上,您应该使用:

AppBar(
  systemOverlayStyle: SystemUiOverlayStyle(
    // Status bar color
    statusBarColor: Colors.red, 

    // Status bar brightness (optional)
    statusBarIconBrightness: Brightness.dark, // For Android (dark icons)
    statusBarBrightness: Brightness.light, // For iOS (dark icons)
  ),
)

只有Android(更灵活):

import 'package:flutter/services.dart';

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

iOS和Android:

appBar: AppBar(
  backgroundColor: Colors.red, // Status bar color
)

这有点老套,但适用于iOS和Android:

Container(
  color: Colors.red, // Status bar color
  child: SafeArea(
    left: false,
    right: false,
    bottom: false,
    child: Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.blue, // App bar color
      ),
    ),
  ),
) 

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

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

你可以在Android上使用:

 import 'package:flutter/services.dart';

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