在 Flutter 的 MaterialApp 中，scaffoldBackgroundColor 似乎没有正确设置颜色

Question

我有一个材质应用程序，它使用基于浅色主题的主题。我正在将scaffoldBackgroundColor 更改为似乎不需要的特定颜色。页面的背景是黑色而不是灰色。

应用程序的build() 方法将这个应用程序标识为MaterialApp：

Widget build(BuildContext context) {
    return new MaterialApp(
      title: '???',
      theme: appTheme,
      routes: {
        AppRoutes.login: (context) {
          return new LoginPage(
            authenticator: authenticate,
          );
        },
        AppRoutes.home: (context) {
          return new HomePage(
            appState: appState,
            accountRepository: widget.accountRepository,
            authRepository: widget.authRepository,
          );
        },
      },
    );
  }

主题 - 在这里我重用浅色主题作为我的新主题的基础，将脚手架背景颜色更改为自定义颜色：

const coolGreyHi = const Color.fromARGB(40,30,20,66);

final ThemeData appTheme = _buildAppTheme();

ThemeData _buildAppTheme() {
  final ThemeData base = new ThemeData.light();
  return base.copyWith(
    scaffoldBackgroundColor: coolGreyHi,
    inputDecorationTheme: new InputDecorationTheme(
      border: new OutlineInputBorder(),
    )
  );
}

背景为灰色的页面的构建方法：

Widget build(BuildContext context) {
    return new Scaffold(          
      body: new SafeArea(
        child: new Center(
          child: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              new Padding(
                padding: const EdgeInsets.fromLTRB(40.0, 0.0, 40.0, 0.0),
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    new Image.asset('images/image.png'),
                    new SizedBox(height: 40.0),
                    new TextField(
                      controller: _uidTextController, decoration: new InputDecoration(
                        hintText: "you@yourdomain.com",
                        labelText: "Email Address",
                      ),

                    ),
                    new SizedBox(height: 12.0),
                    new TextField(
                      controller: _pwdTextController, decoration: new InputDecoration(
                        hintText: "Password",
                        labelText: "Password",
                      ),
                    ),
                    new SizedBox(height: 12.0),
                    new ButtonBar(
                      children: <Widget>[
                        new FlatButton(
                          child: new Text("SIGN UP"),
                          onPressed: () {},
                        ),
                        new RaisedButton(
                          child: new Text("SIGN IN"),
                          elevation: 8.0,
                          onPressed: () {
                            authenticator(_uidTextController.text, _pwdTextController.text).then((bool isAuthenticated) {
                              if (isAuthenticated)
                                Navigator.of(context).pushNamedAndRemoveUntil(AppRoutes.home, (Route<dynamic> route) => false);
                            });
                          },
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ), 
    );
  }

Answer 1

请使用最新的 Flutter 版本（例如 beta 或 dev）频道。然后，您可以在Scaffold 上使用backgroundColor 属性，正如文档在此处概述的那样：https://docs.flutter.io/flutter/material/Scaffold/backgroundColor.html

Answer 2

我做了一些进一步的检查，似乎有些颜色，即使是 Flutter 调色板中的颜色，如 Colors.black54 或 Colros.black45 在我的模拟器上确实显示为黑色。我没有在物理设备上测试过它们。我不确定问题出在显示器上还是模拟器上，以及它是如何设置的，但是像 Colros.grey 这样的颜色确实会正常显示。 总而言之，在 ThemeData 上设置 scaffoldBackgroundColor 可以按设计工作，但某些颜色可能无法准确显示（即在我的实例中显示为黑色）。不确定是显示器问题还是模拟器问题。