Splash screen - Flutter

A splash screen is an introductory screen that users see when they launch your application. It is a chance to showcase your brand identity and keep users occupied while your app loads in the background. This screen can either be an image, graphic, logo, or animation sometimes coupled with a progress bar.

In this Blog, we will see how to create a simple and easy Splash screen that showcases your App Name.



import 'package:flutter/material.dart';
import 'package:my_new_project/Responsive/responsive_layout.dart';
import 'package:my_new_project/ui/desktop/walk_through_desktop.dart';
import 'package:my_new_project/ui/mobile/walk_through_mobile.dart';

class SplashScreen extends StatefulWidget {
  const SplashScreen({super.key});
  static const routeName = '/splash-screen';

  State<SplashScreen> createState() => _SplashScreenState();

class _SplashScreenState extends State<SplashScreen> {
  void initState() {

  Future<void> init() async {
    await Future.delayed(const Duration(seconds: 3));
    // ignore: use_build_context_synchronously
            builder: (context) => ResponsiveLayout(
                  mobileBody: const WalkThroughScreenMobile(),
                  desktopBody: const WalkThroughScreenDesktop(),

  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Image.asset(
          fit: BoxFit.cover,
          height: 200,
          width: 200,


Post a Comment

Popular posts from this blog

Error Handling in Flutter - Gradle issue

How to Make a Dynamic and Trending ListView with Flutter Widgets?

Understanding API integration with Getx State management