Flutter中ListView.builder子项居底问题：需改为居中显示

问题出在ListView.builder的默认行为：当shrinkWrap: false时，它会强制占据父容器的全部可用高度，此时外层的Center组件无法改变其内容的排列位置，内容会默认从顶部开始排列，当父容器高度大于内容总高度时，视觉上就会呈现出内容靠下的效果。

修改方案 #

调整以下几个属性即可实现内容居中：

1. 将shrinkWrap设为true，让ListView.builder根据内容高度自适应自身高度
2. 移除ListView默认的内边距，避免额外间距影响居中效果
3. 若不需要滚动（外层容器高度已根据item数量计算），可添加NeverScrollableScrollPhysics()禁用滚动

修改后的代码 #

Container(
  color: Colors.red,
  height: widget.constraints.maxHeight * widget.cartMongodb.length / 10 + 40,
  child: Center(
    child: ListView.builder(
      shrinkWrap: true,
      padding: EdgeInsets.zero,
      physics: const NeverScrollableScrollPhysics(), // 可选，不需要滚动时启用
      itemCount: widget.cartMongodb.length,
      itemBuilder: (context, index) {
        var item = widget.cartMongodb[index]['product'];
        var quantia = quantity[index];
        return InkWell(
          onTap: () {
            Navigator.of(context).pushNamed(
              AppRoutes.PRODUCTSCREEN,
              arguments: item,
            );
          },
          child: Padding(
            padding: EdgeInsets.all(widget.constraints.maxHeight * .02),
            child: Container(
              height: widget.constraints.maxHeight * .14,
              width: widget.constraints.maxWidth * .9,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(20),
              ),
              child: Row(
                children: [
                  Container(
                    height: widget.constraints.maxHeight * .14,
                    width: widget.constraints.maxWidth * .25,
                    decoration: const BoxDecoration(
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(20.0),
                        bottomLeft: Radius.circular(20.0),
                      ),
                    ),
                    child: Padding(
                      padding: EdgeInsets.all(
                        widget.constraints.maxHeight * .02,
                      ),
                      child: Container(
                        height: widget.constraints.maxHeight * .14,
                        width: widget.constraints.maxWidth * .15,
                        decoration: const BoxDecoration(
                          color: Colors.grey,
                        ),
                        child: item.productPhoto != ""
                            ? Image.network(
                                item.productPhoto,
                                fit: BoxFit.cover,
                              )
                            : Center(),
                      ),
                    ),
                  ),
                  SizedBox(height: widget.constraints.maxWidth * .05),
                  Container(
                    height: widget.constraints.maxHeight * .14,
                    width: widget.constraints.maxWidth * .3,
                    decoration: const BoxDecoration(
                      borderRadius: BorderRadius.only(
                        topRight: Radius.circular(20.0),
                        bottomRight: Radius.circular(20.0),
                      ),
                    ),
                    child: Padding(
                      padding: EdgeInsets.only(
                        top: widget.constraints.maxHeight * .025,
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            item.productName,
                            style: TextStyle(
                              fontSize: widget.constraints.maxHeight * .02,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                          SizedBox(
                            height: widget.constraints.maxHeight * .002,
                          ),
                          Text(
                            item.productDetails,
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              fontSize: widget.constraints.maxHeight * .019,
                              color: const Color.fromRGBO(0, 0, 0, 0.68),
                              fontWeight: FontWeight.w600,
                            ),
                          ),
                          SizedBox(
                            height: widget.constraints.maxHeight * .009,
                          ),
                          Text(
                            "R\$${item.productPrice}",
                            style: TextStyle(
                              fontSize: widget.constraints.maxHeight * .02,
                              fontWeight: FontWeight.bold,
                              color: const Color.fromRGBO(113, 227, 154, 1),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                  Container(
                    height: widget.constraints.maxHeight * .1,
                    width: widget.constraints.maxWidth * .35,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        IconButton(
                          onPressed: () {
                            if (quantity[index] > 0) {
                              setState(() {
                                quantity[index] = quantity[index] - 1;

                                widget.callback(
                                  item.productPrice,
                                  false,
                                );

                                CartController controller = CartController();
                                controller.incrementOrSubtractQuantity(
                                  item,
                                  "-",
                                );
                              });
                              if (quantity[index] == 0) {
                                showDialog(
                                  context: context,
                                  builder: (BuildContext context) {
                                    return AlertDialog(
                                      title: const Text('Deseja Remover o produto do carrinho?'),
                                      actions: <Widget>[
                                        TextButton(
                                          child: const Text(
                                            'Remover',
                                            style: TextStyle(color: Colors.red),
                                          ),
                                          onPressed: () {
                                            CartController controller = CartController();
                                            controller.removeProductFromCart(
                                              item.productId,
                                            );
                                            widget.deleteProduct(item);
                                            Navigator.of(context).pop();
                                            Provider.of<CartProvider>(
                                              context,
                                              listen: false,
                                            );
                                          },
                                        ),
                                        TextButton(
                                          child: const Text(
                                            'Cancelar',
                                            style: TextStyle(color: Colors.grey),
                                          ),
                                          onPressed: () {
                                            CartController controller = CartController();
                                            controller.incrementOrSubtractQuantity(
                                              item,
                                              "+",
                                            );
                                            Navigator.of(context).pop();
                                            setState(() {
                                              quantity[index] = quantity[index] + 1;

                                              widget.callback(
                                                item.productPrice,
                                                true,
                                              );
                                            });
                                          },
                                        ),
                                      ],
                                    );
                                  },
                                );
                              }
                            }
                          },
                          icon: const Icon(Icons.remove),
                        ),
                        Text(
                          "${quantia * item.unitValue}${item.measurementUnit}",
                          style: TextStyle(fontSize: 16),
                        ),
                        IconButton(
                          onPressed: () {
                            setState(() {
                              if (item.stockQuantity > quantity[index]) {
                                quantity[index] = quantity[index] + 1;

                                widget.callback(
                                  item.productPrice,
                                  true,
                                );
                                CartController controller = CartController();
                                controller.incrementOrSubtractQuantity(
                                  item,
                                  "+",
                                );
                              }
                            });
                          },
                          icon: const Icon(Icons.add),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        );
      },
    ),
  ),
)

内容的提问来源于stack exchange，提问作者Felipe Kurt