flutterTextField实现⼿机号344格式输⼊(同理银⾏卡号格式
输⼊)
最近flutter项⽬登录页⾯,⼿机号输⼊有要求是131 **** ****输⼊格式。之前实现⽅法是使⽤TextField输⼊框,加上输⼊格式化的属性inputFormatters实现。然鹅呢,空格是加上了,光标位置⼀直在⽂本后,这样呢就导致在⼿机号中部删除或编辑,光标都会跳到⽂本的末尾。为了解决这个问题呢,就对inputFormatters具体实现⽅法做了⼀下改进:
inputFormatters: [
//格式化输⼊内容
TextInputFormatter.withFunction((oldValue, newValue) {
String text = ;
String positionStr =
(text.substring(0, newValue.selection.baseOffset))
.
replaceAll(RegExp(r"\s+\b|\b\s"), "");//获取光标左边的⽂本
//计算格式化后的光标位置
int length = positionStr.length;
if (length <= 3) {
position = length;
} else if (length <= 7) {
position = length + 1;
} else if (length <= 11) {
position = length + 2;
} else {
position = 13;
}
//这⾥格式化整个输⼊⽂本
text = placeAll(RegExp(r"\s+\b|\b\s"), "");
String string = "";
for (int i = 0; i < text.length; i++) {
if (i > 10) {
break;
}
if (i == 3 || i == 7) {
if (text[i] != " ") {
string = string + " ";
}
}
string = string + text[i];
}
text = string;
return TextEditingValue(
text: text,
selection: TextSelection.fromPosition(TextPosition(
offset: position, affinity: TextAffinity.upstream)),
);
}),replaceall()
/
/限制输⼊⽂本长度
LengthLimitingTextInputFormatter(13)
]
OK,这样成功解决了在中部编辑号码时,光标会后跳的问题。
下⾯顺便提⼀下发现的⼀个问题啊,那就是TextField设置keyboardType属性为visiblePassword时,并且obscureText为false(默认false),在IOS⼿机上还是能切换成中⽂输⼊法。
所以当obscureText可以为false的话,只能同过inputFormatters属性来限制输⼊中⽂啦:
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(
“[a-zA-Z]|[0-9]”)), //只能输⼊字母或数字LengthLimitingTextInputFormatter(maxLength),//最⼤长度]
OK!Over!

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。