gridview - 如何使 flutter 卡自动调整其高度取决于内容

在项目中，即时通讯使用了 flutter 卡内的图像和文本，但是卡返回固定的高度。然后我也尝试仅使用具有空值的卡，但它仍返回固定高度。我该怎么做才能使卡的高度随内容自动调整。

@override
窗口小部件build(BuildContext context){
最终标题=“食品食谱”；
返回MaterialApp(
标题:标题，
家:脚手架(
appBar:AppBar(
标题:文字(标题)，
)，
正文:GridView.builder(
itemCount:_listViewData.length，
gridDelegate:
SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount:2)，
itemBuilder :(上下文，索引){
退货卡(
边距:const EdgeInsets.all(10.0)，
子:列(
crossAxisAlignment:CrossAxisAlignment.start，
children : [
AspectRatio(
宽高比:18.0/13.0，
子:Image.network(
_listViewDataImage [index]，
适合:BoxFit.fill，
)，
)，
填充(
填充:EdgeInsets.fromLTRB(16.0，12.0，16.0，8.0)，
子:列(
crossAxisAlignment:CrossAxisAlignment.start，
children : [
文本(
_listViewData [index]，
textAlign:TextAlign.center，
)，
]，
)，
)，
]，
)，
);
})，
)，
);
}

最佳答案

问题来自SliverGridDelegateWithFixedCrossAxisCount:



我建议您使用flutter_staggered_grid_view:并放弃AspectRatio小部件。有关图块here的更多信息。

body: StaggeredGridView.countBuilder(
   crossAxisCount: 2,
   itemCount: 6,
   itemBuilder: (BuildContext context, int index) =>
     Card(
       margin: const EdgeInsets.all(10.0),
       child: Container(
         child: Column(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
            Image.network('https://upload.wikimedia.org/wikipedia/commons/6/66/An_up-close_picture_of_a_curious_male_domestic_shorthair_tabby_cat.jpg',
              fit: BoxFit.fill,
            ),
            Padding(
              padding: EdgeInsets.fromLTRB(16.0, 12.0, 16.0, 8.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text("Cat",textAlign: TextAlign.center),
                ],
            ),
         )],
       ),
     )
   ),
   staggeredTileBuilder: (int index) =>
     StaggeredTile.fit(1),
)