In this tutorial, we'll walk you through how to configure a custom splash screen for the Houzi Flutter project app. Learn the difference between pre-Android 12 and post-Android 12 splash screens and how to set up splash screens both manually and using the flutter_native_splash package.
Whether you're targeting Android or iOS, this guide will help you set up your own branded splash screen with ease. Follow along for step-by-step instructions for both methods and ensure your app's first impression is flawless!
00:00 - Introduction
00:10 - What is a Splash Screen?
00:34 - Pre-Android 12 and Post-Android 12 Splash Screens
01:21 - Ways to Configure Splash Screen
01:46 - Manual Way - Explore files to edit
03:32 - Configure Splash Screen Android
04:25 - Setting Splash Screen in iOS
07:05 - Automatic Way - Explore options
07:26 - Adding flutter_native_splash
08:23 - Design splash icon in Figma
09:07 - Configure flutter_native_splash options
09:21 - Run flutter_native_splash command
10:20 - Android 12+ flutter_native_splash configs
11:07 - Branding Image
11:15 - Design branding image in Figma
11:35 - flutter_native_splash for branding image
13:04 - Take advantage of svg drawable for splash
13:56 - Read more about flutter_native_splash
14:15 - Final Thoughts and Recap
Hashed Tags:
#Flutter #SplashScreen #HouziApp #AndroidSplashScreen #iOSSplashScreen #AppDevelopment #Android12 #flutter_native_splash #MobileDevelopment #Houzez #realestateapp
