Form Validation in Flutter for Beginners

Komal Thakkar
2 min readJan 30, 2021

The simple form is very easy to build if it is login or regitration, but what about the validations? Is it that easy to integrate for beginners? Yes, if you validate the form when the user clicks on the button and you validate all the fields if it is blank.It seems time consuming, while the user has to fill in all the details and at the end he/she gets to know that this info won’t work. It becomes really painful!

It would be more convenient to make them know something at the same time while the user types. And for the developer without using any third party plugin. How gratifying it would be, Isn’t it?

So, today we will learn how to build a form with validations while users fill the form by striking them whether the info is correct or not.

Let’s start to design the UI of our application.

Registration form will have four text fields

  • Name
  • Email
  • Password
  • Confirm Password

We will validate using the onChange property of TextFormField. onChange is called when the user initiates a change to the TextFormField’s value. Now we will create a method to check if the entered name’s length is greater than 3 or not and it will return true OR false, and an error message.

Using InputDecoration we will show the error message, a red border on all sides.

Now we have to set that message to errorText according to condition.

errorText:_hasNameInputError ? nameValidation : null

For full source code check.

Thank you for reading. I hope this article helped you 😊, If it did then do clap 👏 the post to show your support and motivate me to write more.

Happy Codding :)

--

--