EasyForm class

A container for grouping together multiple form field widgets (e.g. TextField widgets) and handling all of the form field values in a single callback.

Each individual form field should be wrapped in a EasyFormField widget, with the EasyForm widget as a common ancestor of all of those. For text fields, it's convenient to use the EasyTextFormField widget, which encapsulates the TextField widget inside itself.

To save and reset form fields, place the EasyFormSaveButton and EasyFormResetButton buttons in the underlying widget tree, or сall methods on EasyFormState to save, reset, or validate each EasyFormField that is a descendant of this EasyForm. To obtain the EasyFormState, you may use EasyForm.of with a context whose ancestor is the EasyForm, pass a GlobalKey to the EasyForm constructor and call GlobalKey.currentState or use the EasyFormButton widget, which has builder callback, accepting EasyFormState.

When the form is saved, all field values ​​are passed to the onSave callback as a Map<String, dynamic>, where you can save these values ​​to the database, pass them to the API, etc. The onSave callback is asynchronous and can return the modified values ​​of the form fields. After the onSave callback completes, the onSaved callback will be called with the values ​​returned from onSave.

This example shows a EasyForm with two EasyTextFormField to enter an username, password and an EasyFormSaveButton to submit the form. The values ​​of the form fields are passed to the hypothetical API client, the result of the API request is passed to onSaved. While waiting for the API client to finish, the EasyFormSaveButton displays a CircularProgressIndicator.

@override
Widget build(BuildContext context) {
  return EasyForm(
    onSave: (values, form) async {
      return API.login(values['username'], values['password']);
    },
    onSaved: (response, values, form) {
      if (response.hasError) {
        // ... display error
      } else {
        // ... navigate to another screen
      }
    },
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        EasyTextFormField(
          name: 'username',
          decoration: const InputDecoration(
            hintText: 'Enter your username',
          ),
          validator: (value) {
            if (value.isEmpty) {
              return 'Please enter some text';
            }
            return null;
          },
        ),
        const SizedBox(height: 16.0),
        EasyTextFormField(
          name: 'password',
          decoration: const InputDecoration(
            hintText: 'Enter your password',
          ),
          validator: (value) {
            if (value.isEmpty) {
              return 'Please enter some text';
            }
            return null;
          },
        ),
        Padding(
          padding: const EdgeInsets.symmetric(vertical: 24.0),
          child: EasyFormSaveButton.text('Sign In'),
        ),
      ],
    ),
  );
}

See also:

Inheritance
Implementers

Constructors

EasyForm({Key? key, required Widget child, EasyFormAdaptivity adaptivity = defaultAdaptivity, WillPopCallback? onWillPop, EasyFormChangeCallback? onChanged, EasyFormFieldSaveCallback? onSave, EasyFormFieldSavedCallback? onSaved, EasyAutovalidateMode autovalidateMode = defaultAutovalidateMode, Map<String, String?>? errors, Duration scrollToFieldDuration = defaultScrollToFieldDuration, Curve scrollToFieldCurve = defaultScrollToFieldCurve})
Creates a container for form fields.
const

Properties

adaptivity → EasyFormAdaptivity
The mode of adaptability of form elements, in which design system the form elements will be displayed: Material, Apple, or will be automatically determined based on the platform.
final
autovalidateMode → EasyAutovalidateMode
Used to enable/disable form fields auto validation and update their error text.
final
child → Widget
The widget below this widget in the tree.
final
errors → Map<String, String?>?
Sets errors in fields as a Map, where key is the name of the field and value is the text of the error message.
final
hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
onChanged → EasyFormChangeCallback?
Called when one of the form fields changes.
final
onSave → EasyFormFieldSaveCallback?
Called when the form is being saved using the save method or the EasyFormSaveButton button.
final
onSaved → EasyFormFieldSavedCallback?
Called after the onSave callback completes, the result from onSave is passed to onSaved as a parameter.
final
onWillPop → WillPopCallback?
Enables the form to veto attempts by the user to dismiss the ModalRoute that contains the form.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
scrollToFieldCurve → Curve
Scroll curve to field with error.
final
scrollToFieldDuration → Duration
Duration of scrolling to the error field.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → EasyFormState
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited

Static Methods

of(BuildContext context) → EasyFormState?
Returns the closest EasyFormState which encloses the given context.