WebView rendering flickers

Question

I'm working on an UWP project and I want to load a WebView with opacity = 0.01f, and only set opacity to 1.0f when WebView_LoadCompleted is called. Until then it is presented by a preview image. But when I'm showing it, it flickers white in like 1 on 20 cases, and I'm testing the same WebView content. My code looks like this:

            Grid grid = new Grid();
            //set previewImage as preview of grid content
            Image backgroundImage = new Image();
            backgroundImage.Source = new BitmapImage(new Uri(@"ms-appdata:///local/" + "some path"));
            grid.Children.Add(backgroundImage);
            grid.SetValue(Grid.RowProperty, slide.Pos.Y);
            grid.SetValue(Grid.ColumnProperty, slide.Pos.X);
            MainGrid.Children.Add(grid);

            WebView webView = new WebView();
            webView.NavigationStarting += WebView_NavigationStarting;
            webView.LoadCompleted += WebView_LoadCompleted;
            webView.ScriptNotify += WebView_ScriptNotify;
            webView.Opacity = 0.01f;
            Uri navigationUri = "some local file Uri");
            webView.NavigateToLocalStreamUri(navigationUri, myResolver); // myResolver checks if source is allowed to load
            webView.Width =  1024;
            webView.Height = 768;
            Viewbox viewBox = new Viewbox();
            viewBox.Stretch = Stretch.Uniform;
            viewBox.Child = webView;
            grid.Children.Add(viewBox);

And my WebView_LoadCompleted looks like this:

    private void WebView_LoadCompleted(object sender, NavigationEventArgs e)
    {
        WebView webView = (WebView)sender;
        webView.Opacity = 1.0f;
    }

I was expecting that the WebView will only render its laoded content right away because it is visible (with low opicity) in the ViewBox, and most of the times it is not flickering, but it still appears.

Trying to get a call after WebView_LoadCompleted didn't work yet, I tried some calls like x_LayoutUpdated, x_SizeChanged for the WebView and the ViewBox, but WebView_LoadCompleted is the last called function that runs into a breakpoint.

Setting the WebView.DefaultBackgroundColor to transparent didn't work, it still flickers white. Placing the WebView below the Image and getting it to the front after a delay for layout time didn't work.

Thanks for your help! I appreciate it!

I think the issue here is `ViewBox` try changing the container type for your `WebView`. — mrogal.ski, May 10 '17 at 15:06
Hi, I looked it up, but couldn't see anything that would validate your suggest, but I found this Question: http://stackoverflow.com/questions/34340134/how-to-know-when-a-frameworkelement-has-been-totally-rendered There was someone looking for a similar callback in UWP for the WPF function "ContentRendered", that would help me as well, if it's valid to be the final call in the lifecycle calls for presentation / rendering. — Viktor_DE, May 10 '17 at 15:25

score 1 · Accepted Answer · answered May 23 '17 at 08:07

1

It looks like there is no proper way to validate that the webview is finished with all possible loading and rendering processes for the webview. But you can use this answer of another question for other UIElements:

Answer

answered May 23 '17 at 08:07

Viktor_DE

276
3
19

WebView rendering flickers

1 Answers1