WebView 到 WebViewBrush - XAML答案

【问题标题】：WebView to WebViewBrush - XAMLWebView 到 WebViewBrush - XAML
【发布时间】：2016-08-19 03:27:24
【问题描述】：

我正在尝试将我的 WebView 转换为 WebViewBrush 以便在我的 UWP (C#/XAML) 应用程序中打印它。

我已经设置了我的 WebView 和 Brush，这样当我单击按钮时，WebView 会被隐藏，而 WebViewBrush 会显示出来。

这是 XAML：

<WebView ext:Extension.HtmlString="{Binding Html}"
         x:Name="saveWebView"
         Grid.Row="1"
         Grid.Column="0" /> 

<Rectangle Height="400" x:Name="saveWebViewBrush" />

当我单击按钮显示画笔时，基本上它只是拍摄 WebView 中可见内容的快照。我想要的是拍摄整个 WebView 的快照（也不是滚动条！）。

我见过的唯一一个尝试过这个的人是 https://stackoverflow.com/a/17222629/2884981 - 但不幸的是，那已经有几年了，当我尝试这个解决方案时，我收到了一百万个错误，原因是 InvokeScript 已过时并且 InvokeScriptAsync 导致了重大更改。

当我按下按钮时的 C# 代码是这样的：

private async void OnButtonClick(object sender, RoutedEventArgs e)
{
    //make the rectangle visible when you want something over the top of the web content
    saveWebViewBrush.Visibility = Windows.UI.Xaml.Visibility.Visible;

    //if the rectangle is visible, then hit the webview and put the content in the webviewbrush
    if (saveWebViewBrush.Visibility == Windows.UI.Xaml.Visibility.Visible)
    {
        WebViewBrush b = new WebViewBrush();
        b.SourceName = "saveWebView";
        b.Redraw();
        saveWebViewBrush.Fill = b;
        saveWebView.Visibility = Windows.UI.Xaml.Visibility.Collapsed;
    }
}

如果有人知道如何将整个 WebView 转换为 WebView 画笔，我将不胜感激。

编辑

为了解释“为什么”，我尝试打印 WebView 的内容。从我读到的内容看来，这是不可能的，除非我将其转换为 WebViewBrush。但是，如果有人有任何替代想法，我会全力以赴！

【问题讨论】：

标签： c# xaml webview uwp

【解决方案1】：

如果有人知道如何将整个 WebView 转换为 WebView 画笔，我将不胜感激。

为此，您可以尝试以下方法：

private async void OnButtonClick(object sender, RoutedEventArgs e)
{
    int width;
    int height;
    // get the total width and height
    var widthString = await saveWebView.InvokeScriptAsync("eval", new[] { "document.body.scrollWidth.toString()" });
    var heightString = await saveWebView.InvokeScriptAsync("eval", new[] { "document.body.scrollHeight.toString()" });

    if (!int.TryParse(widthString, out width))
    {
        throw new Exception("Unable to get page width");
    }
    if (!int.TryParse(heightString, out height))
    {
        throw new Exception("Unable to get page height");
    }

    // resize the webview to the content
    saveWebView.Width = width;
    saveWebView.Height = height;

    WebViewBrush b = new WebViewBrush();
    b.SourceName = "saveWebView";
    b.Redraw();
    saveWebViewBrush.Fill = b;
}

请注意WebViewBrush.Redraw 方法是异步发生的。所以为了确保我们能得到完整的快照，我们最好不要隐藏WebView，或者我们可以在隐藏WebView之前添加一些延迟，比如：

await Task.Delay(500);
saveWebView.Visibility = Windows.UI.Xaml.Visibility.Collapsed;

一旦我们有了“saveWebViewBrush”矩形，我们就可以参考Printing sample或this answer来打印它。

【讨论】：