以编程方式限制小部件的大小

Question

我想创建如下图所示的布局。这显示正常：

Column( Row, ListView()))

虽然这会导致错误：

Column( Row, Row( ListView(), Column ))

当我用 Row( ListView(), Column ) 替换内部 ListView() 时，什么也没有显示，并且根据我所做的各种更改，我收到了不同的错误消息。

最常见的是，我看到 'viewport has unlimited horizontal size'。

我想 Listview 是问题的根源。也就是说，我不知道如何解决它。

此外，我确实在 SO 上找到了各种提示，但是 none 解决了这个问题。

我该如何解决这个问题？

更新 1

虽然右侧 Column() 可能是固定宽度，但 ListView() 应该占用屏幕的所有剩余 space [= availableWidth - WidhtOf(Column())].

Answer 1

将 ListView 放入 Container 并给它 height/width

代码

Column(
    children: [
      Row(
        children: [],
      ),
      Row(
        children: [
          Container(
              height: 100,
              width: 100,
              child: ListView(
                children: [
                  Text(
                      "1 C/G")
                ],
              )),
          Column(
            children: [],
          )
        ],
      )
    ],
  ),

Answer 2

Row 和 Column 都有一个 mainAxisSize 参数，您可以将其设置为 MainAxisSize.min，这样它们就会采用 children 的尺寸。现在，关于 ListView，有一个 shrinkWrap 参数使它的最大大小将是它的 children 的大小。另一个想法可能是在 ListView 周围使用 Flexible 小部件，它几乎与 Expanded 相同，但不同之处在于：Expanded 强制 child占用剩余的 space，而 Flexible 允许 children 具有任何小于此的给定大小，这是因为其 fit 参数默认为 FlexFit.loose.

以编程方式限制小部件的大小

Restricting the size of widgets programmatically

flutter

flutter-layout