Steppers and Form in Flutter
Steppers and Form in Flutter
All in one Flutter Resource: https://flatteredwithflutter.com/steppers-and-form-in-flutter/
Let’s Start….
Running short of ideas, so started exploring here and there about what can I program next…..Until I saw two three articles regarding the Forms in Flutter.
But, what would I do to stand-out….Hmmmm
I was always fascinated by the steppers functionality since Android itself, but never had a chance to program it. So, here I thought, why not integrate steppers with the form fields (e.g entering details of user)……
This post includes a form with fields such as ( Name, Phone, Email). All these fields are placed in a stepper widget.
Every step has 2 buttons : Continue and Cancel.
Clicking continue, leads to next step while clicking cancel goes to previous step.
On every form field a validator is present
There are 3 main functions in steppers :
- onStepContinue
- onStepCancel
- onStepTapped
If the validation is correct (checked on each and every step), then we go to next step….
Finally, if every validation is correct, then you see an alert dialog with the details entered as :
If something is found wrong on any step, a snackbar is shown…Else, formState.save() is called and as stated above alert dialog is shown.
Bonus, you might want to explore Validate package of flutter, which has in-built functionalities for validating various fields (e.g email, phone numbers)….
Articles related to Flutter:
For complete source code, visit
https://github.com/AseemWangoo/flutter_programs/blob/master/StepperWithForm.dart
P.S………..
The Flutter Pub is a medium publication to bring you the latest and amazing resources such as articles, videos, codes, podcasts etc. about this great technology to teach you how to build beautiful apps with it. You can find us on Facebook, Twitter, and Medium or learn more about us here. We’d love to connect! And if you are a writer interested in writing for us, then you can do so through these guidelines.
