在Flutter 2.0中，RaisedButton已弃用，并被ElevatedButton取代。

ElevatedButton小部件的minimumSize属性正是这样做的。

示例代码:

ElevatedButton(
            style: ElevatedButton.styleFrom(
              primary: Colors.green,
              onPrimary: Colors.white,
              shadowColor: Colors.greenAccent,
              elevation: 3,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20.0)),
              minimumSize: Size(100, 40), //////// HERE
            ),
            onPressed: () {},
            child: Text('MyButton'),
          )

最简单的方法是使用一个包装在容器中的FlatButton，默认情况下，按钮接受其父的大小，并为容器分配所需的宽度。

            Container(
                  color: Colors.transparent,
                  width: MediaQuery.of(context).size.width,
                  height: 60,
                  child: FlatButton(
                    shape: new RoundedRectangleBorder(
                      borderRadius: new BorderRadius.circular(30.0),
                    ),
                    onPressed: () {},
                    color: Colors.red[300],
                    child: Text(
                      "Button",
                      style: TextStyle(
                        color: Colors.black,
                        fontFamily: 'Raleway',
                        fontSize: 22.0,
                      ),
                    ),
                  ),
                )

输出:

Container(
  width: double.infinity,
  child: RaisedButton(...),
),

制作全宽按钮的方法有很多种。但我认为你应该理解在不同场景下制作全宽度小部件的概念:

当你使用嵌套小部件时，很难识别父小部件的宽度。简单地说，您不能在嵌套的小部件中指定宽度。所以你应该使用扩展或列与CrossAxisAlignment拉伸。

在其他情况下，您可以使用媒体查询宽度或double.infinity。

这里有一些嵌套小部件和单个小部件的例子:

第一:

Expanded(   // This will work for nested widgets and will take width of first parent widget.
  child: MaterialButton(
    onPressed: () {},
    child: const Text("Button Text"),
    color: Colors.indigo,
    textColor: Colors.white,
  )
)

第二:

Column( // This will not work if parent widget Row.
  crossAxisAlignment: CrossAxisAlignment.stretch,
  children: <Widget>[
    MaterialButton(
      onPressed: () {},
      child: const Text("Button Text"),
      color: Colors.indigo,
      textColor: Colors.white,
    )
  ]
)

第三:

ButtonTheme( // if use media query, then will not work for nested widgets.
  minWidth: double.infinity,  //Or use 'width: MediaQuery.of(context).size.width'
  child: MaterialButton(
    onPressed: () {},
    child: const Text("Button Text"),
    color: Colors.indigo,
    textColor: Colors.white,
  )
)

出:

SizedBox( // if use media query, then will not work for nested widgets.
  width: double.infinity, //Or use 'width: MediaQuery.of(context).size.width'
  child: MaterialButton(
    onPressed: () {},
    child: const Text("Button Text"),
    color: Colors.indigo,
    textColor: Colors.white,
  )
)

第五:

Container( // if use media query, then will not work for nested widgets.
  width: double.infinity, //Or use 'width: MediaQuery.of(context).size.width'
  child: MaterialButton(
    onPressed: () {},
    child: const Text("Button Text"),
    color: Colors.indigo,
    textColor: Colors.white,
  )
)

从我的角度来看，推荐的将是第一个。你也可以改变MaterialButton为ElevatedButton或TextButton或RaisedButton(折旧)或任何其他小部件。

干杯!

您可以设置fixedSize。将ButtonStyle的宽度设置为一个非常大的数字，如double.maxFinite。如果你不想指定高度，你也可以使用Size.fromWidth()构造函数:

ElevatedButton(
  child: const Text('Button'),
  style: ElevatedButton.styleFrom(
    fixedSize: const Size.fromWidth(double.maxFinite),
  ),
),

现场演示

最基本的方法是通过将容器的宽度定义为无穷大来使用容器。参见下面的代码示例

Container(
    width: double.infinity,
    child:FlatButton(
        onPressed: () {
            //your action here
        },
        child: Text("Button"),

    )
)