jspuij / TwokaB

Blazor WebView control for WPF, Android, macOS, iOS. Run Blazor on .NET Core and Mono natively inside a Webview.
https://jspuij.github.io/BlazorWebView.Docs/pages/index.html
Apache License 2.0
132 stars 16 forks source link

[Question] - How do I get rid of the white background of the BlazorWebview during load? #44

Open geocine opened 3 years ago

geocine commented 3 years ago

See this demo below, to understand behavior while window is opening

webview

I tried adding "Aqua" Background to the BlazorWebView but still the White view is showing

webview2

jspuij commented 3 years ago

Pretty sure the white background is the browser window, before the blazor HTML is loaded. As I don't actively maintain this codebase anymore and MBB and .net 6 are the spiritual successors to TwokaB, I'd say the easiest solution is either to overlay or hide the control until everything is loaded, or adapt the code to try and set this background colour of the embedded browser window.

geocine commented 3 years ago

For the second image you can see I already set the BlazorWevbiew "Background" property to "aqua" but still a white background is showing after that "aqua" background which I have set.

FYI I forgot the exact syntax and I'm not infront of the PC rn, but ii already looks something like this

<BlazorWebview Background="aqua" />

Then the "pink" color is coming from the "index.html" page

<style>
body {
  background: "pink"; 
}
</style>
adds39939 commented 2 years ago

@geocine did you end up finding a solution for this?

SqueakyBed commented 2 years ago

I am interested too.

It doesn't work even after changing the BlazorWebView bg and style colors.

geocine commented 2 years ago

I still don't have a solution unfortunately

KrystianLesniak commented 1 year ago

Any findings yet?

SqueakyBed commented 1 year ago

My solution.

    ViewHandler.ViewMapper.AppendToMapping(nameof(IView.Background), (handler, view) =>
    {
        if (handler.PlatformView is WebView2 wv)
        {
            //Change the background of the web browser to the current theme color to prevent unwanted flashing when refreshing the page. 
            wv.DefaultBackgroundColor = Windows.UI.Color.FromArgb(Alpha, Red, Green, Blue);
        }
    });
SimenCTan commented 1 year ago

Have there been any updates regarding this issue

SimenCTan commented 1 year ago

To resolve the issue on macOS

public static void ModifyBlazorWebView() 
{
ViewHandler.ViewMapper.AppendToMapping(nameof(IView.Background), (handler, view) =>
{
#if MACCATALYST || IOS
if (handler.PlatformView is WKWebView wv)
{
wv.Opaque = false;
wv.BackgroundColor = UIColor.Clear;
}
#endif
});
}