Webview Zoom

Configure the initial zoom level of your webview and dynamically control zoom settings at runtime. This feature allows you to optimize content display for different screen sizes and user preferences, ensuring your app content appears at the ideal scale.

You can set the initial zoom level in App Studio during configuration, or control it dynamically using the Median JavaScript Bridge for runtime adjustments.

👍
Developer Demo
Display our demo page in your app to test during development https://median.dev/webview-zoom/

Implementation Guide

The webview zoom can be controlled both through initial configuration and runtime JavaScript methods. This provides flexibility for both static zoom settings and dynamic zoom adjustments based on user interactions or content requirements.

Get Current Zoom Level

To retrieve the current zoom level of the webview:

↔️Median JavaScript Bridge
median.webview.getZoom();

Set Zoom Level

To set a new zoom level at runtime:

↔️Median JavaScript Bridge
median.webview.setZoom(1.1); // Sets zoom to 110%

Platform-Specific Considerations

Android Limitation

On Android devices, there is a platform limitation that prevents setting zoom levels below 100%. Attempting to set zoom values less than 1.0 (100%) will not take effect and the webview will remain at the minimum zoom of 100%.

This limitation is imposed by the Android WebView component and affects all zoom operations, whether set initially in App Studio or dynamically via JavaScript.