如何在Flutter TextField上使用InputFormatter？

Question

我需要插入TextField(inputFormatters:什么？

我希望禁止\和/一个TextField只允许a到Z别人了.

Answer 1

格式化程序

在服务库中,您将找到TextInputFormatter 抽象类(这意味着您必须导入package:flutter/services.dart).

它已经有两个实现,它们是BlacklistingTextInputFormatter和WhitelistingTextInputFormatter.

如果要实现自己的格式化程序,可以通过扩展TextInputFormatter自身并formatEditUpdate在其中实现来实现.

我将展示如何在给定的上下文中应用两个预制格式化程序.

例子

不允许\和/

为此,我们将使用BlacklistingTextInputFormatter:

TextField(inputFormatters: [
            BlacklistingTextInputFormatter(RegExp("[/\\\\]")),
          ])

对于Pattern需要提供给格式化程序的,我将使用RegExp,即正则表达式.您可以在此处找到更多相关信息,还可以将您链接到我将在示例中使用的功能.

支付注意的四反斜杠\\\\.这实际上只代表一个反斜杠.原因是在Dart反斜杠是转义键和双反斜杠然后重新表示单个反斜杠,这是相同的RegExp,其中反斜杠也是转义键.

所以,如果我们要阻止a,b,F,!和.,我们也会把它放在一个列表[...]如下:

BlacklistingTextInputFormatter(RegExp("[abF!.]"))

这转化为" 将所有'a','b','F','!'列入黑名单 和'.' ".

只允许a对Z

这次我们使用WhitelistingTextInputFormatter:

TextField(inputFormatters: [
            WhitelistingTextInputFormatter(RegExp("[a-zA-Z]")),
          ])

为此,我们指定了两个字符范围:a-z并且A-Z,它们也接受指定的两个字符之间的所有字符(这里是所有字母).这也将工作的0-9,你可以添加任何字符到该列表,例如a-zA-Z0-9!.也将采取!和.考虑.

我们可以结合这个

TextField(inputFormatters: [
            WhitelistingTextInputFormatter(RegExp("[a-zA-Z]")),
            BlacklistingTextInputFormatter(RegExp("[abFeG]")),
          ])

这只是为了表明inputFormatters需要一个List<InputFormatter>.实际上你应该用一个白名单和一个正则表达式解决这个问题,但这确实有效.

Answer 2

其他选项：

• 小写字母：az

• 大写字母：AZ

• 小写元音重音：á-ú

• 大写元音重音：Á-Ú

• 数字：0-9
• 空格：（一个空格）

注意：间距是为了更好地解释

inputFormatters: [
        WhitelistingTextInputFormatter(RegExp("[a-z A-Z á-ú Á-Ú 0-9]"))
      ]

Answer 3

BlacklistingTextInputFormatter并且WhitelistingTextInputFormatter是@Deprecated 版本 1.20.0

现在您可以使用FilteringTextInputFormatterto do InputFormatteronTextField或TextFormField。

    inputFormatters: [FilteringTextInputFormatter.allow(RegExp(r'^ ?\d*')),]
    inputFormatters: [FilteringTextInputFormatter.deny(' ')]
    inputFormatters: [FilteringTextInputFormatter.digitsOnly]

前任

  TextFormField(
            keyboardType: TextInputType.number,
            inputFormatters: [
              FilteringTextInputFormatter.digitsOnly
            ],
          ),