Ответ 1
Добавьте свойство crossAxisAlignment
в свою Row
;
crossAxisAlignment: CrossAxisAlignment.stretch
Я пытаюсь создать квадратные кнопки, но Expanded, похоже, не работает так же, как с контейнерами. Возьмем следующий код, например
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)),
]
)
)
],
)
)
....
Где я изменил строку в колонку. Кнопки будут расширяться вертикально, но не горизонтально, в то время как контейнеры будут делать оба.
Есть ли способ, чтобы мои кнопки расширялись, чтобы соответствовать их родителям как по вертикали, так и по горизонтали?
Добавьте свойство crossAxisAlignment
в свою Row
;
crossAxisAlignment: CrossAxisAlignment.stretch
Обтекание с помощью 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'),
),
),