Flutter 如何在卡片内部制作这样的图像布局？

我从api调用中收到一个图像列表，我需要像在这个例子中那样布局这些图像，我已经实现了这个逻辑，但是我认为它是多余的，并且可以更容易地完成，而不需要硬编码哪个项需要是第一个、最后一个等等。。我认为widget树可能会更少。如何改进此代码

我的职业：

        List<Widget> _listImages() {
            List<Widget> imagesList = [];
            for (int i = 0; i < images.length; i++) {
              imagesList.add(
             Expanded(
              child: Padding(
                padding: const EdgeInsets.all(2.0),
                child: GestureDetector(
                  onTap: () {
                    open(context);
                  },
                  child: child: NetworkImage(images[i]),
                ),
              ),
            );
              );
            }
            return imagesList;
          }
    Widget build(BuildContext context) {
    return Card(...
          Column(//Image layout
                children: [
                            Row(
                              children: [
                                _listImages().first,
                              ],
                            ),
                            Container(
                              height: 110,
                              child: Row(
                                children: [
                                  Expanded(
                                    flex: 2,
                                    child: Row(
                                      children: _listImages().getRange(1, 3).toList(),
                                    ),
                                  ),
                                  Expanded(
                                    child: Stack(children: [
                                      Row(
                                        children: [
                                          _listImages().elementAt(3),
                                        ],
                                      ),
                                      IgnorePointer(
                                        child: Padding(
                                          padding: const EdgeInsets.all(2.0),
                                          child: Container(
                                            color: Colors.black54,
                                            child: Center(
                                              child: Text(
                                                '+ ${_listImages().length - 3}',
                                                textAlign: TextAlign.center,
                                                style: TextStyle(
                                                    color: Colors.white,
                                                    fontSize: 22,
                                                    fontWeight: FontWeight.w500),
                                              ),
                                            ),
                                          ),
                                        ),
                                      ),
                                    ]),
                                  ),
                                ],
                              ),
                            ),
                          ],
                        )
....
}

List\u listImages（）{
列表图像列表=[]；
对于（int i=0；i

您可以尝试Gridview。您可以使用主轴间距和横轴间距来更改网格平铺之间的距离

---

尝试使用

gridLayout

或

SliverGrid

？我尝试过，但在使用它们时，每个网格项都有相同的大小。我尝试过，但在使用它们时，每个网格项都有相同的大小。对于标准网格视图，我们可以使用纵横比进行自定义更改。但是对于单个磁贴大小，一种方法是使用此小部件