Flutter中如何去除按钮内边距以正常显示按键文字？

这个问题我太熟悉了！你遇到的是Flutter组件默认内边距/间距导致的布局挤压，咱们从几个关键点入手调整就能解决：

1. 移除RaisedButton的默认内边距 #

RaisedButton本身自带默认的内边距，这是导致你按钮内部空间不足的主要原因之一。直接给它加上padding: EdgeInsets.zero就能彻底去掉按钮的内边距：

2. 优化Column的布局约束 #

Column默认会尽可能占用主轴方向的空间，而且子组件之间有默认间距。咱们给Column设置两个参数：

• mainAxisSize: MainAxisSize.min：让Column只占用子组件需要的最小垂直空间
• mainAxisAlignment: MainAxisAlignment.center：让文字垂直居中，避免上下留白浪费空间

3. 调整Text的行高（可选） #

如果文字还是因为行高太大换行，可以给Text设置style: TextStyle(height: 1.0)来缩小行高，让两行文字更紧凑。

修改后的完整代码 #

class PinyinButton extends StatelessWidget {
  final VoidCallback onPressed;
  final List<String> titles;

  PinyinButton({this.onPressed, this.titles});

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 30.0,
      height: 60.0,
      child: RaisedButton(
        // 移除按钮内边距
        padding: EdgeInsets.zero,
        onPressed: onPressed,
        child: Column(
          // 让Column只占最小空间
          mainAxisSize: MainAxisSize.min,
          // 垂直居中文字
          mainAxisAlignment: MainAxisAlignment.center,
          children: titles.map((title) => Text(
                title,
                // 可选：缩小行高让文字更紧凑
                style: TextStyle(height: 1.0),
              )).toList(),
        ),
      ),
    );
  }
}

额外提示：适配最新Flutter版本 #

如果你的Flutter版本比较新，RaisedButton已经被标记为废弃了，推荐使用ElevatedButton，调整内边距的方法是一样的，只需要把RaisedButton换成ElevatedButton，同样设置padding: EdgeInsets.zero即可。

内容的提问来源于stack exchange，提问作者Dims