I can not create a SingleChildScrollView screen on Flutter

Question

I was trying to create a scrollable screen, not the widgets inside but the whole screen on Flutter but I get some errors like below:

======== Exception caught by rendering library ===================================================== RenderBox was not laid out: RenderFlex#f643b relayoutBoundary=up13 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1920 pos 12: 'hasSize' The relevant error-causing widget was:
SingleChildScrollView

Here is the code of one of the shown widgets:

var _settingsPage = StatefulBuilder(
      builder: (BuildContext context, StateSetter setState) {
        return Scaffold(
          body: Row(
            children: [
              Flexible(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    SingleChildScrollView(
                      scrollDirection: Axis.vertical,
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        mainAxisSize: MainAxisSize.min,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Row(
                            children: [
                              FloatingActionButton(
                                child: Icon(Icons.casino),
                                onPressed: changeHome,
                              ),
                            ],
                          ),
                          Flexible(
                            fit: FlexFit.loose,
                            child: SingleChildScrollView(
                              scrollDirection: Axis.vertical,
                              child: Text(
                                _helpString,
                                textAlign: TextAlign.center,
                              ),
                            ),
                          ),
                          Container(
                            alignment: Alignment.center,
                            padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                const Text('Is your character epic?'),
                                Checkbox(
                                  value: _epic,
                                  onChanged: (bool epic) {
                                    setState(
                                      () {
                                        _epic = epic;
                                      },
                                    );
                                  },
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );

Have you tried wrapping your `SingleChildScrollView` inside an `Expanded` widget? — rickimaru, Jan 13 '21 at 01:20

score 0 · Answer 1 · answered Jan 13 '21 at 04:01

Try wrapping your SingleChildScrollView in a SizedBox with a defined height and width.

This will make sure your view is constructed to a defined space

To set SizedBox height to screen height you can use media query like MediaQuery.of(context).size.height and you can replace height with width to set the widget size to your screen width

If issue still persists feel free to comment Regards, Rachan

I can not create a SingleChildScrollView screen on Flutter

1 Answers1