如何消除 listview.builder 列的颤动中的 RenderFlex 错误？

Question

我正在构建 flutter 中的列，如下代码具有嵌套 ListView.Builder，但是出现了RenderFlex的显示错误，我该如何解决？

A RenderFlex overflowed by 116 pixels on the bottom.

   Column(
          children: [
            SizedBox(height: 25,),
            Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment:CrossAxisAlignment.center,
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment:CrossAxisAlignment.center,
                  children: <Widget>[
                    //order container
                    Container(

                      height: 32,
                      width: 160,
                      decoration: BoxDecoration(

                        color: Colors.white,
                        border: Border.all(
                          width:0.5,
                          color: Color(0xFF766F6F),


                        ),

                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      child: Center(
                        child: Text('Order Date',
                          style: TextStyle(backgroundColor: Colors.white,
                            color:Color(0xFF2e2a2a),
                            fontFamily: 'Roboto',
                            fontSize: 12,

                          ),
                        ),
                      ),
                    ),
                    Container(
                      height: 32,
                      width: 160,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        border: Border.all(
                          width:0.5,
                          color: Color(0xFF766F6F),
                        ),
                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      child: Center(
                        child: Text('19 May 2020'),
                      ),
                    ),

                  ],),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment:CrossAxisAlignment.center,
                  children: <Widget>[
                    Container(

                      height: 32,
                      width: 160,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        border: Border.all(
                          width:0.5,
                          color: Color(0xFF766F6F),

                        ),
                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      child: Center(
                        child: Text('Party',
                          style: TextStyle(backgroundColor: Colors.white,
                            color:Color(0xFF2e2a2a),
                            fontFamily: 'Roboto',
                            fontSize: 12,

                          ),),
                      ),
                    ),
                    Container(
                      height: 32,
                      width: 160,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        border: Border.all(

                          width:0.5,
                          color: Color(0xFF766F6F),

                        ),
                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      child: Center(
                        child: Text('Vardhman Textiles Ltd',                               style: TextStyle(backgroundColor: Colors.white,
                          color:Color(0xFF2e2a2a),
                          fontFamily: 'Roboto',
                          fontSize: 12,

                        ),),
                      ),
                    ),

                  ],),
              ],),
            SizedBox(height: 30,),
            ListView.separated(
              separatorBuilder:
                  (BuildContext context, int index) {
                return SizedBox(
                  height: 16,
                );
              },
              shrinkWrap: true,
              itemCount: snapshot.data.content[key].length,
              itemBuilder: (context, index) {


                return Column(
                  children: [

                    Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[

                        Container(
                          height: 40,
                          width: 320,
                          decoration: BoxDecoration(
                            color: Color(0xFFFF0000),
                            border: Border.all(
                              color: Color(0xFFFF0000),
                            ),
                            borderRadius: BorderRadius.circular(10.0),
                          ),
                          child: Center(
                            child: Text('ITEM DETAILS - ' + "1/2",
                              style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold,
                                fontFamily: 'Roboto',
                                fontSize: 20,

                              ),
                            ),
                          ),
                        ),

                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          // crossAxisAlignment:CrossAxisAlignment.center,
                          children: <Widget>[
                            Container(

                              height: 32,
                              width: 160,
                              decoration: BoxDecoration(
                                color: Colors.white,
                                border: Border.all(

                                  width:0.5,
                                  color: Color(0xFF766F6F),
                                ),
                                borderRadius: BorderRadius.circular(10.0),
                              ),
                              child: Center(
                                child: Text("Catalog Item",   style: TextStyle(backgroundColor: Colors.white,
                                  color:Color(0xFF2e2a2a),
                                  fontFamily: 'Roboto',
                                  fontSize: 12,

                                ),
                                ),
                              ),
                            ),
                            Container(
                              height: 32,
                              width: 160,
                              decoration: BoxDecoration(
                                color: Colors.white,
                                border: Border.all(

                                  width:0.5,
                                  color: Color(0xFF766F6F),
                                ),
                                borderRadius: BorderRadius.circular(10.0),
                              ),
                              child: Center(
                                child: Text(snapshot
                                    .data.content[key][index][0].sodPk,   style: TextStyle(backgroundColor: Colors.white,
                                  color:Color(0xFF2e2a2a),
                                  fontFamily: 'Roboto',
                                  fontSize: 12,

                                ),
                                ),
                              ),
                            ),

                          ],),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment:CrossAxisAlignment.center,
                          children: <Widget>[
                            Container(

                              height: 32,
                              width: 160,
                              decoration: BoxDecoration(
                                color: Colors.white,
                                border: Border.all(
                                  width:0.5,
                                  color: Color(0xFF766F6F),
                                ),
                                borderRadius: BorderRadius.circular(10.0),
                              ),
                              child: Center(
                                child: Text('QTY.',   style: TextStyle(backgroundColor: Colors.white,
                                  color:Color(0xFF2e2a2a),
                                  fontFamily: 'Roboto',
                                  fontSize: 12,

                                ),
                                ),
                              ),
                            ),
                            Container(
                              height: 32,
                              width: 160,
                              decoration: BoxDecoration(
                                color: Colors.white,
                                border: Border.all(
                                  width:0.5,
                                  color: Color(0xFF766F6F),
                                ),
                                borderRadius: BorderRadius.circular(10.0),
                              ),
                              child: Center(
                                child: Text('10', style: TextStyle(backgroundColor: Colors.white,
                                  color:Color(0xFF2e2a2a),
                                  fontFamily: 'Roboto',
                                  fontSize: 12,

                                ),),
                              ),
                            ),

                          ],),




                      ],
                    ),
                  ],
                );
              },
            )
          ],
        )

刚开始学习flutter，请指点一下，谢谢，我正在尝试使用Stack，但不好，当我使用堆栈时，第一个子列被 listview.builder 重叠，所以将其删除，

请指导解决方法

Answer 1

您可以尝试将 ListView.separated 换成 Expanded Widget。 expanded 所做的是扩展 Row、Column 或 Flex 的子级，以便子级填充可用 space。所以不会溢出

如何消除 listview.builder 列的颤动中的 RenderFlex 错误？

How to remove the RenderFlex error in flutter for column with listview.builder?

flutter

dart

flutter-listview