我用TextFormFieldOutlineInputBorder.我需要里面的文字在左右两边都有填充.为此,我使用:

 contentPadding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),

一切正常.然而,我也使用validator.如果字段中输入了不正确的值,则会显示错误.

But I need the padding to not apply to the error. Can you tell me if this can be achieved? For an example, look at the picture: enter image description here

是否可以仅为我的错误文本更改填充?

请帮帮我.

推荐答案

目前没有可能的解决办法.如果我们判断TextFormField,

但我们可以做到这一点

这是我的密码

  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  bool onError = false;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: SingleChildScrollView(
        padding: EdgeInsets.all(10),
        child: Column(
          children: [
            Form(
                key: _formKey,
                child: Container(
                    padding: EdgeInsets.only(
                        left: 20, right: 20, top: 20, bottom: 20),
                    child: Stack(children: [
                      Container(
                          padding: EdgeInsets.only(bottom: 20),
                          child: TextFormField(
                            style: TextStyle(color: Colors.amber, fontSize: 14),
                            controller: emailEditingController,
                            decoration: InputDecoration(
                              alignLabelWithHint: true,
                              floatingLabelBehavior:
                                  FloatingLabelBehavior.never,
                              contentPadding: EdgeInsets.fromLTRB(30, 5, 10, 5),
                              labelText: "Enter Email",
                              border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(30.0),
                              ),
                              labelStyle: TextStyle(
                                  color: Colors.grey.shade400, fontSize: 14),
                            ),
                            validator: (String? value) {
                              setState(() {
                                onError = false;
                              });
                              if (value!.isEmpty) {
                                setState(() {
                                  onError = true;
                                });
                                return null;
                              }
                              return null;
                            },
                          )),
                      onError
                          ? Positioned(
                              bottom: 0,
                              child: Text('this is an error msg',
                                  style: TextStyle(color: Colors.red)))
                          : Container()
                    ]))),
            MaterialButton(
                key: Key('login'),
                minWidth: 150,
                height: 50,
                color: Colors.amber,
                child: Text('login'),
                onPressed: () {
                  FocusScope.of(context).requestFocus(FocusNode());
                  if (_formKey.currentState!.validate()) {}
                }),
          ],
        ),
      ),
     );
   }
}

note that

请不要添加错误消息文本、错误消息样式等.因为它会创造一个空间

出局

enter image description here

Flutter相关问答推荐

在Flutter中创建具有固定行的压缩水平列表

如何在凌晨12点显示00:00(24小时格式)而不是在Flutter 中显示24:00

我如何才能动态地将小部件排成一排进行排列呢?

在保持标高=1的情况下更改AppBar立面 colored颜色 /遮罩

Flutter -如何将导航轨道标签靠左对齐?

在setState之后,Ffltter ListView.Builder未更新

如何使用Dio/Ffltter(前端)和amp;Go(后端)向API发送正确的请求

UI中的Flutter 下拉列表值未更改

Flutter OpenID Connect无效参数:redirect_uri using Keycloak

与FTPS连接时出现Flutter FTPConnect HandshakeException错误

框中的Flutter 适配图像

ScaffoldMessenger 在等待键下方不起作用

Dart 和 flutter 错误无法在您的 PATH 中找到 git

Flutter 包错误:此应用程序使用的是已弃用的 Android 嵌入版本

如何设置行中项目之间的空格相等?

Android Studio - Electric Eel 2022.1.1 更新 destruct 了 dart 文件图标

出现错误;运算符[]不是为对象类型定义的?功能()'

在 Flutter 中单击时切换按钮 colored颜色 没有改变

如何从我的Flutter 项目中删除错误?

Flutter .replaceFirst(或全部)不起作用