Reputation: 119
I'm using a text and textformfield inside a container to get userName. I need to do the text field validation and get the error message and red color boundary box as shown in expected outcome image. I have included the current output also. I tried a few other ways also. But nothing worked.
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(10)),
shape: BoxShape.rectangle,
color: Color(0xFFF4F9FE),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.fromLTRB(10, 3, 0, 0),
child: Text("Full Name",
style: TextStyle(color: Color(0xFFA8C3EC)),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
child: TextFormField(
decoration: new InputDecoration(
hintText: "Enter Your Full Name",
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(10.0),
borderSide: BorderSide(color: Colors.red),
),
disabledBorder: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(vertical: 1.0),
),
validator: _validateName,
),
),
],
),
);
String _validateName(String value) {
return "Required field cannot be empty";
}
Upvotes: 1
Views: 766