如何禁用容器子级展开？

Question

所以我在脚手架（材料）中得到了一个容器。但是，如果我添加一个 ElevatedButton 作为此容器的子级，则 ElevatedButton 按钮将扩展到父容器的完整大小。我怎样才能避免它？

不知道是flutter安装的问题还是我的问题。

这是代码。

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  _LoginState createState() => _LoginState();
}

class _LoginState extends State<Login> {
  String status = "Status: OK";
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.teal,
      appBar: AppBar(
        backgroundColor: Colors.teal,
        elevation: 0,
        centerTitle: true,
        automaticallyImplyLeading: false,
        title: Text(status),
      ),
      body: Center(
        child: Column(
          children: [
            SubmitContainer(),
          ],
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
        ),
      ),
    );
  }
}

class InputContainer extends StatelessWidget {
  const InputContainer({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: TextField(),
      width: 200,
      height: 200,
      color: Colors.yellow,
    );
  }
}

class SubmitContainer extends StatelessWidget {
  const SubmitContainer({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: SizedBox(
        child: ElevatedButton(
          child: Text("GO"),
          onPressed: () {},
        ),
        width: 300,
        height: 50,
      ),
      width: MediaQuery.of(context).size.width,
    );
  }
}

最终结果如下所示：

Answer 1

当我们使用时FittedBox它占据内容宽度。使用 FittedBox 作为按钮。

Container(
        child: SizedBox(
          child: FittedBox(
            child: ElevatedButton(
              child: Text("GO"),
              onPressed: () {},
            ),
          ),
          width: 300,
          height: 50,
        ),
        width: MediaQuery.of(context).size.width,
      );