UWP WebView – Disabling the zoom gesture

I was working on one a project where we have an app that hosts a WebView which navigates to a specific web page. All good till the requirement was to disable the zoom control (through pinch gesture).

Unfortunately, WebView control does not provide a property to disable the pinch gesture. So the way I worked around this is by injecting some JavaScript to the code.

 

The steps to do that as follows:

  1. Wait till the page is loaded (and rendered)
    This can be achieved by listening to the eventĀ DOMContentLoaded, which will be fired once the WebView is done parsing the html content
  2. create a Javascript snippet that does two tasks; 1)Creates a css style that prevents zoom (it has to be IE compatible), 2)Injects that style created into the head element of the html
  3. Run the Javascript code in the WebView control

Now the whole code snippet will be like this:

If you have any question, please reach me out on twitter @tareqateik

Leave a Reply

Your email address will not be published. Required fields are marked *