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

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

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

当前回答

你可以创建全局方法,比如在整个应用程序中使用按钮。它会根据容器内的文本长度调整大小。FittedBox小部件用于使小部件适合它里面的子部件。

Widget primaryButton(String btnName, {@required Function action}) {
  return FittedBox(
  child: RawMaterialButton(
  fillColor: accentColor,
  splashColor: Colors.black12,
  elevation: 8.0,
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0)),
  child: Container(
    padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 13.0),
    child: Center(child: Text(btnName, style: TextStyle(fontSize: 18.0))),
  ),
  onPressed: () {
    action();
   },
  ),
 );
}

如果你想要按钮的特定宽度和高度,你可以使用RawMaterialButton的约束属性来给出按钮的最小最大宽度和高度

constraints: BoxConstraints(minHeight: 45.0,maxHeight:60.0,minWidth:20.0,maxWidth:150.0),

其他回答

我们也可以使用ElevatedButton Widget,它有fixedSize属性。最新Flutter版本

 ElevatedButton(
          onPressed: () {},
          style: ElevatedButton.styleFrom( 
              fixedSize: Size(120, 34), // specify width, height
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(
                20,
              ))),
          child: Text("Search"),
        )

预览

只需使用FractionallySizedBox,其中widthFactor和highightfactor定义应用/父大小的百分比。

FractionallySizedBox(
widthFactor: 0.8,   //means 80% of app width
child: RaisedButton(
  onPressed: () {},
  child: Text(
    "Your Text",
    style: TextStyle(color: Colors.white),
  ),
  color: Colors.red,
)),

您需要使用扩展小部件。但是,如果按钮位于列上,则Expanded Widget将填充列的其余部分。因此,您需要将Expanded Widget包含在一行中。

Row(children: <Widget>[
Expanded(
  flex: 1,
  child: RaisedButton(
    child: Text("Your Text"),
      onPressed: _submitForm,
    ),
  ),),])

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

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

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

我努力解决这个问题,并发现我的问题是:我在一个ListView中定义了我所有的按钮。不管我做了什么,按钮的宽度总是屏幕的宽度。我用列替换ListView,瞧,突然我可以控制按钮宽度。