Flutter null 安全构造函数答案

【问题标题】：Flutter null safety constructorFlutter null 安全构造函数
【发布时间】：2021-09-24 08:50:00
【问题描述】：

我正在使用 Flutter 的最新（空安全）版本，并创建了一个构造函数。

此代码不会在屏幕上显示任何内容。为什么我看不到图标和文字？

import 'package:flutter/material.dart';
    import 'input_page.dart';
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          theme: ThemeData(
            primaryColor: Colors.lightBlue[300],//app bar ın rengi
            scaffoldBackgroundColor: Colors.lightBlue[300],//scfold un body si
          ),
          home: InputPage(),
        );
      }
    }

以下代码 input_page.dart

import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class InputPage extends StatefulWidget {
  @override
  _InputPageState createState() => _InputPageState();
}

class _InputPageState extends State<InputPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          'YAŞAM BEKLENTİSİ',
          style: TextStyle(color: Colors.black54),
        ),
        centerTitle: true,
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: Row(
              children: [
                Expanded(
                  child: MyContainer(),
                ),
                Expanded(
                  child: MyContainer(),
                ),
              ],
            ),
          ),
          Expanded(
            child: MyContainer(),
          ),
          Expanded(
            child: MyContainer(),
          ),
          Expanded(
            child: Row(
              children: [
                Expanded(
                  child: MyContainer(
                    child: Column(
                      children: <Widget>[
                        Icon(
                          (FontAwesomeIcons.venus),
                          size: 50,
                          color: Colors.black54,
                        ),
                        Text("KADIN"),
                      ],
                    ),
                  ),
                ),
                Expanded(
                  child: MyContainer(),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class MyContainer extends StatelessWidget {
  final Color color;
  final Widget? child;
  MyContainer({this.color = Colors.white, this.child});

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.all(12),
      decoration:
          BoxDecoration(borderRadius: BorderRadius.circular(10), color: color),
    );
  }

【问题讨论】：

这个小部件是在 runApp 函数中调用的吗？你能分享你的主要吗？
您能在调试控制台上看到任何错误吗？通常，当您将Expanded 小部件与Column 或Row 小部件一起使用时，您可能会遇到布局错误和空白屏幕。
没有错误，它在屏幕上绘制框，但是mycontainer小部件的child参数不起作用

标签： flutter constructor required null-safety

【解决方案1】：

那是因为您没有将child 提供给您的Container。

class MyContainer extends StatelessWidget {
  final Color color;
  final Widget? child;
  MyContainer({this.color = Colors.white, this.child});

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.all(12),
      decoration: BoxDecoration(...),
      child: child, // <-- Missing
    );
  }
}

【讨论】：

但如果Container 有大小和颜色，它应该会显示出来。
@NelsonThiago 他的MyContainer 代码中的尺寸在哪里？
Container without child 的大小为(0, 0)