Configure App Startup

In most apps in Flutter you might be aware of putting initialization logic in runApp in main.dart. The issue with this is if something fails, you are effectivly stuck and need to restart your application. The setup we provide will let you have full control over the loading, error and completed state of initialization of the app.

How it works

The router of MaterialApp, has a Builder property, here you can define what your app displays. By default child, will resolve to the / route which in this case is defined by the routing setup. Prior to this happening though you can conditionally return other views to display which makes this a very simple state machine to let us do initialization logic.

1
@override
2
Widget build(BuildContext context) {
3
  return ValueListenableBuilder<AppState>(
4
    valueListenable: _viewModel.appStateNotifier,
5
    builder: (context, state, _) {
6
      return MaterialApp.router(
7
        routerConfig: _routerConfig,
8
        builder: (context, child) => switch (state) {
9
            InitializingApp() => _SplashView(),
10
            AppInitialized() => child!,
11
            AppInitializationError() => _StartupErrorView(
12
              onRetry: _viewModel.retryInitialization,
13
            ),
14
          },
15
      );
16
    },
17
  );
18
}

For the logic of the initialization, this is done by setting the state to InitializingApp, do the async task and depending on that set the desired state.

1
/// startup_view_model.dart
2
class StartupViewModel {
3
  final appStateNotifier = ValueNotifier<AppState>(const InitializingApp());
4

5
  Future<void> initializeApp() async {
6
    appStateNotifier.value = const InitializingApp();
7
    try {
8
      // do initialization logic here
9

10
      appStateNotifier.value = const AppInitialized();
11
    } catch (e, st) {
12
      appStateNotifier.value = AppInitializationError(e, st);
13
    }
14
  }
15

16
  Future<void> retryInitialization() async {
17
    locator.reset();
18
    await initializeApp();
19
  }
20

21
  void dispose() {
22
    appStateNotifier.dispose();
23
  }
24
}