Flutter:Renderbox Was Not Laid Out: Renderrepaintboundary#58C65 Relayoutboundary=Up1 Needs-Paint

RenderBox was not laid out: RenderRepaintBoundary#5291c relayoutBoundary=up1 NEEDS-PAINT

Wrap TextFormField with Flexible or Expanded widget.

Column(
  mainAxisAlignment: MainAxisAlignment.start,
  mainAxisSize: MainAxisSize.min,
  children: [
    Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Icon(Icons.radar),
        Expanded(child: TextFormField()),
      ],
    ),
    Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Icon(Icons.abc),
        Flexible(child: TextFormField()),
      ],
    ),
  ],
),

Flutter: RenderBox was not laid out

The problem is that you are placing the ListView inside a Column/Row. The text in the exception gives a good explanation of the error.

To avoid the error you need to provide a size to the ListView inside.

I propose you this code that uses an Expanded to inform the horizontal size (maximum available) and the SizedBox (Could be a Container) for the height:

    new Row(
      children: <Widget>[
        Expanded(
          child: SizedBox(
            height: 200.0,
            child: new ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: products.length,
              itemBuilder: (BuildContext ctxt, int index) {
                return new Text(products[index]);
              },
            ),
          ),
        ),
        new IconButton(
          icon: Icon(Icons.remove_circle),
          onPressed: () {},
        ),
      ],
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
    )

,

How to solve ' RenderBox was not laid out:' in flutter in a card widget

TextFormField causes the issue. It needs constraints for width.
E.g. wrap it into Expanded widget or Container with width.

Flutter Another exception was thrown: RenderBox was not laid out: RenderRepaintBoundary#eaea6 NEEDS-LAYOUT NEEDS-PAINT

You cannot have an Expanded widget within the SingleChildScrollView which has boundless vertical dimensions.

class _HomePageState extends State<HomePage> {
  final List<ListItem> _children;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            Expanded(
                child: Container(
              height: 200,
              child: Swiper(
                itemBuilder: (BuildContext context, int index) {
                  return Image.network(
                    "http://via.placeholder.com/350x150",
                    fit: BoxFit.fitHeight,
                  );
                },
                itemCount: 5,
                pagination: SwiperPagination(),
                control: SwiperControl(),
              ),
            )),
            Expanded(
              child: GridView.builder(
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 4, childAspectRatio: 1.0),
                itemBuilder: (BuildContext context, int index) {
                  return ListItemWidget(_children[index]);
                },
                itemCount: _children.length,
              ),
            ),
          ],
      ),
    );
  }
}

Renderbox was not laid out when added to a row

please try replacing field widget code by the following

    Widget field(String hintText, String labelText, String expenseKey) {
    return Expanded(
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Container(
            child: Padding(
              padding: const EdgeInsets.only(top: 2.0),
              child: Text(
                labelText,
                style: TextStyle(
                    fontFamily: "acme",
                    fontSize: BudgetingStyles.subHeaderFontSize(context)),
              ),
            ),
          ),
          Expanded(
            child: textBox(
              hintText,
              BudgetingStyles.textBoxMargins(context),
              BudgetingStyles.topPadding(context),
                  (String value) {
                setState(
                      () {
                    expenses[expenseKey] =
                    Utility.isNumeric(value) ? double.parse(value) : 0;
                  },
                );
              },
            ),
          )
        ],
      ),
    );
  }

As far as I could investigate from your code, you need to wrap both Row and textBox with Expanded, so both widgets respect the constraints.

RenderBox was not laid out: RenderRepaintBoundary#622c4 relayoutBoundary=up2 NEEDS-PAINT Flutter

A list needs a height and a width in order to render try wrapping the FutureBuilder in Expanded or wrapping it with a Container with specific height and width you want your list to have. (Relevant for both lists)

Try this and tell me if it works :)

RenderBox was not laid out text field error in flutter

Somehow you have to tell Flutter how should it size the two columns in the row. One of the possible solutions is to wrap the first column in an Expanded widget. As a result the second column will be drawn, its size is determined by the text sizes of Button and Button2). And then the first column will occupy all the remaining space, that's what Expanded means. Code:

Row(
  children: <Widget>[
    Expanded( // <--- this is added, the rest is unchanged
      child: Column(
        children: <Widget>[
          TextFormField(
            decoration: const InputDecoration(
              hintText: 'Enter your email',
            ),
            validator: (String? value) {
              if (value == null || value.isEmpty) {
                return 'Please enter some text';
              }
              return null;
            },
          ),
          const Padding(
            padding: EdgeInsets.symmetric(vertical: 16.0),
            child: ElevatedButton(
              onPressed: null,
              child: Text('Submit'),
            ),
          ),
        ],
      ),
    ),
    Column(
      children: <Widget>[
        TextButton(
          style: TextButton.styleFrom(
            textStyle: const TextStyle(fontSize: 20),
            backgroundColor: Colors.blueAccent,
          ),
          onPressed: null,
          child: const Text('Button'),
        ),
        Row(
          children: <Widget>[
            TextButton(
              style: TextButton.styleFrom(
                textStyle: const TextStyle(fontSize: 20),
                backgroundColor: Colors.blueAccent,
              ),
              onPressed: null,
              child: const Text('Button2'),
            ),
          ],
        )
      ],
    )
  ],
),

---

Related Topics