Dynamic Form Package
Package Overview
This package provides a dynamic form generation library in Flutter. It allows developers to define form components dynamically and handle form data efficiently. The components can be linked with each other, providing a highly customizable and extendable form management solution.
Components
The library includes various types of form components, each designed to handle different types of user input. The main components are:
TextComponent
Description: Displays static text or labels.
Fields:
componentId
: Unique identifier for the component.label
: The text to be displayed.configuration
: Additional settings such as text style, alignment, etc.
DropdownComponent
Description: A dropdown field for selecting one option from a list.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the dropdown.defaultValue
: The default selected value.options
: A list of dropdown options.validators
: Validation rules for the dropdown.configuration
: Additional settings such as dropdown appearance, hint text, etc.
CheckBoxComponent
Description: A list of checkboxes.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the checkbox group.defaultValue
: The default selected checkboxes.options
: A list of checkbox options.validators
: Validation rules for the checkbox group.configuration
: Additional settings such as layout direction, checkbox color, etc.
RadioComponent
Description: A list of radio buttons for selecting one option.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the radio button group.defaultValue
: The default selected radio button.options
: A list of radio button options.validators
: Validation rules for the radio button group.configuration
: Additional settings such as radio button color, layout direction, etc.
SliderComponent
Description: A slider for selecting a value within a range.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the slider.defaultValue
: The default value of the slider.validators
: Validation rules for the slider.configuration
: Additional settings such as min/max values, divisions, etc.
DateTimePickerComponent
Description: A component for selecting dates and times.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the date/time picker.defaultValue
: The default date/time value.dateTimePickerType
: The type of date/time picker (date, time, or dateTime).validators
: Validation rules for the date/time picker.configuration
: Additional settings such as date format, initial date, first/last date, etc.
InputFieldComponent
Description: A text input field for entering text or numbers.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the input field.defaultValue
: The default text value.textInputType
: The type of input (text, number, etc.).validators
: Validation rules for the input field.autoCorrect
: Whether auto-correct is enabled.autoFocus
: Whether the input field should autofocus.configuration
: Additional settings such as max length, decoration, obscure text, etc.
AsyncDropdownComponent
Description: A dropdown field that fetches options asynchronously from an API.
Fields:
componentId
: Unique identifier for the component.label
: The text label for the dropdown.defaultValue
: The default selected value.baseURL
: The URL for fetching options.linkedComponentsForData
: List of component IDs linked for fetching data.validators
: Validation rules for the dropdown.configuration
: Additional settings such as dropdown appearance, hint text, etc.
Usage of parentComponents
Field
The parentComponents
field is used to link components in the form. It specifies dependencies
between components, allowing for dynamic behavior based on the state of parent components.
Fields in parentComponents
componentId
: The ID of the parent component.clearDependentOnUpdate
: Whether to clear the dependent component when the parent is updated.disabledUntilParentIsValid
: Whether to disable the dependent component until the parent is valid.disabledError
: The error message to display when the component is disabled.clearDependentOnInvalidData
: Whether to clear the dependent component when the parent has invalid data.
By using the parentComponents
field, you can create complex forms with interdependent fields,
enhancing the user experience by dynamically updating the form based on user input.
For a complete example implementation, refer to the ./example/
directory in the project.
Libraries
- components/components
- flutter_dynamic_form
- parsers
- utils/component_data
- utils/component_linker
- utils/component_types
- utils/validators
- widgets/checkbox_component_widget
- widgets/component_widget_data
- widgets/date_time_picker_widget
- widgets/dropdown_component_widget
- widgets/dynamic_api_component_widget
- widgets/form_settings_listenable
- widgets/input_component_widget
- widgets/radio_component_widget
- widgets/slider_component_widget
- widgets/text_component_widget