如何在颤动中将状态栏图标和文本颜色更改为黑色？

Posted 2023-02-23

【中文标题】如何在颤动中将状态栏图标和文本颜色更改为黑色？

【英文标题】：How to change the status bar icons and text color to black in flutter?

【发布时间】：2021-10-11 21:03:48

【问题描述】：

我在 Flutter 中为 App Bar 使用白色背景，如何将状态栏图标颜色更改为黑色，

我正在使用此代码更改状态栏颜色，

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark.copyWith(
  statusBarColor: Colors.white,
  statusBarIconBrightness: Brightness.light,
));

【参考方案1】：

Flutter 2.4.0+ 更新

由于颤振 2.4.0 brightness: Brightness.dark 已弃用。

已替换为systemOverlayStyle: SystemUiOverlayStyle.dark

使用方法：

import 'package:flutter/services.dart';

appBar: AppBar(
    systemOverlayStyle: SystemUiOverlayStyle.dark,
    elevation: 0.0,
),

如果你想要黑色图标，请设置SystemUiOverlayStyle.dark。

如果你想要白色图标，请设置SystemUiOverlayStyle.light。

【参考方案2】：

如果您使用的是brightness，您还需要在AppBar 中设置为brightness。例如。

appBar: AppBar(
        backgroundColor: Colors.white,
        brightness: Brightness.dark,
),

您可以在这里查看详细答案：How to change status bar color in Flutter?

【参考方案3】：

您好，在我的项目中，我使用以下内容（使用 Brightness 已过时）

没有 AppBar：

return AnnotatedRegion<SystemUiOverlayStyle>(
            //Set status bar icon color
            value: your_condition
                ? SystemUiOverlayStyle.dark.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  )
                : SystemUiOverlayStyle.light.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  ),
            child: your_widget);

使用 AppBar：

return AppBar(
    elevation: 0.0,
    systemOverlayStyle: your_condition ? SystemUiOverlayStyle.dark : SystemUiOverlayStyle.light,
    backgroundColor: your_color,
);

您可以结合使用上述两种方法来实现您的目标