Want to show hide password in TextFormField? First make you widget StatefulWidget if it is a StatelessWidget.Then have a variable bool _obscureText and pass it to your TextFormField. The toggle it with setState as required.
Here is an example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | class _FormFieldSampleState extends State<FormFieldSample> { // Initially password is obscure bool _obscureText = true; String _password; // Toggles the password show status void _toggle() { setState(() { _obscureText = !_obscureText; }); } @override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text("Sample"), ), body: new Container( child: new Column( children: <Widget>[ new TextFormField( decoration: const InputDecoration( labelText: 'Password', icon: const Padding( padding: const EdgeInsets.only(top: 15.0), child: const Icon(Icons.lock))), validator: (val) => val.length < 6 ? 'Password too short.' : null, onSaved: (val) => _password = val, obscureText: _obscureText, ), new FlatButton( onPressed: _toggle, child: new Text(_obscureText ? "Show" : "Hide")) ], ), ), ); } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
