BoxConstraints forces an infinite width
I am getting an error when I add a row in a column. I am getting the following error:
I/flutter ( 6449): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 6449): The following assertion was thrown during performLayout():
I/flutter ( 6449): BoxConstraints forces an infinite width.
I/flutter ( 6449): These invalid constraints were provided to RenderAnimatedOpacity's layout() function
Also for reference here is my code:
return new Scaffold(
backgroundColor: whiteColor,
body: new Column(
children: <Widget>[
imgHeader,
lblSignUp,
txtEmail,
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
txtFirstName,
txtLastName
],
),
],
),
);
If you are using TextField
Inside a Row
then you need to use Flexible
or Expanded
.
More details are given here in this answer.
https://stackoverflow.com/a/45990477/4652688
Reason for the error:
TextField
expands in horizontal direction and so does the Row
, so we need to constrain the width of the TextField
, there are many ways of doing it.
-
Use
Expanded
Row( children: <Widget>[ Expanded(child: TextField()), // more widgets ], )
-
Use
Flexible
Row( children: <Widget>[ Flexible(child: TextField()), // more widgets ], )
-
Wrap it in
Container
orSizedBox
and providewidth
Row( children: <Widget>[ SizedBox(width: 100, child: TextField()), // more widgets ], )
This happens only when you are trying to define an infinite width
and height
for a Row
, Column
or Container
that is a parent of the TextField
that wants to use all the space.
To solve this, you should wrap your TextField
with Flexible
or Expanded
.
Do this to solve the issues above and beyond.
Expanded(
child: txtFirstName,
),
Flexible(
child: txtLastName,
),
Full example
Column(
children: <Widget>[
imgHeader,
lblSignUp,
txtEmail,
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Expanded(
child: txtFirstName,
),
Flexible(
child: txtLastName,
),
],
),
],
)