如何解决在TextField中输入数字的问题? [英] How To Solve For Number Input In TextField?

查看:53
本文介绍了如何解决在TextField中输入数字的问题?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问题:

日,月的输入:代码如何仅允许01、02、03而不是仅1、2、3?

年份的输入:年份的最后一位数字,例如199()不允许数字4,6,7,8,有什么办法可以解决?

我试图检查几篇文章,但找不到解决方案.

我很抱歉,如果答案正对着我.这很新.

 FocusNode textSecondFocusNode = new FocusNode();TextFormField textSecond = new TextFormField(focusNode:textSecondFocusNode,);类_BumbleState扩展了State< Bumble>{最后的myControllerDay = TextEditingController();最后的myControllerMonth = TextEditingController();final myControllerYear = TextEditingController();@override无效dispose(){//放置小部件后清理控制器.myControllerDay.dispose();myControllerMonth.dispose();myControllerYear.dispose();super.dispose();}var age = UserAge.age;@override窗口小部件build(BuildContext context){返回脚手架(backgroundColor:Theme.of(context).backgroundColor,正文:SafeArea(子代:集装箱(子级:rowOfBirthdateInput(myControllerDay:myControllerDay,myControllerMonth:myControllerMonth,myControllerYear:myControllerYear),));}}class rowOfBirthdateInput扩展了StatelessWidget {rowOfBirthdateInput({关键@需要this.myControllerDay,@需要this.myControllerMonth,@需要this.myControllerYear,}):super(key:key);最后的TextEditingController myControllerDay;最后的TextEditingController myControllerMonth;最后的TextEditingController myControllerYear;var valueDayKey;var valueMonthKey;var valueYearKey;var valueBirthKey;静态整数年龄;@override窗口小部件build(BuildContext context){(TEXTFIELD装饰...)textInputAction:TextInputAction.next,keyboardType:TextInputType.number,maxLength:2控制器:myControllerDay,inputFormatters:< TextInputFormatter> [FilteringTextInputFormatter.allow(RegExp(r'[1-31]')),],onChanged:(valueDay){如果(valueDay.length == 2)FocusScope.of(context).nextFocus();valueDayKey = valueDay;print(valueDayKey);})),),],),柱子(子代:< Widget> [(TEXTFIELD装饰...)textInputAction:TextInputAction.next,keyboardType:TextInputType.number,maxLength:2控制器:myControllerMonth,inputFormatters:< TextInputFormatter> [FilteringTextInputFormatter.allow(RegExp(r'[1-12]')),],onChanged:(valueMonth){如果(valueMonth.length == 2)FocusScope.of(context).nextFocus();valueMonthKey = valueMonth;print(valueMonthKey);})),),],),柱子(子代:< Widget> [(TEXTFIELD装饰...)textInputAction:TextInputAction.done,keyboardType:TextInputType.number,inputFormatters:< TextInputFormatter> [FilteringTextInputFormatter.allow(RegExp(r'[1952-2003]'))),],maxLength:4控制器:myControllerYear,onChanged:(valueYear){如果(valueYear.length == 4)FocusScope.of(context).unfocus();valueYearKey = valueYear;valueBirthKey = valueDayKey +'-'+valueMonthKey +'-'+valueYearKey;print(valueBirthKey);DateTime _dateTime = DateTime(int.parse(valueBirthKey.substring(6)),int.parse(valueBirthKey.substring(3,5)),int.parse(valueBirthKey.substring(0,2)),);年龄= DateTime.fromMillisecondsSinceEpoch(DateTime.now().difference(_dateTime).in毫秒).年 -1970年;打印(年龄);返回UserAge.age =年龄;})),],),],),);}}具有ChangeNotifier的UserAge类{静态整数年龄;notifyListeners();} 

解决方案

TextFormField中使用的正则表达式限制了Year字段中的4,6,7,8

允许0-12的正则表达式将

FilteringTextInputFormatter.allow(RegExp(r'\ d [1-2] * $')),

您可以在文本表单字段的 onChanged 回调或 onSaved 回调中验证输入的值.或者您可以使用 datepicker 选择日期.

  selectDate(BuildContext context)异步{最后选择的DateTime =等待showDatePicker(上下文:上下文,initialDate:selectedDate,initialDatePickerMode:DatePickerMode.day,firstDate:DateTime(1952),lastDate:DateTime(2003));如果(选择!= null)setState((){selectedDate =已选择;_dateController.text = DateFormat.yMd().format(selectedDate);});} 

您可以在此处指定要选择的初始日期和最后日期.

您可以在此处

Questions:

Inputs for day, month: How does the code only allow for 01, 02, 03 instead of just 1, 2, 3?

Inputs for year: The last digit of the year eg 199() doesn't allow for digits 4,6,7,8, any way to solve it?

I have tried to check several posts but can't find the solution to this.

I apologize if the answer is staring me right in the face. Pretty new to this.


FocusNode textSecondFocusNode = new FocusNode();

TextFormField textSecond = new TextFormField(
  focusNode: textSecondFocusNode,
);

class _BumbleState extends State<Bumble> {
  final myControllerDay = TextEditingController();
  final myControllerMonth = TextEditingController();
  final myControllerYear = TextEditingController();

  @override
  void dispose() {
    // Clean up the controller when the widget is disposed.
    myControllerDay.dispose();
    myControllerMonth.dispose();
    myControllerYear.dispose();
    super.dispose();
  }

  var age = UserAge.age;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Theme.of(context).backgroundColor,
        body: SafeArea(
          child: Container(
    child: rowOfBirthdateInput(
                myControllerDay: myControllerDay,
                myControllerMonth: myControllerMonth,
                myControllerYear: myControllerYear),
         
        )); 
  }
}




class rowOfBirthdateInput extends StatelessWidget {
  rowOfBirthdateInput({
    Key key,
    @required this.myControllerDay,
    @required this.myControllerMonth,
    @required this.myControllerYear,
  }) : super(key: key);

  final TextEditingController myControllerDay;
  final TextEditingController myControllerMonth;
  final TextEditingController myControllerYear;

  var valueDayKey;
  var valueMonthKey;
  var valueYearKey;
  var valueBirthKey;

  static int age;

  @override
  Widget build(BuildContext context) {
    (TEXTFIELD DECORATION...)
                        textInputAction: TextInputAction.next,
                        keyboardType: TextInputType.number,
                        maxLength: 2,
                        controller: myControllerDay,
                        inputFormatters: <TextInputFormatter>[
                          FilteringTextInputFormatter.allow(RegExp(r'[1-31]')),
                        ],
                        onChanged: (valueDay) {
                          if (valueDay.length == 2)
                            FocusScope.of(context).nextFocus();
                          valueDayKey = valueDay;
                          print(valueDayKey);
                        })),
              ),
            ],
          ),
          Column(
            children: <Widget>[
                  (TEXTFIELD DECORATION...)

                        textInputAction: TextInputAction.next,
                        keyboardType: TextInputType.number,
                        maxLength: 2,
                        controller: myControllerMonth,
                        inputFormatters: <TextInputFormatter>[
                          FilteringTextInputFormatter.allow(
                              RegExp(r'[1 - 12]')),
                        ],
                        onChanged: (valueMonth) {
                          if (valueMonth.length == 2)
                            FocusScope.of(context).nextFocus();
                          valueMonthKey = valueMonth;
                          print(valueMonthKey);
                        })),
              ),
            ],
          ),
          Column(
            children: <Widget>[
                  (TEXTFIELD DECORATION...)

                        textInputAction: TextInputAction.done,
                        keyboardType: TextInputType.number,
                        inputFormatters: <TextInputFormatter>[
                          FilteringTextInputFormatter.allow(
                              RegExp(r'[1952 - 2003]')),
                        ],
                        maxLength: 4,
                        controller: myControllerYear,
                        onChanged: (valueYear) {
                          if (valueYear.length == 4)
                            FocusScope.of(context).unfocus();
                          valueYearKey = valueYear;
                          valueBirthKey = valueDayKey +
                              '-' +
                              valueMonthKey +
                              '-' +
                              valueYearKey;
                          print(valueBirthKey);
                          DateTime _dateTime = DateTime(
                            int.parse(valueBirthKey.substring(6)),
                            int.parse(valueBirthKey.substring(3, 5)),
                            int.parse(valueBirthKey.substring(0, 2)),
                          );
                          age = DateTime.fromMillisecondsSinceEpoch(
                                      DateTime.now()
                                          .difference(_dateTime)
                                          .inMilliseconds)
                                  .year -
                              1970;
                          print(age);
                          return UserAge.age = age;
                        })),
               
            ],
          ),
        ],
      ),
    );
  }
}

class UserAge with ChangeNotifier {
  static int age;
  notifyListeners();
}


解决方案

Regex expression used in the TextFormField is limiting 4,6,7,8 in the year fields

Regex for allowing 0-12 will

FilteringTextInputFormatter.allow(RegExp(r'\d[1-2]*$')),

you can validate the entered value either in onChanged callback or onSaved callback of the text form field. or you can use the datepicker to choose the date.

selectDate(BuildContext context) async {
  final DateTime picked = await showDatePicker(
      context: context,
      initialDate: selectedDate,
      initialDatePickerMode: DatePickerMode.day,
      firstDate: DateTime(1952),
      lastDate: DateTime(2003));
  if (picked != null)
    setState(() {
      selectedDate = picked;
      _dateController.text = DateFormat.yMd().format(selectedDate);
    });
}

There you can give the initial and last date to be picked.

you can find the more info of date picker here

这篇关于如何解决在TextField中输入数字的问题?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆