时间戳

首页 > 解决方案 > 如何：在 TextFormField 中输入时每 4 个字符后添加一个空格

flutter - 如何：在 TextFormField 中输入时每 4 个字符后添加一个空格

问题描述

我正在尝试找到一种在输入TextFormField.

不久前我找到了一种方法，但我现在找不到它，无论我在 Google 上搜索什么或在 StackOverflow 上搜索..

基本上我想将文本字段中显示的文本000011112222333从0000 1111 2222 3333

我猜我需要在 a 的功能中使用一些RegExp检查并使用它来更改'sonChangedTextFormFieldTextEditingController.text

标签： flutterdart

解决方案

我之前也遇到过这个问题，幸运的是找到了一种方法来解决这个问题。首先创建一个扩展 TextInputFormatter 的类

customInputFormatter.dart

class CustomInputFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    var text = newValue.text;

    if (newValue.selection.baseOffset == 0) {
      return newValue;
    }

    var buffer = new StringBuffer();
    for (int i = 0; i < text.length; i++) {
      buffer.write(text[i]);
      var nonZeroIndex = i + 1;
      if (nonZeroIndex % 4 == 0 && nonZeroIndex != text.length) {
        buffer.write(' '); // Replace this with anything you want to put after each 4 numbers
      }
    }

    var string = buffer.toString();
    return newValue.copyWith(
        text: string,
        selection: new TextSelection.collapsed(offset: string.length)
    );
  }
}

然后将其添加到 TextFormField 的 inputFormatters[] 列表中

inputFormatters: [
   FilteringTextInputFormatter.digitsOnly,
   new CustomInputFormatter()
],

推荐阅读