flutter - 为什么 ElevatedButton 会被拉伸(stretch)以适应屏幕的宽度？

Question

这是屏幕部分的完整代码:

ListView(children: [
  ClipRect(
    child: Image.asset(
      'images/icon.png',
      scale: 2,
    ),
  ),
  Padding(
    padding: const EdgeInsets.symmetric(horizontal: 24.0),
    child: TextField(
      controller: _word,
      textAlign: TextAlign.center,
      decoration: InputDecoration(
        filled: true,
        helperText: 'Enter a word',
      ),
    ),
  ),
  Padding(
    padding: const EdgeInsets.only(top: 20, left: 24, right: 24, bottom: 8),
    child: ElevatedButton(
        child: Text("Search!"),
        onPressed: () async {
          String word = _word.text;
          _word.text = '';
          Navigator.push(context, MaterialPageRoute(builder: (context) {
            return word == '' ? RandomResults() : Results(word);
          }));
        }),
  ),
]),

但是结果是这样的: image

我曾尝试使用 MaterialButton 而不是 ElevatedButton 但它也被拖动以适应屏幕的宽度。

我想让按钮足够大以容纳其中的文本。

Answer 1

用 Center 包裹按钮(如果你想以不同的方式放置它，也可以用 Align 包裹按钮)

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        Center(
          child: ElevatedButton(
            onPressed: () {},
            child: Text('Search!'),
          ),
        ),
      ],
    );
  }