Integrate a form in a mobile application can quickly become a cumbersome task for a developer, and a very annoying experience for the user. But with some great ressources, this “form” hassle should be an enjoyable time to spend.
The Android third-party librairies community is incredibly developed and productive, you have to take profit of it, and of course contribute when you can ;). So let’s talk about awesome librairies that will make a big part of the work for you.
Android Saripaar (link)
Android Saripaar is a UI form validation library using annotations to let you declare validation rules on each of your Views. It prevents you from writing a bunch of code and pollute your classes with tens of code lines about fields validation. Using this library is easily the best way to take care of your fields AND the clarity of your code.
Here is a small example :
|
1 2 3 4 5 |
@NotEmpty(messageResId = R.string.form_error_required_field) EditText mTitleView; @Length(min = 1, max = 6, messageResId = R.string.form_error_field_length) EditText mInfosView; |
As you can see, I use the @NotEmpty annotation on my title view to declare it as mandatory. I can specify a dedicated message if the EditText is not filled by the user, and this is as sample as that. All the validation logic is isolated in a rule class associated to this @NotEmpty annotation.
The process is the same for the second field of the example : with the @Length annotation, I use the Length rule and specify another error message, with, this time, additional parameters min and max.
The library already contains a bunch of ready-to-use validation rules, visible here, with their associated annotations right here too. You can already do a lot of things with this included annotations, but you have to know that you can create your own annotations ! This is what is making this library especially powerful ; you will be able to apply any rule you want to check the data your user is provided. To learn how to create your own validation rules, be sure to check this wiki : https://github.com/ragunathjawahar/android-saripaar/wiki/Android-Saripaar-Basics#rule.
After setting annotations for each field, you will also need a Validator and a ValidationListener to execute your validation rules. First, let’s instantiate the Validator :
|
1 2 3 4 5 6 7 8 |
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // Various onCreate code ... mValidator = new Validator(this); mValidator.setValidationListener(this); } |
After initializing the Validator in the onCreate() method of your Activity or Fragment, you have to implement the listener methods :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
@Override public void onValidationSucceeded() { // Code to execute once all your fields have been validated. // Show a Snackbar, display an other screen, do a network call, etc } @Override public void onValidationFailed(List<ValidationError> errors) { // Display a message for each validation error for (ValidationError error : errors) { View view = error.getView(); String message = error.getCollatedErrorMessage(this); // Manage how you display your errors depending on the view type if (view instanceof EditText) { ((EditText) view).setError(message); } else { Toast.makeText(this, message, Toast.LENGTH_LONG).show(); } } } |
As you can see in this code above, you have a full control of how you display error messages that you defined for each view. Depending on how the view can handle the message, you can display it within the view or with a more global way like a Snackbar. The important thing is to display to the user where the data is wrong and how it can be fixed.
And finally, with a Validator.validate() call on, for example, the submit button of the form, you will execute all rules. There are different options to execute them :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
// Classic way to validate mValidator.validate(); // Validate all Views before the specified parameter View mValidator.validateBefore(mUserAgeView); // Validate all Views till the specified parameter View mValidator.validateTill(mUserHeightView); // You can also add a boolean parameter to each of this methods to specify // if you want the rules execution to be synchronous or asynchronous. // Example with the classic method mValidator.validate(true); |
Rules can be executed synchronously or asynchronously ; this means that you could access your database or even do a network request during your validation. It can be very practical to check a username availability with a dedicated webservice, or to compare the written text with a cached data.
Android Saripaar is a very complete form validation library, which is also quite simple to use thanks to Java annotations and a concise API. This presentation covers the main part of what you can do with the library, and I invite you to use it and see how far you can go with it.
To conclude, I heavily recommend you to test this library, whatever your form is little like a “create account” page (thanks to @Password and @ConfirmPassword rules) or long and full of custom checks to do.
MaterialEditText (link)
MaterialEditText is also a great library that you should use in any forms. It does all the work EditText and TextInputLayout do (floating label, error message), plus some interesting details, and globally in a more customizable way in terms of colors and fonts.
MaterialEditText simple example
It totally embraces the Google Material Design guidelines about text fields and add the possibility to visually indicate the amount of min/max characters, display helper texts in addition to error texts, customize colors of the floating label, the text itself, the field bar, etc. Don’t hesitate to check the complete wiki of MaterialEditText.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<com.rengwuxian.materialedittext.MaterialEditText android:id="@+id/project_title" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/field_hint_text" android:inputType="text" app:met_baseColor="@color/primary_text" app:met_clearButton="true" app:met_floatingLabel="highlight" app:met_primaryColor="@color/colorPrimary" app:met_textColor="@color/primary_text" app:met_textColorHint="@color/secondary_text" app:met_underlineColor="@color/primary_text"/> |
MaterialEditText also offers a way to apply data validation. To be honest, I didn’t even test it because I think that it is better to separate the UI component and the validation logic. If you choose to use the MaterialEditText validation system, the day you will have to change the UI component for text fields (for various reasons), you will also have to re-implement your validation rules again. Furthermore, Android Saripaar offers a more complete and flexible solution, without the need of any custom views.
This two libraries are very complementary, and once they are combined, they assure you to give a lot to your users with little effort.
Do you know other Android librairies useful for forms ? What is your opinion about these ? Don’t hesitate to give it a try and to share your experience about this subject !