包含卡的GridView不能正确计算高度

Question

我有一个应用程序使用GridView来尝试和布置一些Card s。相关的代码看起来有点像这样

body: new GridView.count(
    crossAxisCount: 2, 
    children: [new Card(
    child: new Column(
     mainAxisSize: MainAxisSize.min, 
     children: <Widget>[ 
     const ListTile(
      leading: const Text("0", style: const TextStyle(
       fontWeight: FontWeight.bold, fontSize: 24.0)), 
      title: const Text('Some Heading'), 
      subtitle: const Text('My Subtitle'), 
     ), 
     new ButtonTheme 
      .bar(// make buttons use the appropriate styles for cards 
      child: new ButtonBar(
      children: <Widget>[ 
       new FlatButton(
       child: const Text('CALL TO ACTION'), 
       onPressed:() { 
        /* ... */ 
       }, 
      ), 
      ], 
     ), 
     ), 
     ], 
    ), 
), 
    // same card repeated 
    ], 
), 

不幸的是，它没有很好地渲染：

该卡是太高，他们应该结束仅低于“行动呼吁”按钮。我怎样才能解决这个问题，并让网格行自动尊重内容的高度？

Answer 1

您的问题是，GridView.count的瓷砖的默认长宽比为1.0（即正方形），听起来好像您希望瓷砖比这更短。

快速解决方法是将childAspectRatio硬编码为您喜欢的数字。更细致的方法是实施描述所需布局的SliverGridDelegate，并使用GridView.custom。你也可以只做一个ListView的2元件部件，根本不使用GridView。