flutter_form_wizard/README.md

69 lines
6.4 KiB
Markdown
Raw Permalink Normal View History

[![pub package](https://img.shields.io/pub/v/flutter_date_time_picker.svg)](https://github.com/Iconica-Development) [![Build status](https://img.shields.io/github/workflow/status/Iconica-Development/flutter_form/CI)](https://github.com/Iconica-Development/flutter_form/actions/new) [![style: effective dart](https://img.shields.io/badge/style-effective_dart-40c4ff.svg)](https://github.com/tenhobi/effective_dart)
# Flutter Form
2022-09-19 09:52:00 +02:00
2022-11-29 09:43:55 +01:00
Flutter Form Wizard is a package you can use to create a multi page form with premade or custom inputfields.
2022-09-19 09:52:00 +02:00
![Form GIF](flutter_form.gif)
2023-12-17 12:01:18 +01:00
Figma Design that defines this component (only accessible for Iconica developers): https://www.figma.com/file/4WkjwynOz5wFeFBRqTHPeP/Iconica-Design-System?type=design&node-id=357%3A3348&mode=design&t=XulkAJNPQ32ARxWh-1
Figma clickable prototype that demonstrates this component (only accessible for Iconica developers): https://www.figma.com/proto/4WkjwynOz5wFeFBRqTHPeP/Iconica-Design-System?type=design&node-id=340-611&viewport=-201%2C47%2C0.11&t=XulkAJNPQ32ARxWh-0&scaling=min-zoom&starting-point-node-id=516%3A2399&show-proto-sidebar=1
2022-09-28 11:51:28 +02:00
## Features
2022-09-19 09:52:00 +02:00
2022-11-29 09:43:55 +01:00
- Multi page form with the ability to define the navigational buttons.
2022-09-28 11:58:59 +02:00
- A handfull premade fields with their own controllers.
- Full posibilty to create custom inputfields and controllers which can be used along side the premade fields and controllers.
- A checkpage where the end user can check his answers and jump back to the page of an inputfield to change his answer without going through the whole form.
- The look of the checkpage answers can be set own desire.
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
## Setup
2022-11-29 09:43:55 +01:00
To use this package, add `flutter_form_wizard` as a dependency in your pubspec.yaml file.
2022-09-28 11:51:28 +02:00
## How To Use
2022-09-28 12:02:40 +02:00
WARNING Make sure to define your FlutterFormInputControllers above your Flutter Form and not inside each page. This prevents that the used controllers differ from the registered ones.
2022-09-28 11:51:28 +02:00
Flutter Form has two paramaters: options and formController. Each of these parameters' own parameters will be explained in tabels below.
Options:
| Parameter | Explaination |
| --------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| checkPage | If this is set the form will feature a checkpage at the end so the end user can verify and alter his answers. |
| nextButton | The button which is put in the stack of the Form. An onTap has to be implemented and should call to the FormController. Standard call is autoNextStep(). |
| backButton | Same as the nextButton. A widget that is put in the stack of the Form. An onTap has to be implemented and should call to the FormController. Standard call is previousStep(). |
| onFinised | The callback that will be called when the last page is finished. If checkPage is enabled this will call after the checkPage is passed. |
| onNext | The callback that is called when the user finishes a page. PageNumber is also provided. |
| scrollDirection | The abilty to set the scroll direction of the forms .pageview |
| scrollPhysics | The ability to set the scroll physics of scroll views in each form page. |
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
FormController:
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
| Parameter | Explaination |
| ---------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
| getFormPageControllers() | The getter to get all FormPageControllers. This should not be needed/called. |
| setFormPageControllers() | The setter for the FormPageControllers. This shoudl not be needed/called. |
| disableCheckPages() | This should be called when the user goes back to a page where the user alters an answer that alters the rest of the form. |
| autoNextStep() | This should be called under the nextButton of the FormOptions if no special actions are required. |
| previousStep() | This should be called under the backButton of the FormOptions. |
| jumpToPage() | A way to jump to a different page if desired. |
| validateAndSaveCurretnStep() | Calling the validate, and possibly save, for the current step. Returns the result of the validate. |
| getCurrentStepResults() | Get the result of the current step. Mostly called after validateAndSaveCurrentStep return true. |
| nextStep() | Called to go to the next step. This is does not do anything else like autoNextStep does do. |
| finishForm() | Calls the onFinished of the form options. |
2022-09-19 09:52:00 +02:00
See the [Example Code](example/lib/form_example.dart) for an example on how to use this package.
2022-09-28 11:51:28 +02:00
## Issues
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
Please file any issues, bugs or feature request as an issue on our [GitHub](https://github.com/Iconica-Development/flutter_form/pulls) page. Commercial support is available if you need help with integration with your app or services. You can contact us at [support@iconica.nl](mailto:support@iconica.nl).
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
## Want to contribute
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
If you would like to contribute to the plugin (e.g. by improving the documentation, solving a bug or adding a cool new feature), please carefully review our [contribution guide](../CONTRIBUTING.md) and send us your [pull request](URL TO PULL REQUEST TAB IN REPO).
2022-09-19 09:52:00 +02:00
2022-09-28 11:51:28 +02:00
## Author
2022-09-19 09:52:00 +02:00
2022-11-29 09:43:55 +01:00
`flutter_form_wizard` for Flutter is developed by [Iconica](https://iconica.nl). You can contact us at <support@iconica.nl>