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

问题

I have a card that has three containers. The first two have text and the last one is supposed to hold a TextFormField alongside some text. So i have a row to hold the two along one another. Only thing is when i add the TextFormField widget it does not appear and the console throws shows an error

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY 
╞═════════════════════════════════════════════════════════
I/flutter (14101): The following assertion was thrown during 
performLayout():
I/flutter (14101): BoxConstraints forces an infinite width.
I/flutter (14101): These invalid constraints were provided to 
RenderRepaintBoundary's layout() function by the
I/flutter (14101): following function, which probably computed the invalid 
constraints in question:
I/flutter (14101):   _RenderDecoration._layout.layoutLineBox 
(package:flutter/src/material/input_decorator.dart:750:11)
I/flutter (14101): The offending constraints were:
I/flutter (14101):   BoxConstraints(w=Infinity, 0.0<=h<=100.0)



I/flutter (14101): Another exception was thrown: RenderBox was not laid out: 
RenderPadding#150b0 relayoutBoundary=up3 NEEDS-PAINT
I/flutter (14101): Another exception was thrown: 
'package:flutter/src/rendering/shifted_box.dart': Failed assertion: line 310 
pos 12: 'child.hasSize': is not true.
I/flutter (14101): Another exception was thrown: RenderBox was not laid out: 
RenderPhysicalShape#1d998 relayoutBoundary=up4

The code looks like

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
@override
Widget build(BuildContext context) {
return Container(
    child: Center(
  child: Card(
    elevation: 2.0,
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Container(
          height: 100.0,
          color: Colors.purple,
        ),
        Container(
          height: 200.0,
          color: Colors.pink,
          child: Column(
            children: <Widget>[
              new RichText(
                textAlign: TextAlign.center,
                text: TextSpan(
                  text: 'Some Text',
                  style: TextStyle(
                      color: Colors.grey[800],
                      fontWeight: FontWeight.bold,
                      fontSize: 17.0),
                ),
              ),
              new RichText(
                softWrap: true,
                textAlign: TextAlign.center,
                text: TextSpan(
                  text:
                      'Some other text',
                  style: TextStyle(
                      color: Colors.black54,
                      fontWeight: FontWeight.normal,
                      fontSize: 17.0),
                  ),
                    ),
                  Row(
                children: <Widget>[
                  Text('adfa'),
                  Text('data'),
                  Form(
                    child: TextFormField(),
                  ),
                ],
              )
            ],
          ),
        ),
      ],
    ),
  ),
));
}
 }

回答1:

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

回答2:

I am replying in enhancement of German Saprykin post, I was also getting the same below error

════════ (2) Exception caught by rendering library ══════════════════════════ An InputDecorator, which is typically created by a TextField, cannot have an unbounded width. This happens when the parent widget does not provide a finite width constraint. For example, if the InputDecorator is contained by a Row, then its width must be constrained. An Expanded widget or a SizedBox can be used to constrain the width of the InputDecorator or the TextField that contains it. 'package:flutter/src/material/input_decorator.dart': Failed assertion: line 910 pos 7: 'layoutConstraints.maxWidth < double.infinity' User-created ancestor of the error-causing widget was: TextField file:///C:/CommBack/My_Workplace/Flutter/wiremusic/wiremusic_dev/lib/wire/widgets/searchfield.dart:15:14 ══════════════════════════════════════════════════════════

════════ (3) Exception caught by rendering library ══════════════════════════ RenderBox was not laid out: _RenderDecoration#b1ce0 relayoutBoundary=up26 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1681 pos 12: 'hasSize' User-created ancestor of the error-causing widget was: TextField file:///C:/CommBack/My_Workplace/Flutter/wiremusic/wiremusic_dev/lib/wire/widgets/searchfield.dart:15:14 ══════════════════════════════════════════════════════════

because of this below earlier source lines.

return Container(
  color: Colors.yellow,
  constraints: BoxConstraints(minWidth: 230.0, minHeight: 25.0),
  child: TextField(),
);

because the TextField requires the ancestor hasSize explicitly and after mentioning the width explicitly to Container, the error disappeared like Thanos

return Container(
  color: Colors.yellow,
  width: 230,
  constraints: BoxConstraints(minWidth: 230.0, minHeight: 25.0),
  child: TextField(),
);

Hope this would help someone.

来源：https://stackoverflow.com/questions/51809451/how-to-solve-renderbox-was-not-laid-out-in-flutter-in-a-card-widget