In this article we'll learn how to add a custom Launch Image in Flutter, by default when you run you're Flutter project in iOS simulator or phone you'll notice that it first start's a blank white screen and continues to you're project Splash Screen.
Here's an outcome of this article
Let's work on that.
If you have you're app logo you can generate a splash screen Image from this website.
When you upload you're logo image, website will provide a pop where you can adjust logo position and background color, after finishing adjustment click generate asset button.
For this article we'll focus on Phones screen and not iPad. When assets are generated we'll scroll down until we see phone's splash screen.
You can click any portrait splash screen and download it.
Now let's switch to Xcode.
Open you're Flutter project in Xcode and let's through the following process.
First expand Runner
by clicking the expand Icon on the left side of the Runner
After expand Runner
You'll see another Runner
folder just below Flutter
folder and expand it again.
After expanding the Runner, you'll see a Folder named Assets
click it, and it will give you two options
- AppIcons - for you're app Icon
- LaunchImage - for you're app launch image
Click LaunchImage option and you'll see three options for uploading image but current they're blank.
Double click each option and select the downloaded splashScreen
And boom we're done, you can now run you're app and you'll see it start's with a custom launch image and not a blank white screen again.
Top comments (0)