#5. Splash Screen in Flutter with Shimmer Effect (Flutter Series by Akshit Madan)

Hey there , Welcome to part 5 of Flutter Series. In this blog we are going to see how you can apply a beautiful splash screen to your app with a shimmer effect. Shimmer effect is basically an animation effect on your widget, that widget can be your app logo or any text. This effect gives your app a good look and makes them interactive.

In your pubspec.yaml add shimmer package to install the extension. Install from here — (https://pub.dev/packages/shimmer)

main.dart

Basic Initialisation of the app with ThemeData and provide SplashScreen() class in your home of your MaterialApp().

splash_screen.dart

Design — This totally depends on you how you want to design your splash screen . I have set an image as my background and lowered its opacity . In the center I have kept my logo and applied shimmer effect on it.

Code —

Splash Screen time is 2500 miliseconds, you can change according to you. The text is wrapped with Shimmer which takes 4 parameters —

After 2.5 seconds , the splash will be navigated to HomeScreen()

Thanks for reading..

--

--

Flutter Developer | ML | AR

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store