How to fully hide password input in Flutter?

Question

I'm working on a login form using Flutter web. I want my second TextField (the one for my password) to hide the user inputs. I've already set the obscureText property to true.

I dont want the "f" to be displayed. Is it possible to do that ?

Answer 1

There is no easy way to do that; So would have to use controller and StatefulWidget that converts inputed value to "*"

class Testas extends StatefulWidget{
  @override
  _TestasState createState() => _TestasState();
}

class _TestasState extends State<Testas> {
  String _valueToShow = "";
  String _value = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: TextField(
          controller: TextEditingController.fromValue(TextEditingValue(text: _valueToShow, selection: new TextSelection.collapsed(offset: _valueToShow.length))),
          onChanged: (String val){
            String value = "";
            if(val.length > _value.length){
                value+=val.substring(_value.length, val.length);
              }
              if(val.length < _value.length){
                value = _value.substring(1, val.length);
              }
            String valueToShow = "*" * val.length;
            setState(() {
                _valueToShow = valueToShow;
                _value = value;

            });
          },
        ),
      ),
    );
  }
}