Flutter Super State: Simple State Management for Flutter

flutter_super_state is a new state management library for Flutter which:

• Is simple to use. Simply create modules
• Supports async actions easily
• Can easily be integrated with Flutter

Today we will take a look at creating a simple application with a mock authentication and a counter.

Concepts

Super State has 2 main objects:

• Store: Which holds all of your modules
• StoreModule: Which you can extend to implement modules

Let’s take a look at a simple module:

A store is easy to setup, here’s an example:

You can then call get modules from the store and call actions:

For Flutter integration, the package provides for following widgets:

• StoreProvider: Provides the store to all children in sub-tree
• ModuleBuilder: Access a module inside the Flutter widget tree (is updated when module calls setState)
• StoreBuilder: Access the store inside the Flutter widget tree (is updated when any module calls setState)

Example

Let’s start by creating a new project using flutter create super_state_example and adding the package to pubspec.yaml:

dependencies:
  flutter_super_state: # Optionally put latest version from pub.dev

Next, let’s clear your main.dart, and place our CounterModule from above inside lib/src/store/counter.dart. Let’s create our second module, AuthModule (inside lib/src/store/auth.dart):

We should have our modules complete! Next, let’s setup 2 screens (LoginScreen and CounterScreen):

Next, let’s setup our main:

And we are done! Let’s check it out:

You can view the whole project here.

Thanks for reading, don’t forget to check out the package!