带有不需要的填充/额外宽度的颤动材质按钮

Question

我不知道是什么给了这个按钮额外的宽度/填充。使用的图像被裁剪，因此左右没有间距，您可以在来自开发工具的附加屏幕截图中看到它不占用宽度。不知何故，按钮有额外的宽度，但我不知道它来自哪里。

我旁边有另一个相同的按钮，增加的空间会导致溢出。

使用宽度参数更改图像大小也不会影响材质按钮占用的空间量。它似乎是一个固定的大小。

这是整个代码：

Scaffold(
      body: Row(
        children: <Widget>[
          MaterialButton(
            child: Image.asset("images/male.png", width: 33)
          )
        ],
      ),
    );

我还尝试了其他按钮，例如FlatButton和RaisedButton但它们与这个额外的宽度/填充相同。我也尝试padding在按钮上设置为 ，EdgeInsets.all(0)但这也没有改变任何东西。

Answer 1

额外的空间来自 minWidth 默认值，该值取自当前ButtonTheme（您可以从MaterialButton源代码中看到）。您可以通过将minWidth0 和padding0添加到MaterialButton小部件来删除额外的空间。像这样的东西：

Scaffold(
  body: Row(
    children: <Widget>[
      MaterialButton(
        padding: EdgeInsets.all(0),
        minWidth: 0,
        child: Image.asset("images/male.png", width: 33),
      )
    ],
  ),
);