如何完全隐藏Flutter中的密码输入?

时间:2019-08-05 12:59:00

标签: flutter flutter-web

我正在使用Flutter网站处理登录表单。我希望我的第二个TextField(用于输入密码的那个)隐藏用户输入。我已经将obscureText属性设置为true

enter image description here

我不希望显示“ f”。 可以这样做吗?

1 个答案:

答案 0 :(得分:1)

没有简单的方法可以做到这一点; 因此必须使用控制器和StatefulWidget将输入的值转换为“ *”

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;

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