iOS Splashscreen not showing up

Question

iOS Splashscreen not showing up

Tony Pitman 100

I am upgrading a Xamarin.Forms project to MAUI.

I have a splash.png image in the Resources\Splash folder. It is 414x720 in size.

I have the correct entries in the project file as shown on this page:

https://learn.microsoft.com/en-us/dotnet/maui/user-interface/images/splashscreen?view=net-maui-8.0&tabs=ios

I started with no BaseSize or Color tags.

When I run this on my iPhone I just get a blank white screen as the splash screen.

I tried putting in a BaseSize and Color tag. I set the Color to "#000000".

Now the splash screen just comes up with a blank black screen.

When I browse this folder:

[projectfolder]/obj/Debug/net8.0-ios/ios-arm64/resizetizer/sp/

There is a MauiSplash.storyboard, MauiInfo.plist files and Resources folder.

Inside the Resources folder is splash_XXXX...XXXX.png file where the XXXX...XXXX is a long string of alpha characters.

If I open the .storyboard file in xcode I can see that there is a view with an ImageView object on it and the drop down for the image to show is set exactly to Resources/splash_XXXX...XXXX.png

In xcode when looking at the storyboard, however, it is just blank black or white depending on whether I have the Color tag in the project file mentioned above.

How do I get the splash screen to show up?

As a side note when I run this on Android I end up with my large splash screen being a really small rectangle in the middle of a screen with the color I have chosen. I need to solve that too if possible. In the Xamarin.Forms app it used the app icon instead of the splash screen and that was ok.

Accepted answer

0 additional answers

Your answer

Answer 1

Hello,

When I run this on my iPhone I just get a blank white screen as the splash screen.I tried putting in a BaseSize and Color tag. I set the Color to "#000000".Now the splash screen just comes up with a blank black screen.

This means that your splash page has indeed launched, but the image on the page is not displayed correctly.

Inside the Resources folder is splash_XXXX...XXXX.png file

There should be a splash_XXXX...XXXX.png, ******@2.png and ******@3.png.

As described in the doc you mentioned, "By default, bitmap (non-vector) image formats are not automatically resized by .NET MAUI", you are using a .png which is non-vector image, please try using SVG file.

In addition, you could expand the Resources->Splash folder, and make sure there is only one image that has been set SplashScreen for BuildAction . (Or open .csproj file, make sure there is only one MauiSplashScreen element like <MauiSplashScreen Include="Resources\Splash\XXX" />)

If your Android splash screen issue still exists after using SVG file, it's recommended that you create new thread for it, and we can focus on that one. (Please avoid posting multiple questions in a single thread as noted in the Q&A FAQ: How to write a quality question, thanks for your understanding)

Best Regards,

Wenyan Zhang

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.

Tony Pitman 100 Reputation points

2024-04-16T15:06:28.4433333+00:00

That was the issue.

Note: I made the splashscreen a PNG because that is what it is. It isn't an SVG because it is totally a bitmap and not vector image. I assumed the system could handle scaling a PNG as easily as an SVG since it isn't a vector image to begin with.

I saved the PNG as an SVG which basically just encodes all the bytes of the bitmap inside of a SVG, which isn't very efficient.

The bottom line is that fixed the issue and that is what matters.

Thank you for clarifying this.

FYI, the documentation on that page says to use SVG files wherever possible because they scale up better than a PNG. Well, in this case since it is a PNG image it will scale the same because it isn't a vector image at all. This is why I assumed a PNG would work fine.

Most of the splash screens in our apps are rich bitmap files that do not lend themselves well to being vector graphic images. They include a lot of outdoors backgrounds and vehicle images so they are more photos than graphics.

At least now I know and thank you again for pointing this out.

Since PNG files to not work at all as the splash screen for iOS, you might want to clarify that in that page about splash screens. Say that you MUST use an SVG in the case of the splash screen or it won't work on iOS.

As far as the android question goes, I thought they were related and they are, but now I understand what is going on and may need to make an Android specific image and follow the instructions on how to do that.

Thank you so much for solving this so quickly.

Share via

iOS Splashscreen not showing up

0 additional answers

Your answer