颤振日期格式化程序无法正常工作

Question

*****编辑***** 所以现在我按照我的预期进行了格式化，任何人都知道为什么一旦它在文本字段中，如果他们输入了额外的字符或犯了错误，为什么他们不能退格和删除？这是格式化的工作代码。

    class _DateFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue,
      TextEditingValue newValue
      ) {
    final int newTextLength = newValue.text.length;
    int selectionIndex = newValue.selection.end;
    int usedSubstringIndex = 0;
    final StringBuffer newText = new StringBuffer();
    /*if (newTextLength >= 1) {
      newText.write('');
      if (newValue.selection.end >= 1)
        selectionIndex++;
    }*/
    if (newTextLength >= 2) {
      newText.write(newValue.text.substring(0, usedSubstringIndex = 2) + '/');
      if (newValue.selection.end >= 3)
        selectionIndex += 2;
    }
    if (newTextLength >= 5) {
      newText.write(newValue.text.substring(2, usedSubstringIndex = 4) + '/');
      if (newValue.selection.end >= 5)
        selectionIndex +=2;
    }
    if (newTextLength == 10) {
      newText.write(newValue.text.substring(4, usedSubstringIndex = 8) + '');
      if (newValue.selection.end >= 9)
        selectionIndex +=4;
    }
    // Dump the rest.
    if (newTextLength >= usedSubstringIndex)
      newText.write(newValue.text.substring(usedSubstringIndex));
    return new TextEditingValue(
      text: newText.toString(),
      selection: new TextSelection.collapsed(offset: selectionIndex),
    );
  }
}

感谢任何帮助。还有谁能想到它在 Android 中的工作方式与在 iOS 中不同的原因？

Answer 1

您可以将三个TextFields 中的Row 分别用于(DD/MM/YY)。

使用TextEditingController，您可以根据自己的喜好对输入的文本进行一些限制（例如：日/月 2 个键盘输入，一年 4 个键盘输入）。此外，当达到当前的限制时，您可以转移TextField 的焦点：

• 使用_dayFocus.unfocus();，从键盘上取消订阅TextField。
• 使用FocusScope.of(context).requestFocus(_monthFocus);，将焦点转移到月份TextField，依此类推。

示例：

代码：

import "package:flutter/material.dart";
import 'package:flutter/src/services/text_editing.dart';

class DateFormat extends StatefulWidget {
  @override
  _DateFormatState createState() => new _DateFormatState();
}

class _DateFormatState extends State<DateFormat> {

  TextEditingController _dayController = new TextEditingController();
  String day = "";
  FocusNode _dayFocus = new FocusNode();
  bool _dayFocused = true;

  TextEditingController _monthController = new TextEditingController();
  String month = "";
  FocusNode _monthFocus = new FocusNode();

  //bool _monthFocused=false;

  TextEditingController _yearController = new TextEditingController();
  String year = "";
  FocusNode _yearFocus = new FocusNode();

  //bool _yearFocused;


  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      key: _scaffoldKey,
      appBar: new AppBar(title: new Text("Date Format"),),
      body: new Row(
        children: <Widget>[ new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            autofocus: _dayFocused,
            focusNode: _dayFocus,
            controller: _dayController,
            onChanged: (value) {
              if (value.length <= 2) {
                //save
                day = value;
              }
              else {
                _dayFocus.unfocus();
                FocusScope.of(context).requestFocus(_monthFocus);
                // _monthFocused =true;
                _dayController.value = new TextEditingValue(
                    text: day,
                    composing: new TextRange(
                      start: 0,
                      end: 2,
                    )
                );
              }
            },
          ),),
        new Text("/"),
        new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            focusNode: _monthFocus,
            controller: _monthController,
            onChanged: (value) {
              if (value.length <= 2) {
                //save
                month = value;
              }
              else {
                _monthFocus.unfocus();
                FocusScope.of(context).requestFocus(_yearFocus);
                _monthController.value = new TextEditingValue(
                    text: month,
                    composing: new TextRange(
                      start: 0,
                      end: 2,
                    )
                );
              }
            },
          ),),
        new Text("/"),
        new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            focusNode: _yearFocus,
            controller: _yearController,
            onChanged: (value) {
              if (value.length <= 4) {
                //save
                year = value;
              }
              else {
                _yearFocus.unfocus();
                _yearController.value = new TextEditingValue(
                    text: year,
                    composing: new TextRange(
                      start: 0,
                      end: 4,
                    )
                );
              }
            },
            onSubmitted: (value) =>
                _scaffoldKey.currentState.showSnackBar(new SnackBar(
                    content: new Text("Your date is $day/$month/$value"))),),),

        ],),);
  }
}

更新

要忽略斜线事件，我们需要用第三个输入更新下一个TextEditingController，使其继续如下：

import "package:flutter/material.dart";
import 'package:flutter/src/services/text_editing.dart';

class DateFormat extends StatefulWidget {
  @override
  _DateFormatState createState() => new _DateFormatState();
}

class _DateFormatState extends State<DateFormat> {

  TextEditingController _dayController = new TextEditingController();
  String day = "";
  FocusNode _dayFocus = new FocusNode();
  bool _dayFocused = true;

  TextEditingController _monthController = new TextEditingController();
  String month = "";
  FocusNode _monthFocus = new FocusNode();

  //bool _monthFocused=false;

  TextEditingController _yearController = new TextEditingController();
  String year = "";
  FocusNode _yearFocus = new FocusNode();

  //bool _yearFocused;


  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      key: _scaffoldKey,
      appBar: new AppBar(title: new Text("Date Format"),),
      body: new Row(
        children: <Widget>[ new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            autofocus: _dayFocused,
            focusNode: _dayFocus,
            controller: _dayController,
            onChanged: (value) {
              if (value.length <= 2) {
                //save
                day = value;
              }
              else {
                _dayFocus.unfocus();
                _monthController.text = value[2];
                _monthController.selection=new TextSelection.collapsed(offset: 1);
                FocusScope.of(context).requestFocus(_monthFocus);
                // _monthFocused =true;
                _dayController.value = new TextEditingValue(
                    text: day,
                    composing: new TextRange(
                      start: 0,
                      end: 2,
                    )
                );
              }
            },
          ),),
        new Text("/"),
        new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            focusNode: _monthFocus,
            controller: _monthController,
            onChanged: (value) {
              if (value.length <= 2) {
                //save
                //_monthController.text = value;
                month = value;

              }
              else {
                _yearController.text = value[2];
                _yearController.selection=new TextSelection.collapsed(offset: 1);
                _monthFocus.unfocus();
                FocusScope.of(context).requestFocus(_yearFocus);
                _monthController.value = new TextEditingValue(
                    text: month,
                   // selection: new TextSelection(baseOffset: 1, extentOffset: 1),
                    composing: new TextRange(
                      start: 0,
                      end: 2,
                    )
                );
              }
            },
          ),),
        new Text("/"),
        new Flexible (
          child: new TextField(
            keyboardType: TextInputType.datetime,
            focusNode: _yearFocus,
            controller: _yearController,
            onChanged: (value) {
              if (value.length <= 4) {
                //save
                year = value;
              }
              else {
                _yearFocus.unfocus();
                _yearController.value = new TextEditingValue(
                    text: year,
                    composing: new TextRange(
                      start: 0,
                      end: 4,
                    )
                );
              }
            },
            onSubmitted: (value) =>
                _scaffoldKey.currentState.showSnackBar(new SnackBar(
                    content: new Text("Your date is $day/$month/$value"))),),),

        ],),);
  }
}