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

如何让TextFormField的超长错误文本完整单行显示?

解决TextFormField固定宽度下错误文本单行完整显示的问题

要在不扩大字段宽度的前提下,让错误文本单行完整显示(超出字段宽度也不截断),只需修改InputDecoration的错误文本样式及行数设置即可:

修改后的完整代码:

Widget textAmmount() {
return Padding(
  padding: const EdgeInsets.fromLTRB(20, 20, 20, 0),
  child: SizedBox(
    width: 100, // 保持原有宽度不变
    child: TextFormField(
      controller: controller,
      decoration: InputDecoration(
        border: const OutlineInputBorder(),
        hintText: "Ammount",
        labelText: "Ammount",
        // 自定义错误文本样式,取消截断
        errorStyle: const TextStyle(
          overflow: TextOverflow.visible,
        ),
        errorMaxLines: 1, // 强制单行显示
      ),
      validator: (value) {           
        if (num.tryParse(value ?? '') == null) {
          return 'This is the error i want to display.';
        } 
        return null;
      },
    ),
  ),
);}

核心修改说明:

  • errorStyle: TextStyle(overflow: TextOverflow.visible):默认错误文本的溢出规则是TextOverflow.ellipsis(截断后加省略号),改为visible后,文本会超出TextFormField的宽度范围完整展示,不会被截断。
  • errorMaxLines: 1:强制错误文本保持单行,避免自动换行。

内容的提问来源于stack exchange,提问作者Code Newbie

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.07.31 13:20:41