Using Global Keys to get State and Validate Input in Dart's Flutter...

What Will I Learn?

You will learn how to create Global Keys and use them as unique identifies in Flutter
You will learn how to access the state of a block of Widgets from outside of the Widgets
You will learn how to validate and save the state of widgets inside of a Form Widget

Requirements

IDEA intellij or Visual Studio Code with the Dart/Flutter Plugins
The Dart SDK and the Flutter SDK
A fair understanding of Mobile development and Imperative or Object Oriented Programming

Difficulty

Intermediate

Description

In this tutorial, we build out a simple Form Application using Flutter. In this form application, we have three different input boxes, one for an username, one for an email and one for a password. We preform rudimentary validation checks on each of these input boxes and when those validation conditions are met, the user interface changes to show that the user has logged in. Rather then using a database, we make use of global variables to pass around the state of the forms.

We use the GlobalKey Class to access and manipulate the state of our Form and the outer Scaffold Widget. These GlobalKeys allow us to access the unique identifiers that are assigned to our widgets in the Flutter Widget Tree. By gaining access to these Identifiers, we can then change the state and the User interface of these widgets from the outside which allows us to further react to the changes in state that happen in our applications. The GlobalKeys also give us access to the child widgets of these specific widgets in an indirect manner. This way we can proliferate the changes from the top downwards as the state changes.

The source code for this project can be found here

Video Tutorial

Curriculum

Posted on Utopian.io - Rewarding Open Source Contributors

Using Global Keys to get State and Validate Input in Dart's Flutter Framework