Flutter: How to make a button expand to the size of its parent?

Question

I am trying to create square buttons, but Expanded doesn't seem to work the same as it does with containers. Take the following code for example

new Expanded(  flex: 2,    child: new Column(      children: <Widget>[        new Expanded(          child:new Row(            children: <Widget>[              new Expanded(child: new MaterialButton(...)),              new Expanded(child: new MaterialButton(....)),               new Expanded(child: new Container(color: Colors.red)),              new Expanded(child: new Container(color: Colors.green)),            ]          )        )      ],    )  )   .... 

It displays two buttons that are expanded horizontally, but not vertically. At the same time the containers will expand both horizontally and vertically. The same effect occurs if I do the following:

new Expanded(  flex: 2,    child: new Column(      children: <Widget>[        new Expanded(          child:new Column(            children: <Widget>[              new Expanded(child: new MaterialButton(...)),              new Expanded(child: new MaterialButton(....)),               new Expanded(child: new Container(color: Colors.red)),              new Expanded(child: new Container(color: Colors.green)),            ]          )        )      ],    )  )   .... 

Where I've changed the Row to Column. The buttons will expand vertically, but not horizontally, while the containers will do both.

Is there a way have my buttons expand to fit their parent both vertically and horizontally?

Answer 1

Add the crossAxisAlignment property to your Row;

crossAxisAlignment: CrossAxisAlignment.stretch