一尘不染

如何在Flutter TextField上使用InputFormatter?

flutter

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

我希望禁止\/一个TextField只允许aZ别人了。


阅读 2516

收藏
2020-08-13

共1个答案

一尘不染

格式化程序

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

它已经有两个实现,分别是BlacklistingTextInputFormatterWhitelistingTextInputFormatter

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

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

例子

禁止\/

为此,我们将使用BlacklistingTextInputFormatter

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

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

薪酬 关注
的四倍反斜杠\\\\。这实际上只代表一个反斜线。这样做的原因是,在Dart中,反斜杠是转义键,而双反斜杠则表示一个单反斜杠,并且对于RegExp,反斜杠也是转义键。

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

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

这表示“ 将所有’a’,’b’,’F’,’! 和“。” ”。

只允许aZ

这次我们使用WhitelistingTextInputFormatter

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

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

我们可以结合起来

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

这仅表明inputFormatters需要一个List<InputFormatter>。实际上,您应该使用一个白名单和一个正则表达式来解决此问题,但这也可以正常工作。

2020-08-13