如何在颤动的图像后添加按钮答案

【问题标题】：How to add a button after an image in flutter如何在颤动的图像后添加按钮
【发布时间】：2021-12-18 16:40:23
【问题描述】：

我从列表中获取图像并使用 Gridview 显示它，如果我的 imageList 长度小于 4，那么我希望在最后一个图像之后显示一个按钮，它应该在行中。这是我的代码。我将行小部件变形为 Expanded，但它在我调用 addProductsImages 的位置出现错误，并且在列小部件上换行。


List imageList=["assets/img/pepsi2.jpg","assets/img/pepsi2.jpg"];


addProductsImages(){
    if(imageList.length!=0){
 Row(
            children: [
              SizedBox(
                  height:80,
                  width: MediaQuery.of(context).size.width*0.8,
                  child: GridView.builder(
                    shrinkWrap:true,
                    itemCount: imageList.length,
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount:4, ),
                     itemBuilder: (BuildContext context,int index){
                       return Padding(
                             padding: const EdgeInsets.all(8.0),
                             child: Stack(
                               children:[
                                 ClipRRect(borderRadius: BorderRadius.circular(10.0),
                                 child: Image(image: AssetImage(imageList[index]))),
                                 Align(
                                  alignment: Alignment.topRight,
                                  child: buildCancelIcon(
                                    color,
                                    () {
                                      setState(() {
                                       imageList.removeAt(index);
                                       print(imageList[index]);
                                      });
                                    },
                                    Icons.cancel
              
                                  ))] 
                             ),
                           );})),
                         
              Container(
                width: MediaQuery.of(context).size.width * 0.5,
                child: Align(
                    alignment: Alignment.topLeft,
                    child: customImageButton(
                        context,
                        "+",
                        () {
                          pickMultipleImage();},
                        MediaQuery.of(context).size.width * 0.3,
                        MediaQuery.of(context).size.height * 0.13)),
              ),
              SizedBox10(),

                        
            ]);}
else {
      return Padding(
          padding: const EdgeInsets.only(left: 70),
          child:
              Row(crossAxisAlignment: CrossAxisAlignment.center, children: []));
    }
  }

错误：

A RenderFlex overflowed by 151 pixels on the right.

输出：

请帮助如何做到这一点。

【问题讨论】：

标签： image flutter button render

【解决方案1】：

删除你的 SizedBox 宽度并换行 Expanded：

        Expanded(child:
          SizedBox(
              height:80,
              child: GridView.builder(

【讨论】：