如何使按钮宽度与父级匹配？

小编典典

如何使按钮宽度与父级匹配？

all

我想知道如何设置宽度以 匹配父 布局宽度

new Container(
  width: 200.0,
  padding: const EdgeInsets.only(top: 16.0),
  child: new RaisedButton(
    child: new Text(
      "Submit",
      style: new TextStyle(
        color: Colors.white,
      )
    ),
    colorBrightness: Brightness.dark,
    onPressed: () {
      _loginAttempt(context);
    },
    color: Colors.blue,
  ),
),

我对小Expanded部件有所了解，但Expanded将视图扩展到两个方向，我不知道该怎么做。

阅读 94

2022-07-18

共1个答案

小编典典

更新：

Flutter 2.0RaisedButton已弃用并由ElevatedButton. 你可以minimumSize这样使用：

ElevatedButton(
        style: ElevatedButton.styleFrom(
          minimumSize: Size.fromHeight(40), // fromHeight use double.infinity as width and 40 is the height
        ),
        onPressed: () {},
        child: Text('Text Of Button'),
      )

Flutter 小于 2.0 的旧答案：

正确的解决方案是使用SizedBox.expand小部件，它强制其child匹配其父级的大小。

SizedBox.expand(
  child: RaisedButton(...),
)

有许多替代方案，可以或多或少地进行定制：

SizedBox(
  width: double.infinity,
  // height: double.infinity,
  child: RaisedButton(...),
)

或使用ConstrainedBox

ConstrainedBox(
    constraints: const BoxConstraints(minWidth: double.infinity),
    child: RaisedButton(...),
)

2022-07-18