How to center column and row item in Flutter?

use like this

  • In Colum

    child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [...
                           .
                           ] 
    
  • In Row

     child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [...
                           .
                           ] 
    

If you want the whole table to be Centered, use the mainAxisAlignment property of Column.

Column

mainAxisAlignment: MainAxisAlignment.center //Center Column contents vertically,
crossAxisAlignment: CrossAxisAlignment.center //Center Column contents horizontally,

Row

mainAxisAlignment: MainAxisAlignment.center //Center Row contents horizontally,
crossAxisAlignment: CrossAxisAlignment.center //Center Row contents vertically,

You can use Spacer if you want fine grain control.

Column(
  children: <Widget>[
    Spacer(), // 1st spacer
    Widget1(),
    Widget2(),
    Spacer(), // 2nd spacer
  ],
)

You can change flex too using Spacer(flex:2)


If you want it to be like in the picture, use

mainAxisAlignment: MainAxisAlignment.spaceEvenly