Flutter:如何使按钮扩展到其父控件的大小?

问题描述

我正在尝试创建方形按钮，但是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;

crossAxisAlignment: CrossAxisAlignment.stretch

这篇关于Flutter:如何使按钮扩展到其父控件的大小?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！