Home > database >  Another exception was thrown: RenderBox was not laid out: RenderFlex#6ac69
Another exception was thrown: RenderBox was not laid out: RenderFlex#6ac69

Time:01-09

I want to display list and the data come from API. And I got error

Another exception was thrown: RenderBox was not laid out: RenderPadding#64692 relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE

I don't know what kind of error is this..

Bellow is my issue code

return AlertDialog(
    insetPadding: EdgeInsets.only(bottom: 520),
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12.0)),
    title: Container(
        color: Color.fromARGB(255, 253, 253, 253),
        child: Text('Comment', style: TextStyle(color: Color.fromARGB(255, 4, 4, 4))),
        padding: const EdgeInsets.all(17),
            margin: const EdgeInsets.all(0),
    ),
    titlePadding: const EdgeInsets.all(0),
        content: SingleChildScrollView(
            child: Column(mainAxisSize: MainAxisSize.min, children: < Widget > [
                GridView.builder(
                    gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 1,
                        ),
                        itemCount: commentList.length,
                        itemBuilder: (BuildContext context, int index) {
                            return Padding(
                                padding: const EdgeInsets.all(2.0),
                                    child: Container(
                                        child: InkWell(
                                            child: Container(
                                                padding: EdgeInsets.only(bottom: 10, top: 10, left: 20, right: 20),
                                                decoration: BoxDecoration(
                                                    borderRadius: BorderRadius.circular(12),
                                                    border: Border.all(color: Color(0xffD4D4D4), width: 2.0)),
                                                child: Column(
                                                    children: < Widget > [
                                                        SizedBox(height: 15),
                                                        Expanded(
                                                            child: Text(
                                                                "test",
                                                                textAlign: TextAlign.justify,
                                                                style: TextStyle(fontSize: 15, fontWeight: FontWeight.normal),
                                                            ))
                                                    ],
                                                )),
                                        )),
                            );
                        },
                ),
            ])),
);

CodePudding user response:

The SingleChildScrollView can only have one child, and the GridView expands to fill the available space.

To fix the problem, wrap your GridView with a SizedBox and give it some height/width:

AlertDialog(
      insetPadding: EdgeInsets.only(bottom: 520),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12.0)),
      title: Container(
        color: Color.fromARGB(255, 253, 253, 253),
        child: Text('Comment',
            style: TextStyle(color: Color.fromARGB(255, 4, 4, 4))),
        padding: const EdgeInsets.all(17),
        margin: const EdgeInsets.all(0),
      ),
      titlePadding: const EdgeInsets.all(0),
      content: SingleChildScrollView(
          child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
            // <--- Add SizedBox here
        SizedBox( 
          width: MediaQuery.of(context).size.width,
          height: MediaQuery.of(context).size.height * 0.5,
          child: GridView.builder(
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 1,
            ),
            itemCount: commentList.length,
            itemBuilder: (BuildContext context, int index) {
              return Padding(
                padding: const EdgeInsets.all(2.0),
                child: Container(
                    child: InkWell(
                  child: Container(
                      padding: EdgeInsets.only(
                          bottom: 10, top: 10, left: 20, right: 20),
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(12),
                          border:
                              Border.all(color: Color(0xffD4D4D4), width: 2.0)),
                      child: Column(
                        children: <Widget>[
                          SizedBox(height: 15),
                          Expanded(
                              child: Text(
                            "test",
                            textAlign: TextAlign.justify,
                            style: TextStyle(
                                fontSize: 15, fontWeight: FontWeight.normal),
                          ))
                        ],
                      )),
                )),
              );
            },
          ),
        ),
      ])),
    );
  • Related