如何移除Flutter中OutlinedButton的默认内边距？

直接在OutlinedButton.styleFrom中添加padding参数，覆盖默认的水平内边距即可，具体修改如下：

SizedBox(
  width: 150.0,
  child: OutlinedButton(
    onPressed: () {
      setState(() {
        selected = index;
      });
    },
    style: OutlinedButton.styleFrom(
      backgroundColor: (selected == index) ? color : Colors.white,
      // 关键：设置水平内边距为0，垂直内边距可根据需求调整
      padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 12),
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(20),
          topRight: Radius.circular(30),
          bottomLeft: Radius.circular(20),
          bottomRight: Radius.circular(20),
        ),
      ),
    ),
    child: Row(
      // 可选：让内容靠左对齐，贴合按钮左侧
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(duration),
            Text(dataPlan),
            Text(price),
          ],
        ),
      ],
    ),
  ),
);

说明 #

OutlinedButton默认自带水平方向的内边距，通过styleFrom的padding参数可以直接替换默认值：

• 用EdgeInsets.symmetric(horizontal: 0, vertical: 12)可以只移除左右内边距，保留垂直方向的内边距让按钮看起来更自然
• 如果需要完全移除所有内边距，直接用padding: EdgeInsets.zero即可

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