How to format initial value for TextFormField using formatter in Flutter?-CodePudding

I have a text field in which users enter sums. And I want these sums to be formatted by thousands (for example 500 000). I found a formatter that can do that. The problem is that this formatter is not called, when initial value is set in controller. As a result text is not formatted until user modifies it.

For example, if we set initial value as 500000 then text field shows 500000 instead of 500 000 until user modifies this value.

This is my code:

class ThousandTextInputFormatter extends TextInputFormatter {
  static const separator = ','; // Change this to '.' for other locales

  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue, TextEditingValue newValue) {
    // Short-circuit if the new value is empty
    if (newValue.text.length == 0) {
      return newValue.copyWith(text: '');
    }

    // Handle "deletion" of separator character
    String oldValueText = oldValue.text.replaceAll(separator, '');
    String newValueText = newValue.text.replaceAll(separator, '');

    if (oldValue.text.endsWith(separator) &&
        oldValue.text.length == newValue.text.length   1) {
      newValueText = newValueText.substring(0, newValueText.length - 1);
    }

    // Only process if the old value and new value are different
    if (oldValueText != newValueText) {
      int selectionIndex =
          newValue.text.length - newValue.selection.extentOffset;
      final chars = newValueText.split('');

      String newString = '';
      for (int i = chars.length - 1; i >= 0; i--) {
        if ((chars.length - 1 - i) % 3 == 0 && i != chars.length - 1)
          newString = separator   newString;
        newString = chars[i]   newString;
      }

      return TextEditingValue(
        text: newString.toString(),
        selection: TextSelection.collapsed(
          offset: newString.length - selectionIndex,
        ),
      );
    }

    // If the new value and old value are the same, just return as-is
    return newValue;
  }
}

...

var sumController = TextEditingController(text: 500000.toString());//setting initial value
...
TextFormField(
  inputFormatters: [ThousandTextInputFormatter()],
  controller: sumController,
)

Could anyone say how to format initial value using formatter, if it is possible?

CodePudding user response：

I made it work this way:

sumController.value = ThousandTextInputFormatter()    
  .formatEditUpdate(TextEditingValue.empty, TextEditingValue(text: 500000.toString()));

CodePudding user response：

Try adding a value to the textController instead of setting _textController.text

_textEditingController.value = TextEditingValue(text: "500000");

EDIT

myTextEditingController.value.copyWith(
  text: "5000000",
  selection: TextSelection(
    baseOffset: "5000000".length,
    extentOffset: "5000000.length
  )
)

CodePudding user response：

In the initState() method of your class, you can call the controller to format the text.