MAUI Splash Screen footer

Question

I have a cross platform MAUI app. I would like the splash screen to look like this:

I can't seem to figure out how to get it to work with the built in cross platform splash image. I tried different sizes and scaling and it just ends up looking like a very small version of the above in the center of the screen.

Is there a way to have a "footer" at the bottom of the splash like that?

I really want to utilize the built in ability for MAUI to scale the image as needed for different platforms / sizes.

Update: Per Yonglun's request: I am using the latest MAUI versions and templates. My target platform is iOS and Android. I have the Android SDK Target set to 33, but minimum OS to 28. iOS is default settings.

Answer 1

This is one of the "advanced splash screen scenarios" that the Maui Splash Screen doesn't cover, so you'll need to use per-platform techniques to achieve it.

From Add a splash screen to a .NET MAUI app project:

For more advanced splash screen scenarios, per-platform approaches apply.

There is an open proposal to expand the cross-platform functionality to cover more advanced scenarios at Support background image on splashscreen iOS #12639 and a doc item to explain in more detail how to achieve this at: Custom splash screens for per-platform scenarios #1222

Please be aware that including a branding logo at the bottom is recommended against by both the Android and Apple design guidelines, though you can technically do so on both platforms. I don't know if Google or Apple enforce this in their stores.

On Android see [Set a theme for the splash screen to change its appearance](https://developer.android.com/develop/ui/views/launch/splash-screen#set-theme

You can use windowSplashScreenBrandingImage to set an image to be shown at the bottom of the splash screen. However, the design guidelines recommend against using a branding image. <item name="android:windowSplashScreenBrandingImage">@drawable/...</item>

On iOS you can include it in your storyboard. See Specifying your app’s launch screen in the Apple docs and Add a splash screen to a .NET MAUI app project on per-platform approaches #12917 in the Maui repo.

Apple also recommends against logos on the launch screen: Apple Design Patterns - Launching

Don’t advertise. The launch screen isn’t a branding opportunity. Avoid creating a screen that looks like a splash screen or an “About” window, and don’t include logos or other branding elements unless they’re a fixed part of your app’s first screen. If your game or other immersive app displays a solid color before transitioning to the first screen, create a launch screen that displays only that solid color.

Answer 2

Hello,

For Android, according to the elements of SplashScreen provided in the Android documentation, there is no API for Footer's location. Please refer to Splash screens - Elements and mechanics of the splash screen for more details.

For iOS, as described in the official MAUI documentation below, it is also not feasible to change the default style to add Footer to Splash Screen.

On iOS, the splash screen is added to the app package as a storyboard named MauiSplash.storyboard, which is set as value of the UILaunchStoryboardName key in the app package's Info.plist: Therefore, you shouldn't set the UILaunchStoryboardName key in your Info.plist file and you shouldn't add a LaunchScreen.storyboard to your app. Quoted from Add a splash screen to a .NET MAUI app project.

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.