如何在Flutter TextField上使用InputFormatter？ [英] How to use InputFormatter on Flutter TextField?
问题描述
我需要在 TextField（inputFormatters：中插入什么？
我要禁止 one 和 / 放在一个 TextField 中，并且只允许 a 到 Z
I want to disallow \ and / in one TextField and only allow a to Z in another.
推荐答案
格式化程序
在服务库，您会发现 TextInputFormatter 抽象类（这意味着您必须导入 package：flutter / services.dart ）。
Formatters
In the services library you will find the TextInputFormatter abstract class (this means that you have to import package:flutter/services.dart).
它已经具有实现，即 FilteringTextInputFormatter （以前是 BlacklistingTextInputFormatter 和 WhitelistingTextInputFormatter ）和 LengthLimitingTextInputFormatter 。
It already has implementations, which are FilteringTextInputFormatter (formerly BlacklistingTextInputFormatter and WhitelistingTextInputFormatter) and LengthLimitingTextInputFormatter.
如果您想实现自己的格式化程序，则可以通过扩展 TextInputFormatter 本身并实现 formatEditUpdate 。
If you want to implement your own formatter, you can do so by extending TextInputFormatter itself and implementing formatEditUpdate in there.
我将展示如何在给定的上下文中应用预制的 FilteringTextInputFormatter 。
I will show how to apply the premade FilteringTextInputFormatter with given context.
不允许 \ 和 /
我们将使用 Filteri ngTextInputFormatter.deny 构造函数：
For this we are going to use the FilteringTextInputFormatter.deny constructor:
TextField(
inputFormatters: [
FilteringTextInputFormatter.deny(RegExp(r'[/\\]')),
],
)
对于需要提供给格式化程序的模式，我将使用 RegExp ，即正则表达式。您可以在此处找到更多相关信息，还将您链接到我将在示例中使用的功能。
For the Pattern, which needs to be supplied to the formatter, I will be using RegExp, i.e. regular expressions. You can find out more about that here, which also links you to the features I will be using in my examples.
支付注意到双反斜杠 \\ 和原始字符串（ r''）。实际上，这仅表示一个反斜杠。原因是反斜杠是 RegExp 中的转义键，因此如果要匹配 \ 字符。我们甚至需要没有原始字符串（ r’）的四倍反斜杠，因为Dart还将反斜杠用作转义键。使用原始字符串将确保Dart不会转义字符。
Pay attention to the double backslash \\ and the raw string (r'') in this example. This represents only a single backslash in reality. The reason for this is that backslashes are escape keys in RegExp, so we need to use two backslashes if we want to match the \ character. We would even need quadruple backslashes without the raw string (r'') because Dart also uses backslashes as escape keys. Using a raw string will ensure that Dart does not escape characters.
如果我们要阻止 a ， b ， F ，！和。，我们也将其放在列表 [...] 中，如下所示：
If we were to block a, b, F, !, and ., we would also put it in a list [...] like this:
FilteringTextInputFormatter.deny(RegExp('[abF!.]'))
这将翻译为 拒绝/黑名单所有'a'，'b'，'F'，'！'和'。。
仅允许 a 到 Z
这次，我们使用 FilteringTextInputFormatter.allow 构造函数：
This time we use the FilteringTextInputFormatter.allow constructor:
TextField(
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp('[a-zA-Z]')),
],
)
为此，我们指定两个字符范围： az 和 AZ ，其中还将接受这两个指定字符之间的所有字符（此处为所有字母）。这也适用于 0-9 ，您可以在列表中附加任何字符，例如 a-zA-Z0-9！。也将使用！和。记入帐户。
For this, we are specifying two ranges of characters: a-z and A-Z, which will also accept all the characters (here all the letters) in-between those two specified. This will also work for 0-9 and you can append any character to that list, e.g. a-zA-Z0-9!. will also take ! and . into account.
TextField(
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp('[a-zA-Z]')),
FilteringTextInputFormatter.deny(RegExp('[abFeG]')),
],
)
这只是为了显示 inputFormatters 使用 List< InputFormatter> ，并且可以组合多个格式化程序。实际上，您可以使用一个允许/白名单和一个正则表达式来解决此问题，但这也有效。
This is only to show that inputFormatters takes a List<InputFormatter> and multiple formatters can be combined. In reality, you can solve this with one allow/whitelist and a regular expression, but this does work as well.
也已经包含 FilteringTextInputFormatter 类中的静态属性 ：其中之一是 FilteringTextInputFormatter.digitsOnly 。
仅接受/允许数字，等效于 .allow（RegExp（'[0-9]'））格式化程序。
There are also already included static properties in the FilteringTextInputFormatter class: one of these is FilteringTextInputFormatter.digitsOnly.
It will only accept/allow digits and is equivalent to an .allow(RegExp('[0-9]')) formatter.
这篇关于如何在Flutter TextField上使用InputFormatter？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
