Flutter | ConstrainedBox & UnconstrainedBox 组件

0. 前言

在 Flutter 当中，我们如何控制组件的大小？套上一层 Container？SizeBox？还是一些别的技巧？

有没有同学遇到这种情况：在布局中，无论如何都控制不了一个组件的大小，烦的一批？

例如这段代码：

Widget build(BuildContext context) {
  return Scaffold(
    body: ListView.separated(itemBuilder: (context, index){
      return Container(
        height: 200,
        width: 200,
        color: Colors.amber,
      );
    }, itemCount: 10, separatorBuilder: (BuildContext context, int index) {
      return Container(height: 10,);
    },),
  );
}

我创建了一个ListView，每一个 item 是一个 200*200 的琥铂色（黄色）Container，讲道理，这个时候我们的脑海里就应该有这样的一个列表呈现。然而，当你运行的时候：

WTF？？我 200*200 的大方块呢？怎么变成长方形了？

难道不应该是这样的吗？