Giter Club home page Giter Club logo

form_validation_demo's Introduction

form_validation_simple

This is the source code of the demo that is shown in my talk Elegant Form Validation in Flutter.

To run the app, make sure you register for account at FavQs and get an API key. Assuming that you use VS Code to run the app, rename the launch.json.example file in .vscode/ directory to launch.json, and replace YOUR_API_KEY with a valid API key. If you are not using VS Code, start the app (flutter run) with an extra argument --dart-define fav-qs-app-token=YOUR_API_KEY. Enjoy!

This repository contains packages that are part of the materials that accompany the Real-World Flutter by Tutorials book. They reside in the packages/ folder. I would highly recommend any intermediate users of Flutter to get the book :)

What this demo shows

  • Sync/realtime validation errors (e.g. check if the field is empty, if number of characters meet a minimum length, if it matches a regular expression, etc.)
  • Validate fields that are dependent on each other (e.g. password and confirm password)
  • Async/server validation errors (e.g. check if the username is already taken, if the email is already registered)
  • Control the timing when validation happens (e.g. only show validation error if the form or field has already been interacted by the user before, or only when the form has been submitted once)
  • Clear the validation error when user has started editing the field
  • Implement custom looking fields (non-Material/Cupertino based)
  • A few UX tricks for controlling focus

form_validation_demo's People

Contributors

yshean avatar samgun-official avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.