← ClaudeAtlas

flutter-building-formslisted

Builds Flutter forms with validation and user input handling. Use when creating login screens, data entry forms, or any multi-field user input.
openplaybooks-dev/converge · ★ 3 · AI & Automation · score 71
Install: claude install-skill openplaybooks-dev/converge
# Building Validated Forms ## Contents - [Form Architecture](#form-architecture) - [Field Validation](#field-validation) - [Workflow: Implementing a Validated Form](#workflow-implementing-a-validated-form) - [Examples](#examples) ## Form Architecture Implement forms using a `Form` widget to group and validate multiple input fields together. - **Use a StatefulWidget:** Always host your `Form` inside a `StatefulWidget`. - **Persist the GlobalKey:** Instantiate a `GlobalKey<FormState>` exactly once as a final variable within the `State` class. Do not generate a new `GlobalKey` inside the `build` method. - **Bind the Key:** Pass the `GlobalKey<FormState>` to the `key` property of the `Form` widget. - **Alternative Access:** Use `Form.of(context)` to access the `FormState` from a descendant widget. ## Field Validation Use `TextFormField` for Material Design text inputs with built-in validation. - **Implement the Validator:** Provide a `validator()` callback to each `TextFormField`. - **Return Error Messages:** If invalid, return a `String` with the error message. - **Return Null for Success:** If valid, return `null`. ## Workflow: Implementing a Validated Form - [ ] Create a `StatefulWidget` and its `State` class. - [ ] Instantiate `final _formKey = GlobalKey<FormState>();` in the `State` class. - [ ] Return a `Form` widget in `build` and assign `key: _formKey`. - [ ] Add `TextFormField` widgets as descendants of the `Form`. - [ ] Write a `validator` function for each fie