From this article, I’m going to describe the correct way of adding a splash screen for a Flutter android app. There are multiple ways to set up a splash screen in Flutter applications but the correct way to do this, set up a splash screen with native codes. The splash screens allow time for the app engine to load and initialize the app. This article contains a method to set up a splash screen on the Android side of a Flutter app.
Adding splash icon image to the project
- First of all, we need to generate a splash icon image with different pixel densities(
xxxhdpi). To convert the splash icon images in different densities flow the online converter link;
you have to have a high-resolution image for this.
- After converting the splash icon rename all the image files in the same name. (ex -:
- Then navigate to the following folder path inside the project
android > app > src > main > res
- Copy the converted splash icon images to the respective density mipmap folders
mdpidensity image to
Change the launch_backgeound.xml file
- Change the
launch_background.xmlfiles inside drawable folders(my project consist of drawable and drawable-v21 folders).
- Uncomment 7–11 lines and replace launch_image name with your splash icon name
after uncommenting, the code looks like following;
3. Run the application to see the newly added splash screen
Change the background colour of the splash screen
colors.xmlfile inside the values folder. (path:
andoird > app > scr > main > res > values)
- Edit the file adding the custom colour you want
3. Replace the 4th line of
launch_background.xml file by importing the custom colour
after importing custom colour, the code looks like following;
4. Rebuild the project to see the new splash screen with the custom background colour
These are the steps to add a splash to the Flutter android app. If you know XML well, you can edit the
launch_background.xml files inside drawable folders to create amazing splash screens.
Access the full source code using the link below;
A new Flutter application. This project is a starting point for a Flutter application. A few resources to get you…
Thanks for reading. 😊