在 Flutter 中仅更改状态栏的颜色

如何解决在 Flutter 中仅更改状态栏的颜色

我有一个这样的布局，我只想更改状态栏的颜色，因为我没有使用过 Appbar。

这是我为此使用的代码：

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(children: [
          Container(
              color: Colors.green,padding: EdgeInsets.all(15),child: TextFormField(
                cursorColor: Colors.green,decoration: Inputdecoration(
                  contentPadding:
                      EdgeInsets.symmetric(vertical: 0.0,horizontal: 10.0),hintText: 'Search a product',fillColor: Colors.white,filled: true,prefixIcon: Visibility(
                    visible: true,child: Icon(
                      Icons.search,color: Colors.grey.shade900,),enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(6),borderSide: BorderSide(
                          color: Colors.grey.shade200,width: 1.5
                    )
                  ),)
              ),//AND OTHER ELEMENTS

        ],);
  }
}

我想将状态栏的颜色更改为更深的绿色

解决方法

你可以直接在你的应用栏内的 MaterialApp 栏主题中提供它

在 Material 应用程序全局主题中

MaterialApp(
        
          theme: ThemeData(
            appBarTheme: AppBarTheme(
              brightness: Brightness.dark,backwardsCompatibility: false,systemOverlayStyle:
                  SystemUiOverlayStyle(statusBarColor: Colors.orange),)

statusBarColor 是您要更改的 topBar 的颜色。 设置 backwardsCompatibility: false 很重要，因为它不起作用。

,

试试这个：

AppBar(
  backwardsCompatibility: false,systemOverlayStyle: SystemUiOverlayStyle(statusBarColor: Colors.orange),)

,

在我们的 main.dart 中，我们可以使用 SystemChrome 类：

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.green
));