button - 如何让 Flutter 按钮尽可能宽到最大宽度？

Question

在以下布局中，我希望按钮能够在屏幕上尽可能宽，达到最大宽度。我尝试了以下方法，但不起作用(按钮总是尽可能宽):

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SafeArea(
          child: Center(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                TextFormField(),
                TextFormField(),
                ConstrainedBox(
                  constraints: BoxConstraints(maxWidth: 200),
                  child: RaisedButton(child: Text("button"), onPressed: () {}),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

为了扩展我正在寻找的布局:按钮的宽度必须与以下两个数量中较小的一个相同:1)屏幕的宽度，2)给定的固定最大宽度。

示例场景:

A) 屏幕宽度为 1000 像素，并且给定的固定最大宽度为 600 像素，则按钮宽度为 600 像素。

B) 屏幕宽度为 400 像素，并且给定的固定最大宽度为 600 像素，则按钮宽度为 400 像素。

Answer 1

解决方法很简单，只需将您的 ConstrainedBox 包裹起来即可。在 Align而不是使用 maxWidth使用 minWidth .

Align(
  child: ConstrainedBox(
    constraints: BoxConstraints(minWidth: 200),
    child: RaisedButton(child: Text("button"), onPressed: () {}),
  ),
)

输出:

如果屏幕宽度 > 200，按钮占用 200 宽度

如果屏幕宽度 < 200，按钮占用屏幕宽度