WebView DefaultBackgroundColor Transparent does not render to WebViewBrush

Question

I have a transparent background webview that occasionally I need to interact over (for inking). When I switch to the webviewbrush the webviewbrush renders the transparency as black. I am wondering how to get render transparent: C# Code:

private void MyInkToolbar_ActiveToolChanged(InkToolbar toolbar, object sender)
        {
            if (myInkToolbar.ActiveTool == objectSelect)
            {
                textCanvas.IsHitTestVisible = true;
                testTiny.Visibility = Visibility.Visible;
                testTinyOverlay.Visibility = Visibility.Collapsed;

            }
            else
            {
                if (textCanvas.IsHitTestVisible == true)
                {
                    testTinyOverlay.Visibility = Visibility.Visible;
                    CaptureWebView();
                    testTiny.Visibility = Visibility.Collapsed;
                    textCanvas.IsHitTestVisible = false;
                }
            }
        }
        private void CaptureWebView()
        {
            WebViewBrush b = new WebViewBrush();
            b.SetSource(testTiny);
            b.Redraw();
            testTinyOverlay.Fill = b;
        }

Xaml Code:

<Canvas x:Name="textCanvas">
                        <Grid Name="testTinyGrid" Width="200" Height="200" Background="Transparent">
                            <Rectangle x:Name="testTinyOverlay" Fill="Transparent"/>
                            <WebView x:Name="testTiny" DefaultBackgroundColor="Transparent" Source="ms-appx-web:///HTML/TinyEditor.html"/>
                        </Grid>
                    </Canvas>

Webview Render Image

WebViewBrush Render Image

score 0 · Answer 1 · answered Jun 24 '20 at 02:19

WebView.DefaultBackgroundColor is an additional background, DefaultBackgroundColor is like paper, Html content is like painting. WebViewBrush is equivalent to taking a snapshot of the current WebView when rendering.

If WebView.DefaultBackgroundColor is Transparent, it means that the WebView itself has no background, but the background color is provided by the underlying elements (such as the page itself). This is not a visual problem, but the snapshot cannot extract any background pixels, which is caused by rendering WebViewBrush appears black, this represents an image with no background color.

According to this, the workaround is to set the DefaultBackgroundColor for WebView, which can be set to the same color as the page background (such as white) to maintain the same visual effect.

Thanks.

WebView DefaultBackgroundColor Transparent does not render to WebViewBrush

1 Answers1