how add text and icon inside TextFormField in flutter - flutter

Question

i want to make the text and icon inside TextFormField
this is my code
enter image description here
_FormField() {
return TextFormField(
validator: (value) {
if (value!.isEmpty) {
print("test");
}
},
decoration: InputDecoration(
fillColor: kPrimaryLightColor,
filled: true,
focusColor: kPrimaryLightColor,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide.none),
//hintText: 'Email'
//hintStyle: TextStyle(color: Colors.black38),
labelText: 'Email',
labelStyle: TextStyle(color: kPrimaryColor),
//icon: Icon(Icons.email),
icon: Icon(Icons.email_outlined),
),
);
}
i want it like that
enter image description here

Answer 1

You can use prefixIcon and suffixIcon of inputDecoration to add icons inside the field. If you want the field label only within the field and not as a label above it, specify only hintText and leave out LabelText. Check the following code, you can wrap the icons inside a Padding if you need more space.
TextFormField(
validator: (value) {
if (value!.isEmpty) {
print("test");
}
},
decoration: InputDecoration(
prefixIcon: Icon(Icons.email_outlined),
fillColor: Colors.grey,
filled: true,
focusColor: Colors.blue,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide.none),
hintText: 'Email',
suffixIcon: Icon(Icons.email_outlined),
),
)

Answer 2

your can use prefixIcon and suffixIcon which takes widget. In which you can give Icon to the prefixIcon and to the suffixIcon you can give IconButton in which you can give the logic to hide/show password. To implement the logic declare a boolean variable which is used for if the password is to be shown or hidden. the logic must be like this.
bool showPassword=false;
_FormField() {
return TextFormField(
obscureText: !showPassword,
validator: (value) {
if (value!.isEmpty) {
print("test");
}
},
decoration: InputDecoration(
suffixIcon:IconButton(icon:showPassword?Icon(Icons.lock):Icon(Icons.lock_open),
onPressed:(){
setState(() {
showPassword=!showPassword;
});
}
)
),
);
}
The code is not formatted well sorry for that I write it manual here 🙏