Flutter/Dart中如何禁止TextFormField输入字母仅允许数字？

核心实现逻辑为使用Flutter自带的FilteringTextInputFormatter输入格式化器，从输入拦截层直接过滤非数字字符，同时满足展示和存储层面的纯数字要求，不需要额外做二次处理。

实现步骤 #

• 1. 导入基础服务库
     首先引入包含输入格式化类的services库：
     import 'package:flutter/services.dart';
• 2. 给TextFormField配置输入过滤规则
     在TextFormField的inputFormatters参数中添加FilteringTextInputFormatter.digitsOnly，即可拦截所有非数字字符的输入，用户输入字母时不会有任何输入反馈，展示内容天然为纯数字。
• 3. 直接使用过滤后内容
     无论是通过TextEditingController的text属性取值，还是通过表单的onSaved回调取值，拿到的都是已经过滤完成的纯数字内容，可直接存储。

完整示例代码 #

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class NumberOnlyTextFieldDemo extends StatefulWidget {
  const NumberOnlyTextFieldDemo({super.key});

  @override
  State<NumberOnlyTextFieldDemo> createState() => _NumberOnlyTextFieldDemoState();
}

class _NumberOnlyTextFieldDemoState extends State<NumberOnlyTextFieldDemo> {
  final TextEditingController _controller = TextEditingController();
  final _formKey = GlobalKey<FormState>();

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          TextFormField(
            controller: _controller,
            keyboardType: TextInputType.number, // 直接弹出数字键盘，优化输入体验
            inputFormatters: [
              // 核心过滤逻辑：仅允许数字输入，其他字符输入时直接被拦截
              FilteringTextInputFormatter.digitsOnly,
            ],
            decoration: const InputDecoration(labelText: '仅允许输入数字'),
            onSaved: (value) {
              // 此处拿到的value已经是纯数字，可直接存储
              debugPrint('存储的纯数字内容：$value');
            },
          ),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
                _formKey.currentState!.save();
                // 直接取controller.text也是过滤后的纯数字
                debugPrint('controller取值：${_controller.text}');
              }
            },
            child: const Text('提交'),
          )
        ],
      ),
    );
  }
}

自定义规则扩展 #

如果需要适配带小数点、负号等特殊数字场景，可以自定义正则规则替换内置的digitsOnly，示例如下：
允许带负号、最多两位小数的数字规则：
FilteringTextInputFormatter.allow(RegExp(r'^-?\d+\.?\d{0,2}'))

内容的提问来源于stack exchange，提问作者Learning Code