如何在 Flutter 中更改底部导航下方 space 的 bgcolor

Question

使用手势导航时，如何更改底部导航下方区域的背景颜色。

Answer 1

您需要使用 Safe Area 小部件包装您的小部件。之后需要设置bottom 属性 false

Answer 2

您可以使用 flutter_statusbarcolor_ns 包来实现您的要求。

以上包可以帮助您以编程方式更改 Flutter 应用程序的状态栏颜色或导航栏颜色。

Answer 3

好的，经过大量的摆弄，我得出了这个答案。

我们需要用 AnnotatedRegion.

包裹 material app/scaffold

所以我按以下方式更改了我的main.dart：

AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: Colors.transparent, //top status bar
        systemNavigationBarColor: Colors.black, // navigation bar color, the one Im looking for
        statusBarIconBrightness: Brightness.dark, // status bar icons' color
        systemNavigationBarIconBrightness:
            Brightness.dark, //navigation bar icons' color
      ),
      child: MaterialApp(
        debugShowCheckedModeBanner: false,

重建工作顺利。

希望对您有所帮助！ :)

如何在 Flutter 中更改底部导航下方 space 的 bgcolor

How to change bgcolor of space below bottom navigation in Flutter

flutter

flutter-theme

flutter-bottomnavigation