Question

How can I change the zoom level of a WinRT Webview?

If I give it focus, I can zoom in/out using the keyboard CTRL+ + and CTRL+ -
But can this be accomplished from code?

Note: Putting the WebView inside a ScrollViewer, and let that zoom, is not what I’m looking for.

Answer 1

Unfortunately I don’t think there’s a way to do it directly in managed code. There is, however, a workaround if you own the content or can inject some css / script.

In your HTML, add this css:

<style type="text/css">
body
{
zoom:100%;
}
</style>

In your HTML also include a script block like this:

function setZoomLevel(newZoom) {
    document.styleSheets[0]['rules'][0].style['zoom'] = newZoom;
}

In your C# code, add a helper method:

private void SetZoomLevel(int level)
{
    string slevel = string.Format("{0}%", level);
    webBrowser.InvokeScript("setZoomLevel", slevel);
}

In your C# code you can now adjust the zoom level by calling:

SetZoomLevel(200);

That’s the best I could find and unfortunately it doesn’t work if you can’t inject a style and some script.

NOTE: Although this does zoom content in pretty much the same way as adjusting the zoom slider, the zoom slider is not affected in the desktop browser. Therefore if you call SetZoomLevel(200); above and then set the slider to 200% you would actually see 400%. This should not be an issue in WebView because there is no slider.

Hope someone comes up with a better answer.