|
1 | 1 | # Background |
2 | 2 |
|
3 | 3 | There are two types of zoom in Chromium: Browser Zoom and Pinch-Zoom: |
4 | | -- Browser zoom is what you get by using Ctrl + +(plus) or – (minus) or Ctrl + Mousewheel. |
5 | | -- Pinch-zoom is activated by using a pinch gesture on a touchscreen. |
| 4 | +- Browser zoom, referred to as “Page Zoom” or “Zoom” more generally, is what we get by using Ctrl + +(plus) or – (minus) or Ctrl + Mousewheel. This changes the size of a CSS pixel relative to a device independent pixel and so it will cause page layout to change. End developers can programmatically change browser Zoom properties including (IsZoomControlEnabled)[https://docs.microsoft.com/en-us/microsoft-edge/webview2/reference/win32/icorewebview2settings?view=webview2-1.0.774.44#get_iszoomcontrolenabled] and (ZoomFactor)[(IsZoomControlEnabled)[https://docs.microsoft.com/en-us/microsoft-edge/webview2/reference/win32/icorewebview2settings?view=webview2-1.0.774.44#get_iszoomcontrolenabled]. Setting ZoomFactor property causes the layout to change and enables scroll bar which lets users interact with the zoomed in content using mouse. |
| 5 | +- Pinch-zoom, referred to as “Page Scale” zoom, is performed as a post-rendering step, it scales the surface the web page is rendered onto by changing the page scale factor property. When user perfom a pinch zooming action, it does not change the layout but rather changes the viewport and clips the web content, the content outside of the viewport isn't visible onscreen and users can't reach this content using mouse. |
6 | 6 |
|
7 | | -Currently, the first type of zoom control is supported in WebView2 and modifying it has no effect on pinch zoom. |
| 7 | +Currently, the first type of zoom control is supported in WebView2 and modifying it has no effect on page scale zoom. |
8 | 8 |
|
9 | | -In response to customer requests to be able to change the current functionality of pinch zoon in WebView2: Disable/Enanle pinch zoom, the WebView2 team has introduced Pinch Zoom API which allows users to change setting to disable/enable pinch zoom. |
| 9 | +In response to customer requests to be able to change the current functionality of page scale zoom in WebView2, the WebView2 team has introduced this Pinch Zoom API which allows end developers to disable or enable page scale zoom control via a setting. |
10 | 10 |
|
11 | 11 | In this document we describe the new setting. We'd appreciate your feedback. |
12 | 12 |
|
13 | 13 |
|
14 | 14 | # Description |
15 | | -The default value for IsPinchZoomEnabled is true. |
16 | | -When this setting is set to false, it disables pinch zoom in WebView. |
| 15 | +The default value for `IsPinchZoomEnabled` is true. |
| 16 | +When this setting is set to false, it disables pinch zooming in WebView. |
17 | 17 |
|
18 | 18 |
|
19 | 19 | # Examples |
20 | 20 | ```cpp |
| 21 | +wil::com_ptr<ICoreWebView2> webView; |
21 | 22 | void SettingsComponent::TogglePinchZooomEnabled() |
22 | 23 | { |
| 24 | + wil::com_ptr<ICoreWebView2Settings> coreWebView2Settings; |
| 25 | + // Get webView's current settings |
| 26 | + CHECK_FAILURE(webView->get_Settings(&coreWebView2Settings)); |
| 27 | + |
23 | 28 | BOOL enabled; |
24 | 29 | CHECK_FAILURE(coreWebView2Settings->get_IsPinchZoomEnabled(&enabled)); |
25 | 30 | CHECK_FAILURE(coreWebView2Settings->put_IsPinchZoomEnabled(enabled ? FALSE : TRUE)); |
26 | 31 | } |
27 | 32 | ``` |
28 | 33 |
|
29 | 34 | ```c# |
30 | | -privagte WebView2 _webView; |
| 35 | +private WebView2 _webView; |
31 | 36 | void TogglePinchZoomEnabled() |
32 | 37 | { |
33 | | - var coreWebView2Settings = webView.CoreWebView2.Settings; |
| 38 | + var coreWebView2Settings = _webView.CoreWebView2.Settings; |
34 | 39 | coreWebView2Settings.IsPinchZoomEnabled = !coreWebView2Settings.IsPinchZoomEnabled; |
35 | 40 | } |
36 | 41 | ``` |
| 42 | + |
| 43 | +# Remarks |
| 44 | +When `IsPinchZoomEnabled` is set to false, pinch zooming user action is disabled in WebView. This however doesn't modify the underlying page scale factor of page scale zoom. |
| 45 | + |
37 | 46 | # API Notes |
38 | 47 |
|
39 | 48 | See [API Details](#api-details) section below for API reference. |
|
0 commit comments