需要列来填充行的高度

Posted 2023-02-23

【中文标题】需要列来填充行的高度

【英文标题】：Need Column to fill height of a Row

【发布时间】：2019-07-28 16:10:09

【问题描述】：

这似乎是一个常见问题，我查看了很多教程，但我无法掌握这个简单的布局。我在一行中有一个列。我希望 Column 扩展以填充行的高度，然后我希望 Column 的子级等距。

return Card(
  child: Row(
    children: <Widget>[
      CachedNetworkImage(
        height: 80,
        imageUrl: posterUrl,
        placeholder: (context, url) => new CircularProgressIndicator(),
        errorWidget: (context, url, error) => new Icon(Icons.error),
      ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(_show['name']),
          Text('First Episode: ' + _show['first_air_date']),
        ],
      ),
    ],
  ),

);

如何告诉列填充行中可用的高度？

【参考方案1】：

我假设您希望 Column 的一个元素扩展，以便 Column 填充 Row 的最大元素的高度：您可以将整个 Row 包裹在 IntrinsicHeight 中并包裹Column 和Expanded 中的一个孩子喜欢：

return Card(
  child: IntrinsicHeight(
    child:Row(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        CachedNetworkImage(
          height: 80,
          imageUrl: posterUrl,
          placeholder: (context, url) => new CircularProgressIndicator(),
          errorWidget: (context, url, error) => new Icon(Icons.error),
        ),
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text(_show['name']),
            Expanded(child: Text('First Episode: ' + _show['first_air_date'])),
          ],
        ),
      ],
    ),
  ),

);

【讨论】：

添加 IntrinsicHeight 正是我想要的。谢谢！