Flutter 2：从 ElevatedButton / TextButton 中删除额外的边距

Question

我想知道如何删除 ElevatedButton 和 TextButton 周围的边距。

这里详细介绍了它的外观：

Column(
  children: [
    ElevatedButton(
        onPressed: () {
        },
        child: Text('Login')
    ),

    TextButton(
        onPressed: () {
        },
        child: Text('Login')
    ),
  ],
)

你会怎么做？

Answer 1

这是解决方案：

ElevatedButton(
    onPressed: () {
    },
    style: ElevatedButton.styleFrom(
      tapTargetSize: MaterialTapTargetSize.shrinkWrap
    ),
    child: Text('Login')
),

TextButton(
    onPressed: () {
    },
    style: TextButton.styleFrom(
      padding: EdgeInsets.zero,
      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
      minimumSize: Size(0, 0)
    ),
    child: Text('Login')
),

tapTargetSize：MaterialTapTargetSize.shrinkWrap

MaterialTapTargetSize：配置某些 Material 小部件的点击目标和布局大小。更改 ThemeData.materialTapTargetSize 中的值将影响辅助功能体验。

ShrinkWrap：将点击目标尺寸缩小到材质规范提供的最小值。

更多内容请查看flutter官方文档

希望这可以帮助！如果您有更好的解决方案请告诉我！