2

我有一个非常简单的 RenderTargetBitmap.RenderAsync 重载破坏 WebView 缩放的重现案例。我在 MainPage 上只有一个 WebView 和一个按钮：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <WebView Source="http://bing.com"></WebView>
    <Button Content="Render me"
            HorizontalAlignment="Right"
            VerticalAlignment="Bottom"
            Click="ButtonBase_OnClick" />
</Grid>

在后面的代码中只有一个简单的事件处理程序

private async void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
    RenderTargetBitmap rtb = new RenderTargetBitmap();
    await rtb.RenderAsync(this, 1280, 720);
}

这是调用 RenderAsync 之前页面的样子：

在 RenderAsync 之前

这就是通话后发生的事情：

在 RenderAsync 之后

知道为什么以及如何防止这种情况吗？请注意，只有当我打电话时才会发生这种情况

await rtb.RenderAsync(this, 1280, 720);

但如果我在没有缩放的情况下调用重载

await rtb.RenderAsync(this);

编辑：由于我收到的第一个答案，我想澄清为什么纵横比不是这里的问题，而只是为了证明确实存在问题。考虑以下场景 - 非常高的 DPI 屏幕，只需要较低分辨率的屏幕截图 - 即使您使用 RIGHT 比例缩小它，它仍然会弄乱 WebView。此外，对于我的场景，事后手动调整屏幕截图的大小不是一种选择 - 具有缩放尺寸的 RenderAsync 重载要快得多，我真的更喜欢使用该方法。

4

3 回答 3

1

非常奇怪的行为......我发现了一个非常肮脏（！）的解决方法。我基本上再次隐藏和显示 webview (wv)。

private async void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
    RenderTargetBitmap rtb = new RenderTargetBitmap();
    await rtb.RenderAsync(wv, 1280, 720);
    wv.Visibility = Visibility.Collapsed;
    await Task.Delay(100);
    wv.Visibility = Visibility.Visible;
}

我对这个解决方案并不感到自豪，并且 webview 闪烁，但至少它不再“炸毁”了......

于 2016-02-11T19:10:47.100 回答
1

这也有点小技巧，但我发现如果您通过 a 设置另一个控件的内容WebViewBrush然后渲染该控件，则源WebView不会得到任何缩放。我已经修改了您提供的 XAML，所以它看起来像这样：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <Border x:Name="Target" Width="1280" Height="720" />
    <WebView x:Name="webView"  Source="http://bing.com" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></WebView>

    <Button Content="Render me" Grid.Row="1"
        HorizontalAlignment="Right"
        VerticalAlignment="Bottom"
        Click="ButtonBase_OnClick" />

</Grid>

在您的情况下，您应该选择将Border控件设置在您的后面WebView（但是，不要更改它Visibility或将其放在窗口边界之外，RenderAsync否则会失败）。然后，在后面的代码中，将目标控件的 设置为以 为源Background的 a 的实例：WebViewBrushWebView

    private async void ButtonBase_OnClick(object sender, RoutedEventArgs e)
    {
        WebViewBrush brush = new WebViewBrush();
        brush.SetSource(webView);
        Target.Background = brush;
        Target.InvalidateMeasure();
        Target.InvalidateArrange();

        RenderTargetBitmap rtb = new RenderTargetBitmap();
        await rtb.RenderAsync(Target, 1280, 720);
        var pixels = await rtb.GetPixelsAsync();
    }

您将获得最终图像，而不会对源造成任何问题WebView（但是请注意，由于纵横比不匹配，最终图像看起来会失真）。然而，这有一些注意事项，最重要的是WebView尺寸必须与其中之一相匹配，RenderTargetBitmap否则您将获得空白区域。

于 2016-02-11T21:12:28.297 回答
0

不使用固定值，而是使用VisibleBounds获取当前窗口大小。

这是代码：

private async void pressMe_Click(object sender, RoutedEventArgs e)
{
    var windowBounds = ApplicationView.GetForCurrentView().VisibleBounds;
    RenderTargetBitmap rtb = new RenderTargetBitmap();
    await rtb.RenderAsync(this, (int)windowBounds.Width, (int)windowBounds.Height);
}
于 2016-02-10T20:54:50.197 回答