Flutter - 如何创建宽度匹配父级的容器？

Question

我在 Flutter 应用程序中使用了这个简单的小部件：

  FlatButton(
   child: Column(
          children: <Widget>[
            Image.asset(assets, height: 40, width: 40),
            Text('Title'),
            //my color line
            Container(
              height: 5,
              width: ?,
              color: Colors.blue[800],
            )
          ],
        )
  )

我需要颜色线（在底部），宽度匹配父级。但我不知道该怎么做。

Answer 1

Container(
    height: 5,
    width: double.infinity,
    color: Colors.blue[800],
)

Answer 2

使用内在宽度

 FlatButton(
   child: IntrinsicWidth(
   child: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            Image.asset(assets, height: 40, width: 40),
            Text('Title'),
            //my color line
            Container(
              height: 5,
              width: ?,
              color: Colors.blue[800],
            )
          ],
        ))
  )

一些备忘单

Answer 3

这样做的两种方法

约束框：

它创建一个小部件，对其子部件施加额外的约束，它在内部用于SingleChildRenderObjectWidget在子部件上添加约束。

ConstrainedBox(
        constraints:
            const BoxConstraints(minWidth: double.infinity, maxHeight: 10),
        child: Container(
          color: Colors.blue,
        ),
      ),

大小盒：

SizedBox 只是创建一个具有给定宽度/高度的盒子，并且不允许孩子超出给定的尺寸。它还用于SingleChildRenderObjectWidget决定子渲染区域

SizedBox(
        width: double.infinity,
        height: 5,
        // height: double.infinity,
        child: Container(
          color: Colors.blue,
        ),
      ),