Flutter自定义背景更新为null safety后不显示

Question

我最近将我的 flutter 项目升级到 null safety，我的页面不再显示脚手架的主体。我认为问题出在 Mediaquery 上，尽管我不确定。

我正在使用自定义背景来设计我的页面，背景：

import 'package:flutter/material.dart';
class Background extends StatelessWidget {
final Widget? child;

const Background({
Key? key,
@required this.child,
}) : super(key: key);

@override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;

return Container(
  width: size.width,
  height: size.height,
  child: Stack(
    alignment: Alignment.center,
    children: <Widget>[
      Positioned(
        top: 0,
        right: 0,
        left: 0,
        child: Image.asset("assets/top1.png", width: size.width),
      ),
      Positioned(
        top: 0,
        right: 0,
        child: Image.asset("assets/top2.png", width: size.width),
      ),
      Positioned(
        top: 30,
        //left: 20,
        right: -60,
        child: Image.asset("assets/logo.png", width: size.width * 0.60),
      ),
      Positioned(
        bottom: 0,
        right: 0,
        child: Image.asset("assets/bottom1.png", width: size.width),
      ),
      Positioned(
        bottom: 0,
        right: 0,
        child: Image.asset("assets/bottom2.png", width: size.width),
      ),
    ],
  ),
);
}
}

我的登录页面是这样设置的：

@override
Widget build(BuildContext context) {
final bloc = Provider.of(context);
Size size = MediaQuery.of(context).size;

return Scaffold(
  body: Background(
    child: SingleChildScrollView(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          _title(),
          SizedBox(height: size.height * 0.03),
          _email(bloc),
          SizedBox(height: size.height * 0.03),
          _password(bloc),
          Container(
            alignment: Alignment.centerRight,
            margin: EdgeInsets.symmetric(horizontal: 40, vertical: 10),
            child: TextButton(
                onPressed: () async {
                  Navigator.push<Widget>(
                    context,
                    MaterialPageRoute(
                        builder: (BuildContext context) => ResetScreen()),
                  );
                },
                child: Text(
                  "Passwort vergessen?",
                  style: TextStyle(
                    fontSize: 12,
                    color: Color(0XFF2661FA),
                    fontWeight: FontWeight.bold,
                  ),
                )),
          ),
          SizedBox(height: size.height * 0.05),
          _boton(size, context, bloc),
          Container(
            alignment: Alignment.centerRight,
            margin: EdgeInsets.symmetric(horizontal: 40, vertical: 10),
            child: GestureDetector(
              onTap: () => {
                Navigator.pushReplacementNamed(context, "register"),
              },
              child: Text(
                "Sie haben noch kein Konto? Registrieren",
                style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF2661FA)),
              ),
            ),
          ),
        ],
      ),
    ),
  ),
);
}

我可以看到自定义背景，但看不到列内的实际小部件：

我在迁移到 null safety 后遇到了这个问题，我真的认为这与它有关，因为如果我去掉背景并使用 SingleChildScrollView 作为正文的主要小部件，列中的所有内容再次出现

Answer 1

@required 已在 null safe dart 中更改为 required。您也可以删除“？”来自 Background.child 如果需要它，因为它永远不会为空。

class Background extends StatelessWidget {
  final Widget child;

  const Background({
    Key? key,
    required this.child,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;

    return Container(
      width: size.width,
      height: size.height,
      child: Stack(
        alignment: Alignment.center,
        children: <Widget>[
          // add the child somewhere in the build function
          child,
          Positioned(
            top: 0,
            right: 0,
            left: 0,
            child: Image.asset("assets/top1.png", width: size.width),
          ),
          Positioned(
            top: 0,
            right: 0,
            child: Image.asset("assets/top2.png", width: size.width),
          ),
          Positioned(
            top: 30,
            //left: 20,
            right: -60,
            child: Image.asset("assets/logo.png", width: size.width * 0.60),
         ),
          Positioned(
            bottom: 0,
            right: 0,
            child: Image.asset("assets/bottom1.png", width: size.width),
          ),
          Positioned(
            bottom: 0,
            right: 0,
            child: Image.asset("assets/bottom2.png", width: size.width),
          ),
        ],
      ),
    );
  }
}

Flutter自定义背景更新为null safety后不显示

Flutter custom background does not display after updating to null safety

flutter

flutter-layout

dart-null-safety