TextFormField character limit not working

Question

TL;DR maxLength in TextFormField sometimes allows more characters than the specified limit. Why does this happen?

I'm trying to create a Form to feed user-inputted data into my app. As part of this, I have a TextFormField where I seek to limit the maximum number of characters allowed for input using maxLength.

My issue is, while maxLength mostly works fine, it seems to be possible to input more characters than the specified limit, particularly when inputting quickly (e.g. pressing digits in rapid succession). In my code snippet below, I set a maxLength of 6 chars, but if you type quickly enough, it's possible to input 7 chars. i.e. The maximum number possible should be 999,999, but it's possible to input 9,999,999.

My code snippet

TextFormField(// text form field for inputting a number
            validator: (val) => val.isEmpty ? 'Please enter a target to save' : null,

            // Using inputFormatters to only accept digits as inputs
            inputFormatters: <TextInputFormatter>[WhitelistingTextInputFormatter.digitsOnly,],
            keyboardType: TextInputType.number,

            // When I specify a maxLength of 6, it can still receive up to 7 digits if entered quickly
            maxLength: 6,

            onChanged: (val) {
              setState(() {
                _new_number_to_input = int.parse(val);
              });
            },
          ),

I have also tried using the following code as part of inputFormatters, however, it doesn't really do what I want.

new LengthLimitingTextInputFormatter(6)

I realise that I can also add val.length < 7 as part of my validator function, but I'm trying to find a less finicky solution. I'm also wondering what other implications this issue posted may have, as I was hoping that form validation would allow me to pretty much trust the integrity of inputted data ~100%.

Is there something wrong with my code above that's resulting in this? What's going on with maxLength, and why is it possible to exceed the character limit when typing quickly?

Answer 1

Add maxLengthEnforced: true, to the TextFormField along with maxLength: 6,.

Small Example:

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Form(
      autovalidate: true,
      onChanged: () {
        Form.of(primaryFocus.context).save();
      },
      child: Wrap(
        children: List<Widget>.generate(5, (int index) {
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: ConstrainedBox(
              constraints: BoxConstraints.tight(Size(200, 50)),
              child: TextFormField(
                maxLength: 6,
                maxLengthEnforced: true,
                onSaved: (String value) {
                  print('Value for field $index saved as "$value"');
                },
              ),
            ),
          );
        }),
      ),
    );
  }
}

Referenced from TextFormField Docs