我发现无法在扑动中设置提升按钮的宽度。如果我已经很好地理解了,我应该把提升按钮放入大小框中。然后,我将能够设置框的宽度或高度。正确吗?还有别的办法吗?

在每个按钮周围创建一个大小框有点乏味,所以我想知道为什么他们选择这样做。我很确定他们这么做有一个很好的理由,但我不这么认为。 对于初学者来说,脚手架很难阅读和构建。

new SizedBox(
  width: 200.0,
  height: 100.0,
  child: ElevatedButton(
    child: Text('Blabla blablablablablablabla bla bla bla'),
    onPressed: _onButtonPressed,
  ),
),

当前回答

试试Container,我想我们会有更多的控制。

ElevatedButton(
          style: ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20)),
          onPressed: () {
            buttonClick();
          },
          child:  Container(
            height: 70,
            width: 200,
            alignment: Alignment.center,
            child: Text("This is test button"),
          ),

        ),

其他回答

我喜欢的方法来提高按钮与匹配父是包装它与容器。 下面是示例代码。

Container(
          width: double.infinity,
          child: RaisedButton(
                 onPressed: () {},
                 color: Colors.deepPurpleAccent[100],
                 child: Text(
                        "Continue",
                        style: TextStyle(color: Colors.white),
                      ),
                    ),
                  )

这段代码将帮助你更好地解决你的问题,因为我们不能直接为RaisedButton指定宽度,我们可以为它的子按钮指定宽度

double width = MediaQuery.of(context).size.width;
var maxWidthChild = SizedBox(
            width: width,
            child: Text(
              StringConfig.acceptButton,
              textAlign: TextAlign.center,
            ));

RaisedButton(
        child: maxWidthChild,
        onPressed: (){},
        color: Colors.white,
    );

如文档中所述

凸起的按钮的最小尺寸为88.0 * 36.0 用ButtonTheme覆盖。

你可以这样做

ButtonTheme(
  minWidth: 200.0,
  height: 100.0,
  child: RaisedButton(
    onPressed: () {},
    child: Text("test"),
  ),
);

已批准的答案现在已弃用,请参阅文档。

要更新从主题到所有按钮的代码大小,您可以这样做:

ThemeData(
    elevatedButtonTheme: ElevatedButtonThemeData(
      style: ButtonStyle(
        fixedSize:MaterialStateProperty.all<Size?>(Size(200.0, 75.0)),
        textStyle:MaterialStateProperty.all<TextStyle?>(TextStyle(fontSize:30))),
    ),
  )

在我的例子中(按钮是一个水平ListView的子),我必须用填充小部件包装按钮,并设置右/左填充。

      Padding(
        padding: const EdgeInsets.only(right: 50, left: 50),
        child: ElevatedButton(onPressed: () {}, child: Text("LOGOUT")),
      )