flutter - 聚焦 TextFormField 时如何隐藏错误出现
问题描述
我正在使用TextFormField
表单和自定义验证器方法来返回错误消息。我试图TextFormField
在文本字段获得焦点时隐藏默认错误消息和错误边框。
TextFormField(
focusNode: _focusNode,
validator: widget.validator,
errorBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 5.0),
borderRadius: BorderRadius.circular(5),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
borderSide: BorderSide(
color: const Color(0x1C707070),
width: 0.5,
),
)
我的问题是,当文本字段获得焦点时,错误边框被覆盖。下划线变为红色。我知道这是如何TextFormField
工作的。
但我想要实现的是在文本字段获得焦点时隐藏所有错误出现,包括错误消息。
解决方案
我通过添加errorStyle
&实现了所需的 UI focusedErrorBorder
。
errorBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1.0),
),
errorStyle: _focusNode.hasFocus ? TextStyle(fontSize: 0, height: 0) : null,
focusedErrorBorder: UnderlineInputBorder(
borderSide: BorderSide.none,
),
推荐阅读
- c# - 如何在 C# 模型中获取密钥?
- rest - 如何在解析器graphql中获取祖父母数据?
- reactjs - 在 SSR 和动态 URL 中使用 Apollo 进行查询 (Next.js)
- python - 在 Python 中将 Word 转换为图像
- c# - FileResult 引发 System.ObjectDisposedException:无法访问已关闭的文件
- reactjs - React Router:替换位置状态然后返回,位置状态未定义
- swiftui - UIViewControllerRepresentable 中包含的@Binding 未更新
- python - 我的代码可以归类为深度优先搜索吗?
- javascript - 将字符串拆分为 3 段
- android - React Native Android 项目在 Hermes 上失败,但“enableHermes:false”