Flutter：输入多个空格时TextField自动添加一个点答案

【问题标题】：Flutter: TextField auto add a dot when input multiple spacesFlutter：输入多个空格时TextField自动添加一个点
【发布时间】：2022-01-25 13:59:05
【问题描述】：

我只是实现了一个简单的TextField，但是当我输入多个空格时，它会自动在其前添加一个点。

my-custom-flutter-textfield

这是我的自定义 TextField 小部件

@override
  Widget build(BuildContext context) {
    return Padding(
        padding: const EdgeInsets.all(5),
        child: Column(children: [
          Align(
              alignment: Alignment.topLeft,
              child: Padding(
                padding: const EdgeInsets.only(bottom: 5),
                child: Text(
                  title,
                ),
              )),
          TextField(
              controller: _controller,
              autocorrect: false,
              decoration: InputDecoration(
                isDense: true,
                contentPadding: const EdgeInsets.all(10),
                enabledBorder: OutlineInputBorder(
                  borderSide: const BorderSide(
                    color: Colors.black,
                    width: 2,
                  ),
                  borderRadius: BorderRadius.circular(5),
                ),
                focusedBorder: OutlineInputBorder(
                  borderSide: const BorderSide(
                    color: Colors.orange,
                    width: 2,
                  ),
                  borderRadius: BorderRadius.circular(5),
                ),
              ))
        ]));
  }

【问题讨论】：

标签： flutter dart textfield spaces

【解决方案1】：

这是 iOS 键盘和大多数 Android 键盘的标准功能。我认为你无法通过 Flutter 控制它。

【讨论】：

但我从未在真实设备上遇到过这种情况，我可以输入任意数量的空格。请您解释一下好吗？
自第一个 iPhone 以来，此功能一直存在。我在我的 android 上使用 Swfitkey，它也有这个功能。 Gboard，标准的安卓键盘，上次我用的时候也有这个功能。您可以手动将其关闭。编辑：我说的是 US-EN 配置。

【解决方案2】：

我认为这与应用本身无关，而是与手机有关。您需要从手机的设置中禁用它。

不过，如果您真的需要能够键入双空格，我会按照以下方式实现它。

final TextEditingController controller = TextEditingController();
  TextSelection? cursor;
  int length = 0;
  String lastChar = '';
  String currentChar = '';

  String replaceCharAt(String oldString, int index, String newChar) {
  // function from https://stackoverflow.com/questions/52083836/how-to-replace-only-one-character-in-a-string-in-dart
    return oldString.substring(0, index) +
        newChar +
        oldString.substring(index + 1);
  }

  void removeDotOnSpace(String input) {
    //save the position of the cursor
    cursor = controller.selection;

    lastChar = currentChar;
    // if the input isn't empty and if you're not removing text
    if (input.isNotEmpty && input.length > length) {
      currentChar = input[input.length - 1];
      // if it has at least two characters, the second to last being a dot and the "lastChar" variable not being a dot
      if (input.length >= 2 &&
          input[input.length - 2] == '.' &&
          lastChar != '.') {
        // replace the dot and set state. Because setstate resests cursor position we need to save it and give it back.
        setState(() {
          controller.text = replaceCharAt(input, input.length - 2, ' ');
          controller.selection = cursor!;
        });
      }
    } else {
      currentChar = '';
      lastChar = '';
    }
    length = input.length;
  }

把它放在一个有状态的小部件中，并在 onchanged 函数中使用它

 TextFormField(
              controller: controller,
              onChanged: (value) {
                removeDotOnSpace(value);
              },
            ),

PS：除非你的文本字段必须有双空格，否则你应该让它成为现实。

【讨论】：

【解决方案3】：

试试textCapitalization: TextCapitalization.words,

【讨论】：