Set Up Splash Screen

Complete the following steps to configure a splash screen. The splash screen serves a crucial role by executing code to create tables in the database and directing users to the authentication, profile creation, or layout based on their authentication status and profile completion status.

1. Create a file lib/services/splash_screen/splash_screen.dart
2. Add this code to the file

  import '../../theme/colors.dart';
  import 'package:flutter/material.dart';
  import 'package:flutter/services.dart';
  import '../../datastore/sqlite/sqlite.dart';

  class SplashScreen extends StatefulWidget {
    const SplashScreen({super.key});

    @override
    State<SplashScreen> createState() => _SplashScreenState();
  }

  class _SplashScreenState extends State<SplashScreen> {
    /// Init
    @override
    void initState() {
      _loadData();
      super.initState();
    }

    /// Widget
    @override
    Widget build(BuildContext context) {
      return AnnotatedRegion<SystemUiOverlayStyle>(
        value: const SystemUiOverlayStyle(
            statusBarColor: Colors.transparent,
            statusBarIconBrightness: Brightness.light),
        child: Scaffold(
          body: Container(
            decoration: const BoxDecoration(color: secondaryColor),
            child: Center(
              child: Container(
                width: 110.0,
                height: 110.0,
                padding: const EdgeInsets.all(20.0),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(14.0),
                    image: const DecorationImage(
                      image: AssetImage("assets/logos/ios.png"),
                      fit: BoxFit.contain,
                    )),
              ),
            ),
          ),
        ),
      );
    }

    /// Load
    _loadData() async {
      await SqliteDB().createTables();
      await Future.delayed(const Duration(seconds: 2));

      /// Redirect to some page here
    }
  }

3. Change home: parameter to SplashScreen() in main.dart as shown below

...
/// Widget
@override
Widget build(BuildContext context) {
  return AdaptiveTheme(
    light: buildThemeData(),
    dark: buildDarkThemeData(),
    initial: AdaptiveThemeMode.light,
    builder: (theme, darkTheme) => OverlaySupport(
      global: true,
      child: MaterialApp(
        title: _title,
        theme: theme,
        darkTheme: darkTheme,
        debugShowCheckedModeBanner: false,
        home: const SplashScreen(),
      ),
    ),
  );
}
...

4. Run App to test