Flutter Splash Screen

Question

How do I show a splash Screen in flutter? So there is an option for launch icon. I added images for ios and android in their respective folders. My problem is it is too fast. So it directly opens MyApp(). I want my app to not show anything and let splash take control until I figure out which screen to take the user to (In MyApp I want to do intialization)

please do check this answer as well https://stackoverflow.com/a/48101776/2863386 — Shyju M, Apr 06 '18 at 12:30

score 6 · Accepted Answer · answered Apr 05 '18 at 09:52

6

You can use Future.delayed constructor in your initState. This will keep your SplashScreen for the duration you specify before the navigation happen.

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => new _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  @override
  void initState (){
    super.initState();
    // TODO initial state stuff
    new Future.delayed(const Duration(seconds: 4));
  }
  @override
  Widget build(BuildContext context) {
    //build
  }
}

answered Apr 05 '18 at 09:52

Shady Aziza

50,824
20
115
113

I generally combine this with a `Future.wait` to wait the loading of necessary assets – Rémi Rousselet Apr 05 '18 at 10:06
I just tried this and it doesn't work, the splash ends as soon as `runApp` is called, and afaik `Future.delayed` is equivalent to `Timer`. – arielnmz Jun 19 '18 at 20:11
It really depends on how did you wiring up your widgets – Shady Aziza Jun 20 '18 at 13:43
@VikasPandey, where you put, navigation method in this code – Farhana Naaz Ansari Feb 05 '19 at 11:07

score 5 · Answer 2 · answered Oct 12 '18 at 06:05

Small update to aziza answer

import 'dart:async';    
import 'package:flutter/material.dart';    
import 'src/login_screen.dart';

void main() {
  runApp(new MaterialApp(
    home: new MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
    new Future.delayed(
        const Duration(seconds: 3),
        () => Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => LoginScreen()),
            ));
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.white,
      body: Container(
        child: new Column(children: <Widget>[
          Divider(
            height: 240.0,
            color: Colors.white,
          ),
          new Image.asset(
            'assets/logo.png',
            fit: BoxFit.cover,
            repeat: ImageRepeat.noRepeat,
            width: 170.0,
          ),
          Divider(
            height: 105.2,
            color: Colors.white,
          ),
        ]),
      ),
    );
  }
}

Hope this will also helps others :)

how to handle if I need to get the loggedin status from sharedpreference and goes home if true and goes login if false? — Nabin Dhakal, Jan 08 '20 at 10:13
@Nbn, try this answer https://stackoverflow.com/a/60101934/6686446 — Kavinda Jayakody, Feb 06 '20 at 19:07

Flutter Splash Screen

2 Answers2

Linked