Flutter：如何调整AppBar内OutlineButton的高度？

这问题我之前踩过坑！OutlineButton这类Material风格的按钮默认自带了内边距和最小高度限制，光用SizedBox包着往往没法彻底压缩到你想要的尺寸，给你几个靠谱的解决方法：

方案1：用ButtonStyle覆盖默认属性（Flutter 2.0+推荐） #

这是最直接的方式，通过style参数自定义按钮的内边距、最小尺寸等属性，完全可控，而且同样适用于ElevatedButton、TextButton等其他按钮类型。

修改你的代码如下：

return Scaffold(
  appBar: AppBar(
    title: Text("Test"),
    actions: <Widget>[
      SizedBox(
        width: 100.0,
        child: OutlineButton(
          borderSide: BorderSide(width: 4.0),
          child: Text("Hi"),
          onPressed: (){},
          style: ButtonStyle(
            // 移除按钮内部的默认内边距，这是压缩高度的关键
            padding: MaterialStateProperty.all(EdgeInsets.zero),
            // 设置按钮的最小尺寸，直接定义你想要的高度
            minimumSize: MaterialStateProperty.all(Size(100, 8)),
            // 让点击区域和按钮视觉大小一致，避免额外的空白点击区域
            tapTargetSize: MaterialTapTargetSize.shrinkWrap,
          ),
        ),
      ),
    ],
  ),
  body: Container(),
);

关键属性说明： #

• padding: EdgeInsets.zero：去掉按钮文本和边框之间的默认间距，这是导致按钮比你设置的SizedBox更高的主要原因。
• minimumSize：强制按钮的最小宽高，如果你想让按钮高度完全由子控件（比如Text）决定，可以把值设为Size.zero。
• tapTargetSize: MaterialTapTargetSize.shrinkWrap：默认情况下Material按钮会有一个最小点击区域（48px高），这个属性可以让点击区域收缩到按钮实际大小，避免出现看不见的空白点击区域。

方案2：全局主题配置（适合整个APP统一风格） #

如果你想让所有OutlineButton都用这个高度风格，可以在MaterialApp的theme里配置：

MaterialApp(
  theme: ThemeData(
    outlinedButtonTheme: OutlinedButtonThemeData(
      style: ButtonStyle(
        padding: MaterialStateProperty.all(EdgeInsets.zero),
        minimumSize: MaterialStateProperty.all(Size(100, 8)),
        tapTargetSize: MaterialTapTargetSize.shrinkWrap,
      ),
    ),
  ),
  home: YourHomePage(),
);

这样所有的OutlineButton都会自动应用这个样式，不用每个按钮单独设置。

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