在Flutter App上隐藏Android状态栏

Question

如何在Flutter应用程序中隐藏Android状态栏？

Answer 1

import 'package:flutter/services.dart';

1.隐藏状态栏

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom])

2.透明状态栏

 SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.transparent,
 ));

3.显示状态栏

SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);

您需要将此代码放在：

1.对于单屏

@override
  void initState() {
    // put it here
    super.initState();
  }

2.对于main.dart中的所有页面：

 void main() {
      // put it here
      runApp(...);
  }

Answer 2

SystemChrome.setEnabledSystemUIOverlays([]) 应该做你想做的事.

你可以带回来SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values).

使用导入它

import 'package:flutter/services.dart';

Answer 3

现在， Flutter 2.5支持 Android 上的各种全屏模式，这些答案中的大多数都已经过时了。

现在，隐藏状态栏的建议方法是：

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);

您可以将 SystemUiMode 设置为以下任何SystemUiMode 枚举：

• 沉浸式
• 沉浸式粘性
• 往后靠
• 边到边

Answer 4

对于单页（在页面文件中）：

@override
  void initState() {
    SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
    super.initState();
  }

  @override
  void dispose() {
    SystemChrome.setEnabledSystemUIOverlays(
        [SystemUiOverlay.top, SystemUiOverlay.bottom]);
    super.dispose();
  }

对于所有页面（在 main.dart 中）：

void main() {
  SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
  runApp(MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(fontFamily: 'Poppins'),
      home: SplashScreen()));
}

不要忘记 import 'package:flutter/services.dart'

Answer 5

您可以使用SystemChrome.setEnabledSystemUIOverlays([])隐藏SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values)并将其重新带回。

但是，目前会有少量灰色区域，目前还没有针对此问题的解决方案。隐藏状态栏时，应用栏的高度保持不变。

参见github问题：https : //github.com/flutter/flutter/issues/14432

Answer 6

您可以在主函数中添加以下代码以隐藏状态栏。

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.transparent,
));

Answer 7

从 flutter 2.5 开始，setEnabledSystemUIOverlays您可以通过以下方式消失状态栏：

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);

并恢复它

SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);

您还可以将List<SystemUiOverlay>? overlays较旧的答案状态作为第二个命名参数传递给函数，如下所示：

SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge,overlays: [])

在列表中，您可以指定是否显示SystemUiOverlay.bottom，SystemUiOverlay.top或者通过将列表留空来指定不显示[]

编辑感谢皮埃尔：

在这里阅读有关不同 SystemUiMode 的更多信息：