需要列来填充行的高度

Question

这似乎是一个常见的问题，我看了很多教程，但我无法掌握这个简单的布局。我有一排列。我希望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']),
        ],
      ),
    ],
  ),

);

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

Answer 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'])),
          ],
        ),
      ],
    ),
  ),

);