flutter GridView+卡，文字底部溢出問題

Question

我正在使用 GridView 中的卡片小部件。 我們將在卡片小部件的底部添加幾個小部件。 TextOverflow.ellipsis 選項不起作用。

請參考有問題的圖片。 我嘗試了幾種方法，但無法修復它。

請告訴我如何解決它。 而且，它可以使用網格瓷磚制作嗎？

下面是源代碼。

GridView.builder(
            //shrinkWrap: true,                
            itemCount: slpProduct.length,
            itemBuilder: (BuildContext _context, int index) {               
                 
              return Column(
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Card(
                    clipBehavior: Clip.antiAlias, // 
                    elevation: 0.5,                        
                    color: Colors.white,
                    child: Container(
                        width: 300.0,
                        child: Expanded(
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                              new Stack(
                                children: <Widget>[
                                  AspectRatio(
                                    child: new Image.network(
                                      slpProduct[index].image,
                                      fit: BoxFit.cover,
                                    ),
                                    aspectRatio: 1.5 / 1,
                                  ),
                                ],
                              ),
                              Container(
                                padding:  EdgeInsets.only(
                                    left: 15.0, top: 15.0, right: 15.0),
                                //width: 300.0,
                                child: Column(
                                  children: [
                                    ListTile(
                                        title:Text('${slpProduct[index].name}',                                                
                                          overflow: TextOverflow.ellipsis,
                                          maxLines: 1,
                                        ),                                       subtitle:Text('${slpProduct[index].description}',                                            
                                        overflow: TextOverflow.ellipsis,
                                        maxLines: 4,
                                      )
                                    ),   

                                    Container(                                          
                                      child: Text(
                                        slpProduct[index].price,                                         
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),                        
                  ),
                  Container(
                    width: 300.0, //todo 
                    padding: EdgeInsets.only(left: 10.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        ClipRRect(
                          borderRadius: BorderRadius.circular(40),
                          child: Image(
                            image: NetworkImage(slpProduct[index].image),
                            width: 25,
                            height: 25,
                            fit: BoxFit.cover,
                          ),
                        ),
                        SizedBox(
                          width: 10,
                        ),
                        Text(slpProduct[index].providerName),
                        Spacer(),
                        Row(
                          children: [
                            IconButton(
                              onPressed: () {},
                              icon: Icon(
                                CupertinoIcons.bookmark,
                                color: kTextColor,
                                size: 18.0,
                              ),
                            ),                               
                          ],
                        ),
                      ],
                    ),
                  ),
                ],
              );                
            },             
            gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
              maxCrossAxisExtent: 300.0,
              crossAxisSpacing: 10,
              mainAxisSpacing: 10,
            ),
          );
        });

Answer 1

您是否嘗試過使用responsive_grid或使用Wrap()代替Row() ) ？