Ben*_* H. 3 input textfield flutter
我想在 Flutter 中构建一个 TextField,用户必须在其中输入他的名字,但我想强制他至少输入 2 个字符。
\n\n这是我的代码:
\n\nTextField(\n autofocus: true,\n textCapitalization: TextCapitalization.words,\n textAlign: TextAlign.center,\n decoration: InputDecoration(\n labelStyle: TextStyle(color: Colors.blue[900]),\n border: InputBorder.none,\n hintText: \'VORNAME\',\n ),\n style: TextStyle(\n color: Colors.blue[900],\n fontWeight: FontWeight.w600,\n fontSize: MediaQuery.of(context).size.width * 0.075),\n cursorColor: Colors.greenAccent,\n inputFormatters: <TextInputFormatter>[\n WhitelistingTextInputFormatter(RegExp("[a-zA-Z\xc3\x84\xc3\xa4\xc3\x96\xc3\xb6\xc3\x9c\xc3\xbc]")) //Only Text as input\n ],\n onChanged: (value) {\n userData.forename = value;\n },\n onSubmitted: (value) {\n Navigator.of(context).push(\n CupertinoPageRoute(builder: (context) => SurName()));\n }),\nRun Code Online (Sandbox Code Playgroud)\n\n我怎样才能做到这一点?\n提前谢谢您!
\n\n本
\n小智 5
对于文本字段验证,请使用 TextFormField 而不是 TextField。\nTextFormField 需要用表单小部件包装(如果有两个以上文本表单字段,您可以用表单小部件包装其父小部件)。表单小部件需要 key 和 autovalidate 布尔值(它的可选,但建议在用户尚未验证时向用户显示消息,并且一旦验证消息就停止显示)。我们创建两个变量并将其分配给 Form。然后我们需要一个验证器,在其中根据我们的要求进行验证。(如果您需要添加更多验证,您可以添加多个 if 条件。)。最后在提交的字段上,我们检查用户是否有验证表单 如果验证通过,我们将执行所需的操作,否则我们将 autovalidate 变量设置为 true 以执行自动验证。
\n\n var formKey = GlobalKey<FormState>();\n bool autoValidate = false;\n\n\n Form(\n key: formKey,\n autovalidate: autoValidate,\n child: TextFormField(\n validator: (value){\n return value.length < 2 ? \'Name must be greater than two characters\' : null;\n },\n autofocus: true,\n textCapitalization: TextCapitalization.words,\n textAlign: TextAlign.center,\n decoration: InputDecoration(\n labelStyle: TextStyle(color: Colors.blue[900]),\n border: InputBorder.none,\n hintText: \'VORNAME\',\n ),\n style: TextStyle(\n color: Colors.blue[900],\n fontWeight: FontWeight.w600,\n fontSize: MediaQuery.of(context).size.width * 0.075),\n cursorColor: Colors.greenAccent,\n inputFormatters: <TextInputFormatter>[\n WhitelistingTextInputFormatter(RegExp("[a-zA-Z\xc3\x84\xc3\xa4\xc3\x96\xc3\xb6\xc3\x9c\xc3\xbc]")) //Only Text as input\n ],\n onChanged: (value) {\n userData.forename = value;\n },\n onFieldSubmitted: (value){\n if(formKey.currentState.validate()){\n Navigator.of(context).push(\n CupertinoPageRoute(builder: (context) => SurName()));\n }else{\n setState(() {\n autoValidate=true;\n });\n }\n\n },\n ),\n ),\nRun Code Online (Sandbox Code Playgroud)\n
| 归档时间: |
|
| 查看次数: |
12028 次 |
| 最近记录: |