验证FLUTTER错误时TextFormField缩小

cgh8pdjw  于 2023-03-24  发布在  Flutter
关注(0)|答案(1)|浏览(113)

我正在学习 dart /Flutter,我得到了一个错误,我只是不能弄清楚。
这个文本字段没有问题:

TextFormField(
                keyboardType: TextInputType.emailAddress,
                controller: emailController,
                obscureText: false,
                focusNode: emailFocusNode,
                textInputAction: TextInputAction.next,
                decoration: const InputDecoration(
                  border: OutlineInputBorder(),
                  labelText: "Insira o Email",
                  prefixIcon: Icon(Icons.mail),
                ),
                validator: (String? value){
                  if (value != null && value.isEmpty){
                    return "Insira o Email";
                  }
                  return null;
                },
              ),

但是这个文本域的高度缩小了

AnimatedContainer(
                duration: const Duration(milliseconds: 500),
                height: registerAuthMode ? 65 : 0,
                child: AnimatedOpacity(
                  duration: const Duration(milliseconds: 500),
                  opacity: registerAuthMode ? 1 : 0,
                  child: TextFormField(
                    validator: (String? value){
                      if(registerAuthMode){
                        if(value != null && value!.isEmpty){
                          return "Insira a Senha";
                        }else{
                          if (value != passwordController.text){
                            return "As senhas não são Iguais";
                          }
                        }
                        return null;
                      }
                      return null;
                    },
                    controller: confirmPasswordController,
                    focusNode: confirmPasswordFocusNode,
                    obscureText: obscureText,
                    textInputAction: TextInputAction.done,
                    decoration: InputDecoration(
                        border: OutlineInputBorder(),
                        labelText: "Repita a  Senha",
                        prefixIcon: const Icon(Icons.password),
                        suffixIcon: IconButton(
                          onPressed: toggleObscureText, icon: obscureText
                            ? const Icon(Icons.visibility)
                            : const Icon(Icons.visibility_off),)
                    ),
                  ),
                ),
              ),

before validateafter validate
底部用于验证

ElevatedButton(
                    onPressed: () {
                      if (_formKey.currentState!.validate()){
                      }
                    },
                    child: Text(registerAuthMode ? 'Registrar' : 'Entrar'),
                    style: ButtonStyle(
                      elevation: MaterialStateProperty.all(8.0),
                    ),
                  ),

我的猜测是,有某种问题的小部件动画容器和动画不透明
再说一次,我对此很陌生,所以如果我做错了什么或者以错误的方式寻求帮助,对不起。
我不能弄清楚。但必须做一些与动画不透明度和/或AnimatedCointainer
编辑:
所以我查了这个Validator error message changes TextFormField's height
还挺管用的
我在textformfield的装饰中添加了一个错误样式。

decoration: InputDecoration(
                  errorStyle: const TextStyle(fontSize: 0.1),

结果就是这样didnt shrink but no error msg
但是现在错误不再显示了。边框变成红色,但是不再插入密码“或者类似的东西。

h7appiyu

h7appiyu1#

从动画容器中删除高度将有所帮助。

相关问题