[Solved] RenderFlex children have non-zero flex but incoming height constraints are unbounded

In this post, we will show you how to solve "RenderFlex children have non-zero flex but incoming height constraints are unbounded." Error in Flutter. This error is caused when Column() has a parent widget with an unbounded height.  See the example below to solve this issue.

Error Message:

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═══════════════
The following assertion was thrown during performLayout():
RenderFlex children have non-zero flex but incoming height
constraints are unbounded.

Cause of the Error:

This error occurs when the parent widget of the Column() widget has unbounded height and the children's widget is creating the expanded to maximum size. For example:

SingleChildScrollView(  //parent widget with unlimited height     
  child:Column(
    children:[
        Expanded( //this expanded will cause the error 
          child: Container(),
        )
    ]
  )
)

The solution to this error:

To solve this error, either you have to make the bounded height of the parent widget or you have to remove the Expanded() widget from the Column children. For example:

SingleChildScrollView(        
    child:Column(
          children:[
            Container(),
          ]
        )
)

In other cases, you can solve this error by wrapping the Column with the Expanded() widget. For example:

Column(
    children:[
        Expanded(
          child:Column(children: [
              Expanded(
                child: Container()
              )
          ],)
        )
    ]
)

You have to understand that this error is caused by the unbounded size of the parent widget of Column and the children widget creating widget with the maximum size.

You can also solve this issue by wrapping Column() with SizedBox():

SizedBox( 
    height: 300,
    child:Column(
      children:[
          Expanded(
            child: Container(),
          )
      ]
    )
)

When you give the height to the parent of the Column, it will limit the height, so that the error will disappear. 

In this way, you can solve "RenderFlex children have non-zero flex but incoming height constraints are unbounded." in Flutter.