繁体   English   中英

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

[英]How to use stack widget inside a StaggeredGridView in flutter?

添加堆栈小部件之前

添加堆栈小部件后 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 参数传递给 Stack

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,)
                 ),
             )
        ],
);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM