Set column width in flutter Set column width in flutter dart dart

Set column width in flutter


Instead of hard-coding the size, I would suggest using Flex like

Row(      children: <Widget>[        Expanded(          flex: 2, // 20%          child: Container(color: Colors.red),        ),        Expanded(          flex: 6, // 60%          child: Container(color: Colors.green),        ),        Expanded(          flex: 2, // 20%          child: Container(color: Colors.blue),        )      ],    )

Which will produce like below,

enter image description here


Limiting the width of a Column could be

  1. Limiting the width of Column itself, use SizedBox

    SizedBox(  width: 100, // set this  child: Column(...),)

2 (A). Limiting width of children inside Column, without hardcoding values

Row(  children: <Widget>[    Expanded(      flex: 3, // takes 30% of available width       child: Child1(),    ),    Expanded(      flex: 7, // takes 70% of available width        child: Child2(),    ),  ],)

2 (B). Limiting width of children inside Column, with hardcoding values.

Row(  children: <Widget>[    SizedBox(      width: 100, // hard coding child width      child: Child1(),    ),    SizedBox(      width: 200, // hard coding child width      child: Child2(),    ),  ],)