You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter中如何将TextButton高度调整为仅适配文本高度?

解决Flutter TextButton高度适配文本的问题
  • 问题核心:TextButton默认带有最小尺寸限制(默认Size(64, 36)),仅设置padding: EdgeInsets.zero无法突破这个限制,导致按钮高度无法贴合文本。
  • 解决方案:在TextButton.styleFrom中同时设置padding: EdgeInsets.zero和minimumSize: Size.zero,若需要点击区域完全贴合文本,可额外添加tapTargetSize: MaterialTapTargetSize.shrinkWrap配置。

修改后的代码示例:

Container(
  color: Colors.amberAccent[100],
  child: TextButton(
    onPressed: () {},
    child: const Text('Visualizar', style: TextStyle(color: Colors.black)),
    style: TextButton.styleFrom(
      padding: EdgeInsets.zero,
      minimumSize: Size.zero, // 移除默认最小尺寸限制
      tapTargetSize: MaterialTapTargetSize.shrinkWrap, // 可选:让点击区域完全匹配文本范围
    ),
  ),
)
  • 效果说明:以上配置会让TextButton的高度完全适配内部文本的高度,消除多余空白区域,达到你期望的贴合效果。

内容的提问来源于stack exchange,提问作者Lucas Barreto Luz

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.27 08:47:03