如何限制Flutter中Tooltip的最大宽度，避免过长内容撑满屏幕？

方案1：手动换行（适合固定内容场景） #

直接在message文本中插入换行符\n强行拆分多行，可搭配padding参数调整内边距避免内容过挤：

Tooltip(
   message: "一段非常非常非常非常\n长的提示文本内容\n用于信息图标说明",
   padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
   child: const Icon(Icons.info_outline_rounded),
)

方案2：添加宽度约束实现自动换行 #

通过decoration属性的BoxConstraints设置最大宽度，超出宽度的内容会自动换行，无需手动插入换行符：

Tooltip(
  message: "一段非常非常非常非常长的提示文本内容用于信息图标说明，不需要手动添加换行符即可自动换行展示",
  decoration: BoxDecoration(
    color: Colors.grey[700],
    borderRadius: BorderRadius.circular(4),
    // 自定义最大宽度，可根据业务需求调整
    constraints: const BoxConstraints(maxWidth: 200),
  ),
  padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
  child: const Icon(Icons.info_outline_rounded),
)

方案3：全局配置Tooltip样式 #

如果需要整个应用内的Tooltip统一最大宽度、样式，可在MaterialApp的主题中配置TooltipThemeData：

MaterialApp(
  theme: ThemeData(
    tooltipTheme: TooltipThemeData(
      decoration: BoxDecoration(
        color: Colors.grey[800],
        borderRadius: BorderRadius.circular(4),
        // 全局统一Tooltip最大宽度
        constraints: const BoxConstraints(maxWidth: 250),
      ),
      padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
      textStyle: const TextStyle(color: Colors.white, fontSize: 14),
    )
  ),
  home: const HomePage(),
)

方案4：富文本场景配置（Flutter 3.10+ 支持） #

如果提示内容需要自定义样式/富文本，可使用richMessage参数传入TextSpan，搭配宽度约束实现自动换行：

Tooltip(
  richMessage: const TextSpan(
    text: "一段非常非常非常非常长的提示富文本内容用于信息图标说明",
    style: TextStyle(color: Colors.white, fontSize: 14),
    children: [
      TextSpan(text: "可自定义高亮样式", style: TextStyle(color: Colors.yellow, fontWeight: FontWeight.bold))
    ]
  ),
  decoration: BoxDecoration(
    color: Colors.grey[700],
    constraints: const BoxConstraints(maxWidth: 200),
  ),
  child: const Icon(Icons.info_outline_rounded),
)

注意：如果是无空格的连续超长字符串，默认不会自动拆分换行，这种情况建议拆分文本，或者自定义弹出组件实现强制换行逻辑。

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