Was just exploring flutter and got stuck. The prefixIcon disappears on clicking field and it appears back when focused out. How to solve this ? The code is as below. Tried removing the key of form. I want the icon to stay even if focused in or focused out. Is there any other property to set? Couldn't be able to find a fix.
class _MyHomePageState extends State<MyHomePage> {
String _email = "";
String _password = "";
final _formKey = GlobalKey<FormState>();
final FocusNode _emailFocus = FocusNode();
final FocusNode _passwordFocus = FocusNode();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Container(
padding: const EdgeInsets.symmetric(horizontal: 50.0,vertical: 100.0),
decoration: BoxDecoration(color: Colors.white),
child:Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
TextFormField(
focusNode: _emailFocus,
decoration: InputDecoration(
labelText: 'Username or email',
prefixIcon: Icon(Icons.person), //prefixIcon
focusedBorder: UnderlineInputBorder(),
hintText: "example@mail.com",
)
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
),
TextFormField(
obscureText: true,
focusNode: _passwordFocus,
decoration: InputDecoration(
labelText: 'Password',
prefixIcon: Icon(Icons.lock),
focusedBorder: UnderlineInputBorder(),
)
) ,
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: RaisedButton(
onPressed: () {
// Validate will return true if the form is valid, or false if
// the form is invalid.
if (_formKey.currentState.validate()) {
// Process data.
}
},
child: Text('Submit'),
),
),
],
),
)
)
);
}
}
The issue was that I had set the primary colour to white. So whenever the field was focused it was disappering as the background was also white. My bad.