Question Detail
SlickForm is an Android library where you define a custom array of EditText with the purpose of handling a form.
SlickForm
Based on This awesome design from Josh Cummings. SlickForm is an Android library where you define a custom array of EditTexts with the purpose of handling a form in a cool animated way.
Table of Contents
Demo
Integration
To try this library into your build:
Step 1. Add the JitPack repository to your project build.gradle:
allprojects { repositories { ... maven { url "https://jitpack.io" } } }
Step 2. Add the dependency
dependencies { compile 'com.github.AlburIvan:SlickForm:v1.2' }
Usage
In XML:
<com.alburivan.slicksignform.SlickSignForm android:id="@+id/slick_form" android:layout_width="match_parent" android:layout_height="wrap_content" app:slick_tooltipEnabled="true" />
Extra attributes available:
<declare-styleable name="SlickSignForm"> <attr name="slick_buttonBgColor" format="color" /> <attr name="slick_buttonFgColor" format="color" /> <attr name="slick_tooltipEnabled" format="boolean" /> <attr name="slick_tooltipColor" format="color" /> </declare-styleable>
Default behavior (3 fields: email, user, & password):
SlickForm slickForm = (SlickForm) findViewById(R.id.slick_form); slickForm.withDefaultFields() .setOnProcessChangeListener(new IOnProcessChange() { @Override public boolean workInBackground(List<FormField> param) { final String message = String.format(Locale.ENGLISH, "This form is doing work in background and the values are: first field: %s - second field: %s - third field: %s", param.get(0).getInputFieldText(), param.get(1).getInputFieldText(), param.get(2).getInputFieldText() ); Log.d("TAG", message); // if all goes good, return true, if it failed return false return true; } @Override public void workFinished() { Log.d("TAG", "Done"); } }) .ready();
Thats it?
Yeah basically...
Only those fields?? Is it for signing in only??
Not really... You can extend it to your needs
- Create FormFields Objects
FormField userField = new FormField(getApplicationContext()) .withType(FieldsType.TEXT) .withHint("Username") .withLabel("Hit me"); // optional - default: Next FormField emailField = new FormField(getApplicationContext()) .withType(FieldsType.EMAIL) .withHint("Email"); FormField passField = new FormField(getApplicationContext()) .withType(FieldsType.PASSWORD) .withCustomValidation(new IOnCustomValidation() { // Add your own custom validation if neccesarry. @Override public boolean withCustomValidation(FormField field) { String password = field.getInputFieldText(); boolean hasUppercase = !password.equals(password.toLowerCase()); boolean hasLowercase = !password.equals(password.toUpperCase()); boolean isAtLeast8 = password.length() >= 8; // return true if validation is successful, otherwise false return (hasUppercase && hasLowercase) && isAtLeast8; } }) .withHint("Password");
- Add them your SlickForm Object
SlickForm slickForm = (SlickForm) findViewById(R.id.slick_form); slickForm .withField(userField) .withField(emailField) .withField(passField) // chain any number of fields in the order of appearance .setOnProcessChangeListener(new IOnProcessChange() { @Override public boolean workInBackground(List<FormField> param) { final String message = String.format(Locale.ENGLISH, "This form is doing work in background and the values are: first field: %s - second field: %s - third field: %s", param.get(0).getInputFieldText(), param.get(1).getInputFieldText(), param.get(2).getInputFieldText() ); Log.d("TAG", message); // if all goes good, return true, if it failed return false return true; } @Override public void workFinished() { Log.d("TAG", "Done"); } }) .withProcessingLabel("Sending") .ready();
Extras
FormField available methods
Method | Description | Usage |
---|---|---|
withType | Add this form field's type so it can get validated correctly | FieldType |
withHint | Add this form field's hint to let the user know what needs to be filled in. | String |
withIcon | Add this form field's icon for avisual cue of what needs to be filled in. | Drawable/SVG |
withLabel | Customize this form field's button label. Current default is "Next" | String |
withProcessingLabel | Changes the form's is label when its doing background work | String |
withCustomValidation | Assign this FormField an unique validation | IOnCustomValidation |
Something More