Flutter 中仅包含数字的 TextFormField

2023-12-21

我正在开发一个需要输入价格的应用程序¥因此没有小数位。 如果我们使用keyboardType: TextInputType.numberWithOptions()我们可以获得数字键盘输入。 如果我们使用validator: (input) { }我们可以检查输入是否有效,但我们无法阻止它。

问题是我们可以保存不需要验证的草稿。 因此,我们最好一开始就只允许数字输入。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Digits Only',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            TextFormField(
              autovalidate: true,
              keyboardType: TextInputType.number,
              validator: (input) {
                final isDigitsOnly = int.tryParse(input);
                return isDigitsOnly == null
                    ? 'Input needs to be digits only'
                    : null;
              },
            ),
          ],
        ),
      ),
    );
  }
}

有没有办法阻止某些文本输入并只允许数字?


是的,您可以使用inputFormatters属性并添加WhitelistingTextInputFormatter.digitsOnly表达

  import 'package:flutter/services.dart';


  TextFormField(
          ...
          inputFormatters: [WhitelistingTextInputFormatter.digitsOnly],
        )

您可以在这里找到更多信息:https://docs.flutter.io/flutter/services/TextInputFormatter-class.html https://docs.flutter.io/flutter/services/TextInputFormatter-class.html

颤振1.12之后,WhitelistingTextInputFormatter已被弃用并且您正在运行较新的版本,请使用:

FilteringTextInputFormatter.digitsOnly

https://api.flutter.dev/flutter/services/FilteringTextInputFormatter-class.html https://api.flutter.dev/flutter/services/FilteringTextInputFormatter-class.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter 中仅包含数字的 TextFormField 的相关文章

随机推荐

  • 将用户输入从 NodeJS 发送到 shell 脚本

    我有这个 NodeJS 脚本 var util require util process require child process ls process exec test sh ls stdout on data function da
  • Mapbox GL JS:如果单击标记,则忽略地图单击事件

    我在地图上有一个标记 我想在单击它时更改其状态 并在单击地图上的其他位置时将其更改回来 问题是map on click console log 单击标记时也会触发 我只想查看标记单击事件 因为地图单击会调用状态回滚
  • 使用 Jersey 上传文件:FormDataContentDisposition 为 null

    我正在尝试使用 Jersey 实现文件上传 所以我遵循了这个示例 http www mkyong com webservices jax rs file upload example in jersey http www mkyong co
  • Moment js 将毫秒转换为日期和时间

    我的当前时间以毫秒为单位 1454521239279 如何将其转换为 03 FEB 2016 和时间 11 10 PM 矩解析器 moment 1454521239279 format DD MMM YYYY hh mm a parse i
  • 致命:无法获取凭证存储锁:文件存在

    我正在使用 git scm 并尝试推送到存储库 这样做后 我收到了以下消息 fatal unable to get credential storage lock File exists 虽然推送最终确实推送成功 但我想知道为什么会出现这个
  • 如何将 FlowDocument 中的表格放在一起?

    我想如果我将表格放在段落中 我可以使用 KeepTogether 属性将表格保持在一起 该表格用于报告的总计 客户不希望它们分成两页 想象一下 表中有 5 行 我快要疯了 不知道下一步该尝试什么 最后一行代码 myFlowDocument
  • (Laravel) 基于用户输入的接口动态依赖注入

    我目前在架构和实现方面面临着一个非常有趣的困境 我有一个名为ServiceInterface其中有一个方法称为execute 然后我对该接口有两种不同的实现 Service1 and Service2 它正确地实现了execute方法 我有
  • 是否有任何设计模式可以避免嵌套开关盒?

    我见过类似的线程 但是 不确定如何准确地将解决方案应用到我的案例中 我的问题是我有一组用例 可以说 A B C 当输入传递 2个用例是输入 是列出的用例中的任何2个时 我需要执行某些命令 例如 switch input1 case A br
  • AWS 步骤和批量动态命令

    我有一个带有单个作业定义的批处理作业 该作业定义根据环境命令选项上的参数执行 原值为 param2 XXX 但我需要根据 Step Functions 的输入参数使其保持动态 param2 param2 YYY 我无法将 Step Func
  • facet_grid 中的自由色阶

    假设我有以下数据框 Set seed for RNG set seed 33550336 Create toy data frame loc x lt c a 1 b 2 c 3 loc y lt c a 3 b 2 c 1 scaling
  • Imagemagick - 更改 Heroku 上的 policy.xml

    我正在尝试使用 Imagemagick 在 Heroku 上通过 https 访问图像 如何更改 Heroku 上的策略 在 policy xml 中 Heroku 于 2016 年 5 月进行了 ImageMagick 安全更新 http
  • WordPress 禁用 /admin 重定向到 /wp-admin

    我的网站是用wordpress 4 5 2 对于wordpress控制面板 可以正常登录myweb com wp admin目录 但我有另一个控制面板 目录中有其他应用程序myweb com admin 问题是每当我尝试登录myweb co
  • 通过输入框和 jquery 过滤选择列表

    我想知道是否可以获得一些帮助 通过 jquery 使用输入框过滤选择列表 这是我的 js 的样子 但它似乎不起作用 我猜这是因为选择列表中的选项不可隐藏
  • 我可以直接在表示层中使用域对象吗

    我最初有以下设置 表示层使用 gt 通过 WCF 生成的服务代理 gt 实际服务组件 代理生成于其中 通过 IIS 托管 gt 域层 业务逻辑 gt DAL 最初就是这样 但发现服务和 DAL 也应该访问域层 现在我有一个场景 在表示层中
  • 因为我无法在顶层运行等待,所以我必须将其放入异步函数中 - 为什么我可以直接调用该异步函数?

    我有一个简短的 Node js 脚本 我需要另一个包并从中调用异步函数 然后想要打印返回值 如果我简单地await来自顶层的返回值 然后我会得到一个错误 说我只能使用await在异步函数本身内部 所以显然要走的路是这样的 async fun
  • 在 boost::signals2 中混合使用 boost 智能指针和 C++11 智能指针

    我有一个使用的应用程序boost signals2组件之间进行通信 我试图通过使用它的自动连接管理功能slot type track weak ptr 问题 在我的整个计划中 std shared ptr用来 track期望一个boost
  • Android编程-屏幕分辨率

    我是 Android 编程新手 我见过运行 Android 的不同屏幕分辨率的手机 如何创建一个适用于所有 Android 设备的应用程序 而应用程序视图不会出现任何失真 简短的答案是调整所有布局项目的大小dip dip是缩写Density
  • iOS 增强现实,带有指南针和位置

    我正在尝试开发一个迷你 Around Me 例如使用相机 指南针和位置 我想在屏幕上显示地点的图像 目前我已经有了指南针的位置和方向 我想知道如何确定我要显示的位置的位置 感谢您的帮助 一旦有了相对距离和方位 您就可以使用以下算法从同一坐标
  • 在 PHP 中防止竞争条件的最可靠和安全的方法

    我需要在 PHP 中使用互斥体或信号量 这让我感到害怕 澄清一下 我并不害怕编写正确同步的无死锁代码 也不害怕并发编程的危险 而是害怕 PHP 处理边缘情况的能力 快速背景知识 编写位于用户和第 3 方信用卡网关之间的信用卡处理程序接口 需
  • Flutter 中仅包含数字的 TextFormField

    我正在开发一个需要输入价格的应用程序 因此没有小数位 如果我们使用keyboardType TextInputType numberWithOptions 我们可以获得数字键盘输入 如果我们使用validator input 我们可以检查输