Flutter | 调整 dialog 大小

展示一个 100 * 100 的弹窗：

void _test1() {
  showDialog(
    context: globalContext,
    builder: (context) {
      return Dialog(
        child: Container(
          width: 100,
          height: 100,
          color: Colors.red,
        ),
      );
    },
  );
}

结果：

很明显这个弹窗不是 100 * 100 的。

来看看 Dialog 的源码：

根据源码可知：

1. Dialog 默认有 insetPadding 并且不为 zero；
2. Dialog 限制了宽度最小为 280.

可以分别从这两点入手：

1. 主动传入 insetPadding;
2. 使用 UnconstrainedBox 破解 ConstrainedBox.

void _test() {
  showDialog(
    context: globalContext,
    builder: (context) {
      return UnconstrainedBox(
        constrainedAxis: Axis.vertical,
        child: SizedBox(
          width: 100,
          child: Dialog(
            insetPadding: EdgeInsets.zero,
            child: Container(
              height: 100,
              color: Colors.red,
            ),
          ),
        ),
      );
    },
  );
}

效果：