Flutter: как заставить кнопку расширяться до размера ее родителя?

Я пытаюсь создать квадратные кнопки, но расширенный, похоже, не работает так же, как с контейнерами. Возьмите следующий код, например

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)),
           ]
         )
       )
     ],
   )
 )

 ....

он отображает две кнопки, которые развернуты горизонтально, а не вертикально. При этом контейнеры будут расширяться как по горизонтали, так и по вертикали. Тот же эффект возникает, если я делаю следующее: 

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)),
           ]
         )
       )
     ],
   )
 )

 ....

где я изменил строку на столбец. Кнопки будут расширяться вертикально, но не горизонтально, в то время как контейнеры будут делать и то, и другое.

есть ли способ, чтобы мои кнопки расширялись, чтобы соответствовать их родителю как по вертикали, так и по горизонтали?

6
flutter flutter-layout

2 ответов

добавить crossAxisAlignment свойство Row;

crossAxisAlignment: CrossAxisAlignment.stretch
14

упаковки с ButtonTheme С minWidth: double.infinity позволяет задать ограничения

ButtonTheme(
  minWidth: double.infinity,
  child: MaterialButton(
    onPressed: () {},
    child: Text('Raised Button'),
  ),
),

или после https://github.com/flutter/flutter/pull/19416 приземлился

  MaterialButton(
    onPressed: () {},
    child: SizedBox.expand(
      width: double.infinity, 
      child: Text('Raised Button'),
    ),
  ),
3