如何在 Flutter 中使 StatusBar 对 Android 透明

Posted 2023-04-18

【中文标题】如何在 Flutter 中使 StatusBar 对 Android 透明

【英文标题】：How make the StatusBar transparent for Android in Flutter

【发布时间】：2021-09-21 14:53:00

【问题描述】：

我想在 Flutter 中让 android 的 StatusBar 透明，但由于某种原因，我的 StatusBar 在某些屏幕上变黑了。 最低 SDK 为 20，目标 SDK 为 30。

我已经厌倦了这里的所有建议，但没有任何效果：How to hide Android StatusBar in Flutter

另外，我已经尝试使用 Flutter 包来更改状态栏颜色：

import 'package:flutter_statusbarcolor/flutter_statusbarcolor.dart';

void main() 
  runApp(MyApp());


class MyApp extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    FlutterStatusbarcolor.setStatusBarColor(Colors.transparent);
    ...
  

我已经尝试在每个页面上放置此代码：

@override
  initState() 
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
    ));
    super.initState();
  

通过上面的两个示例代码，我只设法使状态栏颜色对启动屏幕透明，其中我还有一个背景图像。此处示例：

一旦应用程序加载，状态栏就会变黑：

更奇怪的是，当我切换应用程序屏幕时，StatusBar 中的文本也会变成黑色，并一直保持这种状态，直到应用程序重新启动：

我想黑色状态栏可能是由于我的应用程序中的主题设置或其他设置影响了状态栏，但注意到我到目前为止尝试过的工作。

理想情况下，我想让 StatusBar 透明，并根据背景颜色在黑色和白色之间切换文本。可以手动设置透明度和文字颜色，只要能用就可以了。

有什么建议吗？

【问题讨论】：

你使状态栏透明，因为原来的颜色是黑色的，所以显示出来了。这就是我们的想法

如果原色是黑色，那不是我设置的。主题是默认设置的吗？我在哪里可以更改它？

【参考方案1】：

在您的 main.dart 文件中，执行此操作 ->

void main() 
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.red));
  runApp(App(
  ));

这样您就不必在每个文件中编写代码。

【讨论】：

不幸的是，这与将代码放在每个页面上的效果相同，并且无法按预期对我的应用程序运行。