Flutter - 禁用状态栏时，缺口区域为空白

Question

这是我的应用程序的正常外观：

我想隐藏状态栏区域和底部导航栏，以便全屏显示图像。

• 试过SystemChrome.setEnabledSystemUIOverlays([]); 状态栏区域被隐藏但状态栏有黑色或空白区域

• 如果我设置 SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);

然后我得到与 [image1][1] 相同的结果

• 如果我设置 SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);

我看到这个看起来很奇怪的导航栏，状态栏还在

• 如果我设置 SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

状态栏区域为黑色，出现导航栏

尝试有和没有安全区。仍然没有获得所需的全屏。

有什么办法可以使状态栏隐藏（不创建空白区域）并隐藏导航栏使图像全屏显示，即甚至利用缺口侧区域？

Answer 1

在styles.xml中添加以下行即可解决问题

<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>

参考：https : //github.com/flutter/flutter/issues/46486

Answer 2

这很简单。你可以通过将你的身体包裹成一个来解决这个问题SafeArea

Scaffold(
  body: SafeArea(
    child: Text("Hello"),
  ),
),