Flutter:如何使按钮扩展到其父级的大小? [英] Flutter: How to make a button expand to the size of its parent?
问题描述
我正在尝试创建方形按钮,但 Expanded 似乎与容器的工作方式不同.以如下代码为例
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?
推荐答案
将 crossAxisAlignment
属性添加到您的 Row
;
Add the crossAxisAlignment
property to your Row
;
crossAxisAlignment: CrossAxisAlignment.stretch
这篇关于Flutter:如何使按钮扩展到其父级的大小?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!