25

i am having problem using SingleChildScrollView in this way, i dont no what is wrong, i keep getting this error.

If add the SingleChildScrollView the page will be blank(will not show all the widget)but if i remove the SingleChildScrollView, the page will show.

RenderBox was not laid out: RenderPadding#583c0 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1929 pos 12: 'hasSize

The relevant error-causing widget was Scaffold Scaffold:file:///Users/mac/Documents/Uneleap-Platform-master/lib/screens/Pages/forum/forum.dart:25:12

here is the code

SafeArea(
                minimum: EdgeInsets.only(left: 25.0, right: 20.0, top: 10.0),
                child: SingleChildScrollView(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      WidgetForum(
                        details: 'The Get Is Not Geting together ?',
                        name: 'Nina Simon',
                        url: 'assets/dashboard_pic.png',
                      ),
                      SizedBox(
                        height: 5,
                      ),
                      WidgetForum(
                        details:
                            '''Notes is designed for whatever’s on your mind.\nJot down your thoughts. Download Notes.\nThere is something wonderful in writing. \nThe Get Is Not Getting Together?''',
                        name: 'James Nugar',
                        url: 'assets/dashboard_pic.png',
                      ),
                      Text(
                        'Topics',
                        style: TextStyle(
                          fontSize: 35,
                        ),
                      ),
                      Expanded(
                        child: ListView.separated(
                            scrollDirection: Axis.horizontal,
                            separatorBuilder: (_, inedex) => SizedBox(
                                  width: 20,
                                ),
                            itemCount: topics.length,
                            itemBuilder: (context, index) {
                              return Container(
                                height: 50,
                                width: 100,
                                decoration: BoxDecoration(
                                  color: Colors.red,
                                  borderRadius: BorderRadius.circular(15),
                                  image: DecorationImage(
                                    image: AssetImage('assets/saved_2.png'),
                                    fit: BoxFit.fill,
                                  ),
                                ),
                                child: Column(
                                  children: [
                                    Padding(
                                      padding: const EdgeInsets.all(8.0),
                                      child: Align(
                                        alignment: Alignment.bottomLeft,
                                        child: Text(
                                          topics[index].schoolNmae!,
                                          style: TextStyle(
                                              color: Colors.white,
                                              fontWeight: FontWeight.bold),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              );
                            }),
                      ),
                      WidgetForum(
                        details:
                            '''Notes is designed for whatever’s on your mind.\nJot down your thoughts. Download Notes.\nThere is something wonderful in writing. \nThe Get Is Not Getting Together?''',
                        name: 'Sam Ajayi',
                        url: 'assets/dashboard_pic.png',
                      ),
                    ],
                  ),
                ),
              ),
              // bottomSheet:
              floatingActionButton: FloatingActionButton(
                onPressed: () {
                  Scaffold.of(context).showBottomSheet<void>((BuildContext context) {
                    return Container(
                      height: 250,
                      decoration: BoxDecoration(
                        color: Colors.black,
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(10),
                        ),
                      ),
                      child: Padding(
                        padding: const EdgeInsets.symmetric(
                          vertical: 50,
                          horizontal: 15.0,
                        ),
                        child: Column(
                          children: [
                            Row(
                              children: [
                                Icon(
                                  CustomIcons.answers_forum,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Text(
                                  'Post',
                                  style: TextStyle(
                                    fontSize: 25,
                                    fontWeight: FontWeight.bold,
                                    color: Colors.white,
                                  ),
                                )
                              ],
                            ),
                            Padding(
                              padding: const EdgeInsets.only(right: 120.0),
                              child: Divider(
                                thickness: 2,
                                color: Colors.white,
                              ),
                            ),
                            Row(
                              children: [
                                Icon(
                                  CustomIcons.create_forum,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Text(
                                  'Create Forum',
                                  style: TextStyle(
                                    fontSize: 25,
                                    fontWeight: FontWeight.bold,
                                    color: Colors.white,
                                  ),
                                )
                              ],
                            ),
                            Align(
                              alignment: Alignment.bottomRight,
                              child: GestureDetector(
                                onTap: () {
                                  Navigator.pop(context);
                                },
                                child: Container(
                                  height: 70,
                                  width: 70,
                                  decoration: BoxDecoration(
                                    shape: BoxShape.circle,
                                    color: Colors.white,
                                  ),
                                  child: Center(
                                    child: Icon(Icons.add),
                                  ),
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                    );
                  });
                },
                child: Icon(Icons.add),
              ),
            );
          }
        }
        
        class WidgetForum extends StatefulWidget {
          final String? name;
          final String? details;
          final String? url;
        
          WidgetForum(
              {Key? key, required this.name, required this.details, required this.url})
              : super(key: key);
        
          @override
          _WidgetForumState createState() => _WidgetForumState();
        }
        
        class _WidgetForumState extends State<WidgetForum> {
          @override
          Widget build(BuildContext context) {
            return Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Row(
                      children: [
                        Container(
                          height: 50,
                          width: 50,
                          decoration: BoxDecoration(
                            image: DecorationImage(
                              image: AssetImage(widget.url!),
                              fit: BoxFit.fill,
                            ),
                          ),
                        ),
                        SizedBox(
                          width: 5,
                        ),
                        Text(
                          widget.name!,
                          style: TextStyle(fontWeight: FontWeight.bold, fontSize: 25),
                        )
                      ],
                    ),
                    PopupMenuButton(
                      color: Colors.black,
                      offset: Offset(0, 40),
                      itemBuilder: (_) => <PopupMenuItem<String>>[
                        new PopupMenuItem<String>(
                          child: Center(
                            child: Text(
                              'Fellow',
                              style: TextStyle(
                                color: Colors.white,
                              ),
                            ),
                          ),
                        ),
                        new PopupMenuItem<String>(
                          child: Center(
                            child: Text(
                              'Block',
                              style: TextStyle(
                                color: Colors.white,
                              ),
                            ),
                          ),
                        ),
                        new PopupMenuItem<String>(
                          child: Center(
                            child: Text(
                              'Report',
                              style: TextStyle(
                                color: Colors.white,
                              ),
                            ),
                          ),
                        ),
                      ],
                      child: Container(
                        height: 20,
                        width: 20,
                        child: SvgPicture.asset('assets/library_pre.svg'),
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 18),
                Text(
                  widget.details!,
                  style: TextStyle(fontSize: 15),
                ),
                SizedBox(height: 18),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Row(
                      children: [
                        Icon(
                          CustomIcons.icons8_up_2_11,
                          color: Colors.red,
                        ),
                        Text('36'),
                        Icon(
                          CustomIcons.icons8_down,
                          color: Colors.grey,
                        ),
                        Icon(
                          CustomIcons.answers_forum,
                          color: Colors.grey,
                        ),
                        Text('3')
                      ],
                    ),
                    Text('Sep 2, 2020')
                  ],
                ),
                Divider(
                  thickness: 1,
                )
              ],
            );
          }
        }
Gbenga B Ayannuga
  • 2,407
  • 3
  • 17
  • 38

9 Answers9

37

You cannot use Expanded in Column if it has a parent SingleChildScrollView because When you use column it tries to be in screen height and when use expanded inside, The column will allocate remaining space to the child of the expanded widget, Now if you use SingleChildScrollView It will try to expand(by direction, vertically in your case) as long as possible but as you're using the Expanded which tries to take remaining space, So it goes infinite thus throws that error,

So Either remove SingleChildScrollView and use Column and expanded or remove the Expanded and Use SingleChildScrollView also make sure ShrinkWrap in ListView to true.

Column(
      children: [
        Text(
          'Hello, World!',
          style: Theme.of(context).textTheme.headline4,
        ),
        Container(
          height: 50,
          width: 200,
          color: Colors.amber,
          child: const Text('Random widget'),
        ),
        Expanded(
          child: ListView.separated(
            shrinkWrap: true,
            itemCount: 20,
            separatorBuilder: (_, __) => const Divider(),
            itemBuilder: (context, int index) {
              return ListTile(
                title: Text('Item at $index'),
              );
            },
          ),
        )
      ],
    );

Or to Scroll all the widgets You can do using SingleChildScrollView

Remove the Expanded widget here.

SingleChildScrollView(
      child: Column(
        children: [
          Text(
            'Hello, World!',
            style: Theme.of(context).textTheme.headline4,
          ),
          Container(
            height: 50,
            width: 200,
            color: Colors.amber,
            child: const Text('Random widget'),
          ),
          ListView.separated(
              shrinkWrap: true,
              itemCount: 20,
              separatorBuilder: (_, __) => const Divider(),
              itemBuilder: (context, int index) {
                return ListTile(
                  title: Text('Item at $index'),
                );
              },
            ),
        ],
      ),
    );
Mohan Sai Manthri
  • 2,808
  • 1
  • 11
  • 26
9

Wrap it in a Container and add a height to it. Fixed it for me.

David Mezza
  • 133
  • 1
  • 5
1

Don't use Expanded widget inside the SingleChildScrollView, just remove Expanded widget it is starts working for me.

saigopi.me
  • 14,011
  • 2
  • 83
  • 54
1

You are using 2 scrolling widgets which is causing this issue. Column and Expanded can't be used while using SingleChildScrollView.

I encountered the same issue before, to fix it, remove the Expanded widget and set shrinkWrap: true, in the listview.seperated()widget

0

I solved the issue by enclosing the Column widget in a Container widget that has a set width and height

mariko
  • 119
  • 2
  • 7
0

You cannot use Expanded in Column if it has a parent SingleChildScrollView because When you use column it tries to be in screen height and when use expanded inside, The column will allocate remaining space to the child of the expanded widget, Now if you use SingleChildScrollView It will try to expand(by direction, vertically in your case) as long as possible but as you're using the Expanded which tries to take remaining space, So it goes infinite thus throws that error,

So Either remove SingleChildScrollView and use Column and expanded or remove the Expanded and Use SingleChildScrollView also make sure ShrinkWrap in ListView to true.

Yakup
  • 28
  • 4
0

I have found the same problem. but in my case I was trying to provide row of widgets for trailing property of the listTile class .and I solve it by wrapping the row with container and set its width.

habeshacoder
  • 109
  • 1
  • 5
0

In one case, I got the same error.

When I scrolled to top of the log message, I found out the issue in below widget.I have wrapped the Row with IntrinsicHeight widget.

IntrinsicHeight(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: []));

On removing IntrinsicHeight widget, it solved.

Gowtham K K
  • 3,123
  • 1
  • 11
  • 29
0

This code were raising the similar error

 Column(children: [
                        Expanded(
                          child: CarouselSlider(
                            items: imageSliders,
                            carouselController: _controller,
                            options: CarouselOptions(
                                autoPlay: true,
                                enlargeCenterPage: true,
                                aspectRatio: 2.0,
                                onPageChanged: (index, reason) {
                                  setState(() {
                                    _current = index;
                                  });
                                }),
                          ),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: Provider.of<Products>(context, listen: false).product.productImages.asMap().entries.map((entry) {
                            return GestureDetector(
                              onTap: () => _controller.animateToPage(entry.key),
                              child: Container(
                                width: 12.0,
                                height: 12.0,
                                margin: EdgeInsets.symmetric(vertical: 8.0, horizontal: 4.0),
                                decoration: BoxDecoration(
                                    shape: BoxShape.circle,
                                    color: (Theme.of(context).brightness == Brightness.dark
                                            ? Colors.white
                                            : Colors.black)
                                        .withOpacity(_current == entry.key ? 0.9 : 0.4)),
                              ),
                            );
                          }).toList(),
                        ),
                      ]),

To solved this, I remove the Expand Widget from it. Updated Code

Column(children: [

                CarouselSlider(
                    items: imageSliders,
                    carouselController: _controller,
                    options: CarouselOptions(
                        autoPlay: true,
                        enlargeCenterPage: true,
                        aspectRatio: 2.0,
                        onPageChanged: (index, reason) {
                          setState(() {
                            _current = index;
                          });
                        }),
                  ),
               
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: Provider.of<Products>(context, listen: false).product.productImages.asMap().entries.map((entry) {
                    return GestureDetector(
                      onTap: () => _controller.animateToPage(entry.key),
                      child: Container(
                        width: 12.0,
                        height: 12.0,
                        margin: EdgeInsets.symmetric(vertical: 8.0, horizontal: 4.0),
                        decoration: BoxDecoration(
                            shape: BoxShape.circle,
                            color: (Theme.of(context).brightness == Brightness.dark
                                    ? Colors.white
                                    : Colors.black)
                                .withOpacity(_current == entry.key ? 0.9 : 0.4)),
                      ),
                    );
                  }).toList(),
                ),
              ]),