【问题标题】:Remove AppBar but keeping StatusBar in Flutter删除 AppBar 但在 Flutter 中保留 StatusBar
【发布时间】:2020-05-18 20:46:09
【问题描述】:

如何在没有 AppBar 的情况下为 StatusBar 设置自定义颜色?

要自定义状态栏颜色,我使用了以下代码:

appBar: AppBar(
    backgroundColor: Colors.teal
)

如果我删除appbar,我将无法自定义状态栏。我该怎么做?

如何删除 AppBar 但保留 StatusBar?

【问题讨论】:

    标签: flutter flutter-layout


    【解决方案1】:

    main.dart 的主方法文件中添加这个runApp 方法之后

    SystemChrome.setSystemUIOverlayStyle(
            SystemUiOverlayStyle(statusBarColor: <YOUR STATUS BAR COLOR>));
    

    像这样:

    void main(){
     runApp(MyApp());
    SystemChrome.setSystemUIOverlayStyle(
                SystemUiOverlayStyle(statusBarColor: <YOUR STATUS BAR COLOR>));
    }
    

    如果您使用的是SafeArea,则需要将其top 属性设置为false

    【讨论】:

    • 好的,感谢您的确认。就我而言,它不起作用,所以我添加了。
    【解决方案2】:

    你也可以用这个

    @override
    Widget build(BuildContext context) {
       return Container(
         color: Your Color Here,
         child: SafeArea(
            bottom: false,
            child: Scaffold(
          ),
        ),
      );
    }
    

    【讨论】:

      【解决方案3】:

      您可以使用以下代码更改状态栏颜色第一步您必须导入下面给出的这个包

      "import 'package:flutter/services.dart';

      然后将此代码添加到您的 main.dart 文件中

      void main(){SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(statusBarColor:Colors.blue,));}
      

      【讨论】:

        【解决方案4】:

        我们可以简单地使用AppBar 来实现,在下面的代码中backgroundColor: Colors.green 被应用于状态栏。

        Scaffold(
          appBar: AppBar(
            systemOverlayStyle: SystemUiOverlayStyle.dark,
            backgroundColor: Colors.green,
            elevation: 0,
            toolbarHeight: 0,
          ),
          backgroundColor: Colors.white38,
          body: Container(),
        )
        

        预览:

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2018-08-07
          • 1970-01-01
          • 2018-06-29
          • 2019-10-27
          • 2011-05-13
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多