#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 —

1. period: Define the duration of the effect.
2. baseColor: This defines the main color of the child widget.
3. highlightColor: This defines the color of the lighting effect.
4. child: Define the child widget.

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

Thanks for reading..