Add splash screen

Flutter doesn't have a Splash screen by default. There is a Splash screen in the native code for Android and iOS but it has a white background. We will now change the background to the company logo or any image you want to display at the start of the app.

Let us useĀ the flutter_native_splashĀ package to change the Splash screen.

Prerequisites for images:

  • PNG bitmap format
  • About 200x200 pixels in size
  • In the sRGB color profile
  • Without interlacing
  • Select anti-aliasing, scaling according to the input data or image content
  • Leave the PPI equal to 72, the image will be rescaled, based on the PPI (DPI in the case of Android) of device
  • There is full support for 32-bit colour depth (i.e. with transparency)

Now put these images in the asset folder. Add this to theĀ pubspec.yamlĀ file:

dev_dependencies:
flutter_test:
sdk: flutter
flutter_native_splash: ^0.1.9
flutter_native_splash:
image: assets/images/logo.png
color: "5E92F3"
android_disable_fullscreen: true

In the image parameter, insert the path of the image you want to display on your Splash screen. Set the colour parameter to the background colour you want for the Splash screen. Lastly, disable full screen. If you are cloning or downloading the app, everything is already in place. All we have to do now is change the aforementioned parameters.

RunĀ flutter pub getĀ and then runĀ flutter pub pub run flutter_native_splash:create