如何将容器垂直拉伸到最大屏幕？

Question

body: SafeArea(
      child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
        Container(
          width: 100.00,
          height: 100.00,
          color: Colors.red,
        ),
      ])),
));

目前，高度为 100.00，但我需要将其拉伸到无穷大。

我试图将高度更改为 double.infinity：

Container(
          width: 100.00,
          height: double.infinity,
          color: Colors.red,

但后来我收到以下错误：

在 performLayout() 期间抛出以下断言： BoxConstraints 强制无限高度。

Answer 1

为此，您可以：

1) 使用一个叫做Expanded小部件的小部件。

body: SafeArea(
      child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
       Expanded(
          child: Container(
            color: Colors.red,
          ),
        ),
      ])),
));

2)使用类给出设备屏幕的Containeraheight和widthMediaQuery

body: SafeArea(
      child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
        Container(
          // give it a width equals to the device screen
          width: MediaQuery.of(context).size.width,
          // give it a height equals to the device screen
          height: MediaQuery.of(context).size.height,
          color: Colors.red,
        ),
      ])),
));