Hide "Loading..." behind the splash screen or any other solution

[Laftek]

Description

I am not sure if I am doing something wrong but it does not make sense to me that Loading... screen is displaying after app launch. Its not webassembly so it cannot just be hidden in "splash screen" process? It not really pretty user experience to see this "flash". I know its a duplicate of #6438 but there is not solution to this at all.

Thank you.

@danroth27

Public API Changes

I dont know.

Intended Use-Case

Much better user experience.

[Laftek]

I checked how it is done with podcast app but it's still not that elegant solution. I counted 3 screens before app loaded.

[janseris]

I am solving it by placing similar graphics as in splashscreen instead of the Loading.. HTML
Namely image with CSS animation

[Laftek]

@janseris thanks for the answer. Are you experiencing any flashes or its just "one" splash screen?

[janseris]

@Laftek a quick check shows 1 very fast white flash between Android splash screen and "Blazor splash/loading screen" and all subsequent attempts are transitioning without a flash (I am using black/dark background on both splashscreens)
Note: tested on Sony Xperia 5 II (pretty fast CPU), so I am not sure about slower devices and not sure about emulators (haven't developed the app in a while now because the Android splash screen hasn't been working properly and/or the fixes from June haven't been released #8020 (comment))

[ghost]

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

[Laftek]

@janseris Thanks! I will check it out. I hope they will fix android splash screen soon. But anyway I guess I will use full-time MUAI after .NET7 release.

[ghost]

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

[pekspro]

Is this even possible? What happens if you default page is an ordinary XAML page, and Blazor is used on the next page?

I agree the Loading... text is annoying. Here is an example how to center the text on the screen, and fade in the text - which will make it unlikely for the user to ever see it: #18548

[Eilon]

Hi, I posted a sample that shows how to make a nicer loading screen on the other issue: #18548 (comment)

[danielchalmers]

Hi @Eilon, am I mistaken or does that still result in a loading screen in addition to the splash screen? Will we be able to combine them in the near future?

[Eilon]

Yeah the splash screen is still a separate thing that is shown immediately when an app is launched. The sample I linked doesn't do anything with splash screens. But if anyone knows a good way to transition from splash screen to a loading screen that could help folks too. It's not something I've read much on but I'm pretty sure there's info out there for each platform, though it might not be .NET MAUI-specific or Blazor Hybrid-specific.

[danielchalmers]

Yeah the splash screen is still a separate thing that is shown immediately when an app is launched. The sample I linked doesn't do anything with splash screens. But if anyone knows a good way to transition from splash screen to a loading screen that could help folks too. It's not something I've read much on but I'm pretty sure there's info out there for each platform, though it might not be .NET MAUI-specific or Blazor Hybrid-specific.

Thanks for the info and thanks for the repo regardless, it's a cool trick I wasn't aware of! @Eilon

[danroth27]

There are ways to handle this in your app. See @Eilon's comment for details: #18548 (comment).

[danielchalmers]

@danroth27 Maybe I'm not understanding it but I don't see how that's an appropriate solution when you still see both splash screens on e.g. Android:

Screen_Recording_20240401_181008_Nova7.mp4

Isn't the linked solution just a customized loading screen? Not combining it with the platform's splash screen?

[Eilon]

@danielchalmers I think you're right, the Loading is separate from the Splash Screen. But I don't think there's any BlazorWebView-specific thing here, but a general .NET MAUI and/or Android/iOS pattern that would need to be implemented as part of the app.

These are the docs I'm aware of:

• General .NET MAUI splash screen info: https://learn.microsoft.com/dotnet/maui/user-interface/images/splashscreen
• Xamarin Android docs on splash screens: https://learn.microsoft.com/xamarin/android/user-interface/splash-screen (this probably still applies the same way in .NET MAUI)

And beyond that I think each platform has a pattern for transitioning from the splash screen to the app (if you don't want just the default behavior).

[danielchalmers]

Thanks @Eilon.

I guess the problem is that the splash screen is only up until CreateMauiApp is complete, but we need more control of when it transitions to the MainPage.

Should I should create a new, more general issue?

[Eilon]

Thanks @Eilon.

I guess the problem is that the splash screen is only up until CreateMauiApp is complete, but we need more control of when it transitions to the MainPage.

Should I should create a new, more general issue?

I think that would make sense (unless there's already an existing issue for it).