使用 SizedBox 调整部件尺寸

在 Flutter 中，您可以使用 SizedBox 部件来调整其子部件的宽度、高度或两者都调整。称之为“部件大小调整器”。

如何使用？

您可以通过将其作为父级将其子项包装在 SizedBox 中，然后使用 width 和/或 height 属性将其大小调整为所需大小。

以下是一个示例：

SizedBox(
  width: 200.0,
  height: 100.0,
  child: Container(
    color: Colors.blue,
  ),
)

注：此示例将创建一个 200x100 的蓝色矩形。

特殊情况

当您在水平/垂直 Listview 中使用时，SizedBox 可以调整两个部分之间的空间。

以下是一个示例：

ListView(
  children: <Widget>[
    Container(
      height: 50.0,
      color: Colors.blue,
    ),
    SizedBox(
      height: 20.0,
    ),
    Container(
      height: 50.0,
      color: Colors.orange,
    ),
  ],
);

注：上面的示例将创建两个高度为 50 和之间有 20 的空间的部分。

小结

使用 SizedBox 部件是调整其他 Flutter 部件大小的一种简单有效的方法，可以将其用于水平和垂直列表，并且非常适合在设计 Flutter 应用程序时创建某些调整的间距、间隙和间隔。