使用 Flutter 将 Row 放入 ConstrainedBox 时的行为很奇怪

Question

当我用Flutter 在ConstrainedBox 中放置一行时，显示不顺畅。这是 Flutter 错误吗？

//不突出图案

ConstrainedBox(
  constraints: BoxConstraints(
  maxWidth: ScreenUtil.getFullWidth(context) * 0.8),
  child: Container(
    decoration: const BoxDecoration(color: Colors.red),
    width: 300,
    height: 100,
)),

//伸出图案

ConstrainedBox(
  constraints: BoxConstraints(
  maxWidth: ScreenUtil.getFullWidth(context) * 0.8),
  child: Row(
    children: [
      Container(
        decoration: const BoxDecoration(color: Colors.green),
        width: 300,
        height: 100,
      )
    ])),

image

Answer 1

您的 ConstrainedBox 是否在 ‌scaffold 小部件内？

有时需要这样做。

Answer 2

添加带有 Center 小部件的 Expanded 删除溢出

ConstrainedBox(
          constraints:
              BoxConstraints(maxWidth: ScreenUtil.getFullWidth(context) * 0.8),
          child: Row(children: [
            Expanded(
                child: Center(
                    child: Container(
              decoration: const BoxDecoration(color: Colors.green),
              width: 300,
              height: 100,
            )))
          ]))

使用 Flutter 将 Row 放入 ConstrainedBox 时的行为很奇怪

The behavior when putting Row into ConstrainedBox with Flutter is strange

row

widget

flutter