Splash screen in Flutter

Save

The splash screen in Flutter is the first screen that is seen by a user when the application is launched.

Actually, this is the time when the application is organizing the resources which are needed to run the application.

Developers can customize the splash screen in various ways according to their requirements.

In this article, we will learn how we can display the splash screen.

You may also check our Flutter app development page.

Splash Screen in Flutter using Timer() function

Here is a piece of code that uses the timer() function to show the splash image til a given time interval.

So let’s discuss what’s happening here.

If you are aware of the basic Flutter code then main() function is the starting point of the application.

runApp(SplashScreenApp()) initializes the Stateless Widget SplashScreenApp.

You then return the title, theme, and home properties to MaterialApp.

MyHomePage() returns a Container that has a child as FlutterLogo(which will be shown initially when the app starts).

initState() first call super.initState() and then Timer of duration 13 seconds.

After 13 seconds, the current screen will be replaced by a new Screen i.e. OtherScreen().

Using splashscreen package

Add the dependency splashscreen to your pubspec.yaml file

Now import the package to your file as below.

In the above code, we are using the splashscreen package to display the splash image from the network.

After completing 13 seconds, it will navigate to a new screen.

Conclusion

Here is the expected result.

splash screen in flutter
. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

css.php

We've bought a Shopware Extension which is a hybrid App, which we can now offer in the Google Play Store and the IOS App Store. I'am still impressed how fast and how sharp the support team leads us through every process of the App-Store clarification. Very fast and useful response.

Markus Walter

Markus Walter

Founder, Das Apartment Living

Talk to Sales

Global

Live Chat
Start a Project


    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home