After last time, I took a break for a while and considered my options.
To review (and to help search engines find this post in the hopes it will help someone else), the problem was that my MAUI app would launch on my iOS device (a real iPhone, not the simulator), but there were black bars on the top 15% and bottom 15% of the screen, as if it were running on a smaller phone or something.
I knew the app already worked fine on Android, so it must have been something iOS-specific. The main screen of the app is a TabBar, which is a little complicated, so I got rid of it and just used a simple view. That didn’t help.
Then I had the bright idea to make a fresh MAUI example app and see if it had the same problem. I assumed that it wouldn’t, and I could use it as a known-good template to look at for reference. Unfortunately I could not for the life of me get it to build and deploy with the paired Mac – every time I tried I get the infuriating “Verification of iOS environment is running. Please try again in a moment.” message, and restarting both laptop and Mac didn’t fix the problem. I guess it’s a problem with that project, since I rarely see that problem with my real apps, although it’s pretty weird/bad that it happens with an simple example project!
Anyway, this at least let me compare a bunch of iOS-specific stuff (project settings, Info.plist, and such) to something I assumed worked, and I tweaked a few things to match that seemed like they shouldn’t make a difference. And they didn’t!
Then I started thinking about the splash screen. As I mentioned in the last post, I had a heck of a time getting the splash screen to work right in the Android version of my MAUI apps. What I had in the pre-MAUI version was a .png splash screen which I knew might be resized or centered, but I was fine with that. The MAUI splash screen documentation says that “A .NET MAUI splash screen can use any of the standard platform image formats, including Scalable Vector Graphics (SVG) files.” So I thought “great, I don’t care about the splash screen that much, I’ll just stick the .png in the right spot, mark it as MauiSplashScreen, and call it a day!”
This did not work; the splash screen just didn’t show up. I tried a bunch of things, including converting the .png to an .svg, but no luck. So I gave up on the MAUI-based splash screen, removed them from the project, and dropped down to the Android-specific layer to put the splash screen. Frustratingly, that also didn’t work, and eventually I just gave up because I only have so much time on God’s green earth and I didn’t want to spend any more caring about a splash screen that shows up for under a second.
Aaaaanyway, I knew that I had left the splash screens in a weird state, and I had a vague idea that maybe if the splash screen was sized to only take up the middle 70% of the screen, that could cause the rest of the app to only use that space. So I removed all the other splash screen detritus and reverted back to the stock MAUI-based splash screen. Feeling hopeful, I fired up a build, deployed it, and…
Nope! Still the same behavior. I was nearing my wit’s end, so I did a clean and rebuild and deploy, and was ready to try a few minutes later, and…
Success! My splash screen theory or something like it was right. And I needed to rebuild because, umm, probably platform bugs or something 😡
But, now I know to not get cute with splash screens. (my guess is the .png to .svg converter made a weird kind of .svg that didn’t work right, or something??) And I’m reading up a little on Inkscape to make a hopefully-working .svg splash screen!