如何在Flutter中的StaggeredGridView中使用堆栈小部件？

问题描述

om / cFMse.png

当我在StaggeredGridView中使用堆栈小部件时，为什么图像会变得怪异的大小。当我从网格视图中删除堆栈时，布局看起来就很好了。我是否以错误的方式使用布局？

new StaggeredGridView.countBuilder(
                crossAxisCount: 2,crossAxisspacing: 10,mainAxisspacing: 10,itemCount:model.hit.length,itemBuilder: (context,index) {
                  return
                    Stack(
                     children: [
                       Container(
                         decoration: Boxdecoration(
                             color: Colors.transparent,borderRadius: BorderRadius.all(Radius.circular(35))),child:
                         ClipRRect(
                             borderRadius: BorderRadius.all(Radius.circular(35)),child:FadeInImage.memoryNetwork(
                               placeholder: kTransparentimage,image: model.hit[index]['largeImageURL'],fit: BoxFit.cover,)

                         ),)
                     ],);

                },staggeredTileBuilder: (index) {
                  return new StaggeredTile.count(1,index.isEven ? 1.2 : 1.8);
                })

解决方法

尝试将StackFit.expand参数传递给堆栈

return
    Stack(
       fit: StackFit.expand,/// <-- expand to the size of the parent constraint
       children: [
          Container(
            decoration: BoxDecoration(
              color: Colors.transparent,borderRadius: BorderRadius.all(Radius.circular(35))),child: ClipRRect(
                 borderRadius: BorderRadius.all(Radius.circular(35)),child:FadeInImage.memoryNetwork(
                   placeholder: kTransparentImage,image: model.hit[index]['largeImageURL'],fit: BoxFit.cover,)
                 ),)
        ],);