Question

如何删除验证器在TextFormField中创建的错误消息，我只想要红色边框，因为我确实有空间显示错误。

bool error = false;
 TextFormField ( 
      hintText:error?'please input productName':'',
      hintStyle:TextStyle(color: Colors.red), 
      validator:(v){  
       v.trim().length>0?error=false:error=true; return null; 
      }
 )

Answer 1

尝试下面的代码。没有错误文本的大小调整，只有红色的字段边框。

 TextFormField(
  decoration: InputDecoration(
    errorStyle: TextStyle(height: 0),
  ),
);

Answer 2

这对我来说很完美。看起来很干净，尽管您当然会丢失来自验证的错误信息。

TextFormField(
  decoration: const InputDecoration(
    errorBorder: OutlineInputBorder(
      borderSide: BorderSide(color: Colors.red),
    ),
    errorStyle: TextStyle(height: 0),
  ),
  validator: (_) => error ? '' : null,
  ),

Answer 3

这对我有用。我喜欢结果。

没有尺寸调整或类似的事情发生。

在TextFormField ...的构造函数中

decoration: InputDecoration(
        isDense: true,
        contentPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
        errorMaxLines: 1,
        errorText: 'Null',
        errorStyle: TextStyle(
          color: Colors.transparent,
          fontSize: 0,
          ),
         ),

如果您愿意，可以在SnackBar上显示错误...

Answer 4

您可以返回一个空字符串，如果无效，该字符串仍将边框标记为红色

 validator: (String value) {
      if (value.isEmpty) {
          return '';
     }
},

更新

我要解决的问题是用SizedBox包裹TextField并给出一个固定的高度，然后想要扩展并显示错误消息

 SizedBox(
      height: SOME_FIXED_HEIGHT_INCLUDING_ERROR_MESSAGE'S_HEIGHT,
      child: TextField()

Answer 5

这不是一种更干净的方法，但是现在我正在将error选项与bool变量一起使用，如果错误传递错误消息，则在hintText中使用""。另外，文本的颜色应取决于您的错误变量。

在下面找到一个例子

 final emailFieldColor =
        this._emailError == null ? //pass color: //pass error color;

               TextField(
                    controller: controllerName, //to access value
                    textAlign: TextAlign.left,
                    decoration: InputDecoration(
                      labelText: this._emailError == null
                            ? "Email"
                            : this._emailError,
                      labelStyle: TextStyle(color: emailFieldColor),
                      border: InputBorder.none,
                      hintText: this._emailError == null
                            ? "hint text"
                            : this._emailError,
                      hintStyle: TextStyle(color: 
                                this._emailError == null
                                ? //color1
                                : //color2),
                    ),
                  ),

Answer 6

validator: (v) {
  v.trim().length > 0 ? error = false : error = true;

  // just add these 2 lines
  if (error) // if there is an error, return '' else skip it. 
    return '';
},

Answer 7

hintText: validation ? NAME_TEXT_FIELD_HINT : 'Name is required!',
              hintStyle: TextStyle(fontSize: 17.0),
              errorStyle: TextStyle(height: 0),
              contentPadding:
                  EdgeInsets.symmetric(horizontal: 32.0, vertical: 14.0)),
          validator: (String value) {
            if (value.trim().isEmpty) {
              setState(() {
                validation = false;
              });
              return '';
            }
            return null;

这对我有用，将高度设置为0 +创建一个布尔值，使错误文本替换为hintText（也可以用于标签文本）

Answer 8

<块引用>

就这样放置辅助文本

TextFormField(
  decoration: const InputDecoration(
    helperText: ' ',
  ),
  validator: myValidator,
),

Answer 9

我知道为时已晚但也许它对某人有帮助，我一一设置了我喜欢的方式，我的意思是，每个边框和消息都是这样的：

 TextFormField(
                          controller: controller.emailController,
                          decoration: InputDecoration(
                            errorBorder: OutlineInputBorder(
                              borderSide: BorderSide(color: Colors.grey),
                              borderRadius: BorderRadius.only(
                                topRight: Radius.elliptical(120, 120),
                              ),
                            ),
                            disabledBorder: OutlineInputBorder(
                              borderSide: BorderSide(color: Colors.grey),
                              borderRadius: BorderRadius.only(
                                topRight: Radius.elliptical(120, 120),
                              ),
                            ),
                            focusedErrorBorder: OutlineInputBorder(
                              borderSide: BorderSide(color: Colors.grey),
                              borderRadius: BorderRadius.only(
                                topRight: Radius.elliptical(120, 120),
                              ),
                            ),
                            errorStyle:
                                TextStyle(height: 0, color: Colors.amber),
                            prefixIcon: Icon(Icons.person),
                            hintText: 'Username',
                            border: OutlineInputBorder(
                              borderRadius: BorderRadius.only(
                                topRight: Radius.elliptical(120, 120),
                              ),
                            ),
                            //fillColor: Colors.green
                          ),
                          autofocus: true,
                          keyboardType: TextInputType.emailAddress,
                          validator: (value) => '',
                          onSaved: controller.onEmailSaved,
                          onFieldSubmitted: controller.requestPasswordFocus,
                        ),

现在所有这些都是一样的，错误消息的高度也为 0，所以它不会破坏我的表单，并且当有人到达上面时，消息是空的。

如何在Flutter中删除TextFormField中的错误消息

9 个答案: