扑。是否可以更改 TextFormField errorText 填充?
Flutter. Is it possible to change TextFormField errorText padding?
我正在使用 TextFormField
和 OutlineInputBorder
。我需要里面的文本在左右两侧都有填充。为此,我使用:
contentPadding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
一切正常。但是,我还使用了validator
。如果在字段中输入了错误的值,则会显示错误。
但我需要填充以不应用于错误。你能告诉我这是否可以实现吗?举个例子,看图:
是否可以仅为我的错误文本更改填充?
请帮帮我
目前没有可能的解决方案。如果我们检查 TextFormField ,
contentPadding 也控制错误文本到
但我们可以做到这一点
这是我的代码
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()) {}
}),
],
),
),
);
}
}
注意
please don't add error message text, error message style , etc . because it will create a space
输出将是
我正在使用 TextFormField
和 OutlineInputBorder
。我需要里面的文本在左右两侧都有填充。为此,我使用:
contentPadding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
一切正常。但是,我还使用了validator
。如果在字段中输入了错误的值,则会显示错误。
但我需要填充以不应用于错误。你能告诉我这是否可以实现吗?举个例子,看图:
是否可以仅为我的错误文本更改填充?
请帮帮我
目前没有可能的解决方案。如果我们检查 TextFormField , contentPadding 也控制错误文本到
但我们可以做到这一点
这是我的代码
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()) {}
}),
],
),
),
);
}
}
注意
please don't add error message text, error message style , etc . because it will create a space
输出将是