I am trying to Expand text widget that placed in Row. But I am getting error.
Code:
class MainContainer extends StatelessWidget
{
@override
Widget build(BuildContext context)
{
return Column (
children: <Widget>[
Container(
),
Container(
child: Row(
children: <Widget>[
Row(
children: <Widget>[
Text("label1"),
Expanded(child: Text("label2")) // Problem is here
],)
],),
),
Container(
child: Row(children: <Widget>[
Text("Some Text")
],),
),
],
);
}
}
Error:
I/flutter ( 5480): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ I/flutter ( 5480): The following assertion was thrown during performLayout(): I/flutter ( 5480): RenderFlex children have non-zero flex but incoming width constraints are unbounded. I/flutter ( 5480): When a row is in a parent that does not provide a finite width constraint, for example if it is in a I/flutter ( 5480): horizontal scrollable, it will try to shrink-wrap its children along the horizontal axis. Setting a I/flutter ( 5480): flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining I/flutter ( 5480): space in the horizontal direction. I/flutter ( 5480): These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child I/flutter ( 5480): cannot simultaneously expand to fit its parent. I/flutter ( 5480): Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible I/flutter ( 5480): children (using Flexible rather than Expanded). This will allow the flexible children to size I/flutter ( 5480): themselves to less than the infinite remaining space they would otherwise be forced to take, and I/flutter ( 5480): then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum I/flutter ( 5480): constraints provided by the parent.
I/flutter ( 5480): When a row is in a parent that does not provide a finite width constraint, for example if it is in a I/flutter ( 5480): horizontal scrollable, it will try to shrink-wrap its children along the horizontal axis.
Flexible is a built-in widget in flutter which controls how a child of base flex widgets that are Row, Column, and Flex will fill the space available to it. The Expanded widget in flutter is shorthand of Flexible with the default fit of FlexFit. tight.
The problem is that your Text
constraints are unbounded because of Expanded
so simply you can't put an unbounded with widget inside a bounded one (or non-zero flex)
The solution is simply by putting the parent Row
inside a flex widget (Flexible/Expanded)
Container(
child: Row(
children: <Widget>[
Flexible(
child: Row(
children: <Widget>[
Text("label1"),
Expanded(child: Text("label2"))
],
),
)
],
),
)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With