flutter TextField限制输入为合法小数

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了flutter TextField限制输入为合法小数相关的知识,希望对你有一定的参考价值。

参考技术A

对于金额等的输入,常常要求TextField限制输入为小数,可使用以下约束:

但这种限制会有问题,比如可以输入 0.1.1 这种其实就不是小数了,并且不能限制小数点的输入位数。

继承TextInputFormatter类,重写formatEditUpdate方法:

温馨提示:

demo传送门

flutter TextField 限制只允许输入数字 小数点

也许你迷茫,但是我想说,在你迷茫的同时,保持本心,过好今天就好。


核心代码片段

    //只允许输入小数
    inputFormatters: [
      FilteringTextInputFormatter.allow(RegExp("[0-9.]")), 
    ],
    //键盘类型
    keyboardType: TextInputType.numberWithOptions(decimal: true),

TextField 中使用完整代码片段

TextField(
    ///键盘回车键的样式
    textInputAction: TextInputAction.next,
    //只允许输入小数
    inputFormatters: [
      FilteringTextInputFormatter.allow(RegExp("[0-9.]")), 
    ],
    //键盘类型
    keyboardType: TextInputType.numberWithOptions(decimal: true),
    //边框
    decoration: InputDecoration(
        hintText: '请输入',
        border: InputBorder.none),
    //不自动获取焦点
    autofocus: false,
)

这里采用的思路是 限制手机键盘的弹出类型为数字键盘,是带小数点的数据键盘,但是在Android手机上,会有其他特殊字符的出现,所以也需要使用正则来限制一下文本框内可输入的内容

inputFormatters
用于限制输入的内容,接收一个TextInputFormatter 类型的集合。


完毕


小编也写了几本书,如果你有兴趣可以去看看


以上是关于flutter TextField限制输入为合法小数的主要内容,如果未能解决你的问题,请参考以下文章

Flutter 常见问题四十三限制 TextField 的输入类型

flutter TextField 限制只允许输入数字 小数点

flutter TextField 限制只允许输入数字 小数点

flutter TextField 限制只允许输入数字 小数点

2020-11-18 解决Flutter TextField限制输入中文问题

Flutter——限制TextField只能输入汉字或英文字母或数字,并限制输入最多中文5字符,英文10字符