Changing lowercase into upper case in real time in Flutter web

Question

Basically, I am trying to get it so that when the user types in a lowercase letter, let's say "a", the screen will output an uppercase "A" instead. This is in flutter web using a keyboard. Any ideas?

Answer 1

Widget TextFormField have a propriety textCapitalization

Show you :

TextFormField(
  keyboardType: TextInputType.text,
  textCapitalization: TextCapitalization.sentences,
),

You have different proprieties like

textCapitalization: TextCapitalization.characters,
textCapitalization: TextCapitalization.none, // Default
textCapitalization: TextCapitalization.sentences,
textCapitalization: TextCapitalization.words,

Answer 2

You can use TextInputFormatter

class UpperCaseFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue, TextEditingValue newValue) {
    return newValue.copyWith(text: newValue.text.toUpperCase());
  }
}

And use like

TextField(
  inputFormatters: [ UpperCaseFormatter() ],
),