如何解决填充时如何跳转到下一个 TextFormField?
我目前正在为我的入职建立生日页面。
正如您在图片中看到的,我创建了三个文本表单域,用户可以在其中键入日月和年(LengthLimitingTextInputFormatter = 2 表示日和月,4 表示年)。
当一个文本字段填充了所需的数字时,我如何做到这一点,例如12 天,焦点将自动跳转到下一个 TextFormFiled 月份,用户无需点击所需数字以外的任何内容。
提前致谢!
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,crossAxisAlignment: CrossAxisAlignment.center,children: <Widget>[
Text(
dateComposition,style: TextStyle(fontSize: 18,fontWeight: FontWeight.w600),),SizedBox(height: 7),Container(
margin: EdgeInsets.all(4),width: dateComposition == "Year"? 73: 55,child: TextFormField(
textAlign: TextAlign.center,//Keyboardtype for numbers
keyboardType: TextInputType.number,//only numbers can be typed in
inputFormatters: <TextInputFormatter>[
FilteringTextInputFormatter.digitsOnly,LengthLimitingTextInputFormatter(dateComposition=="Year"? 4 : 2),],autofocus: true,cursorColor: kPrimarymagentaColor,decoration: Inputdecoration(
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: kTextIconColorDarkBlue),borderRadius: BorderRadius.circular(15),hintText: dateCompositionHintText,hintStyle: TextStyle(fontWeight: FontWeight.w600,fontSize: 18.0),contentPadding: EdgeInsets.only(
left: 10,right: 10,top: 10,bottom: 10,focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(15),borderSide: BorderSide(
color: kPrimarymagentaColor,width: 1.5,);
}
}
`````
解决方法
为此,您必须将 FocusNode()
分配给您的 TextField()
,然后在您的 TextField 的 onSubmitted
方法中,您必须mySecondTextFieldFocusNode.requestFocus()
。
FocusNode textSecondFocusNode = new FocusNode();
TextFormField textFirst = new TextFormField(
onFieldSubmitted: (String value) {
FocusScope.of(context).requestFocus(textSecondFocusNode);
},);
TextFormField textSecond = new TextFormField(
focusNode: textSecondFocusNode,);
,
您可以添加属性 textInputAction 并将其设置为 TextInputAction.next,
TextFormField(
textInputAction: TextInputAction.next,...
)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。