[TIMOB-24982] Android/iOS: Add WebView zoomLevel

android/modules/ui/src/java/ti/modules/titanium/ui/WebViewProxy.java

@@ -59,6 +59,7 @@ public class WebViewProxy extends ViewProxy implements Handler.Callback, OnLifec
 	private static final int MSG_RESUME = MSG_FIRST_ID + 112;
 	private static final int MSG_SET_HEADERS = MSG_FIRST_ID + 113;
 	private static final int MSG_GET_HEADERS = MSG_FIRST_ID + 114;
+	private static final int MSG_ZOOM_BY = MSG_FIRST_ID + 115;
 
 	protected static final int MSG_LAST_ID = MSG_FIRST_ID + 999;
 	private static String fusername;
@@ -75,6 +76,7 @@ public WebViewProxy()
 		defaultValues.put(TiC.PROPERTY_LIGHT_TOUCH_ENABLED, true);
 		defaultValues.put(TiC.PROPERTY_ENABLE_JAVASCRIPT_INTERFACE, true);
 		defaultValues.put(TiC.PROPERTY_DISABLE_CONTEXT_MENU, false);
+		defaultValues.put(TiC.PROPERTY_ZOOM_LEVEL, 1.0);
 	}
 
 	@Override
@@ -206,6 +208,9 @@ public boolean handleMessage(Message msg)
 					String html = TiConvert.toString(getProperty(TiC.PROPERTY_HTML));
 					getWebView().setHtml(html);
 					return true;
+				case MSG_ZOOM_BY:
+					getWebView().zoomBy(TiConvert.toFloat(getProperty(TiC.PROPERTY_ZOOM_LEVEL)));
+					return true;
 			}
 		}
 		return super.handleMessage(msg);
@@ -447,6 +452,40 @@ public boolean getEnableZoomControls()
 		return enabled;
 	}
 
+	// clang-format off
+	@Kroll.method
+	@Kroll.getProperty
+	public float getZoomLevel()
+	// clang-format on
+	{
+		TiUIView v = peekView();
+		if (v != null) {
+			return TiConvert.toFloat(getProperty(TiC.PROPERTY_ZOOM_LEVEL), 1.0f);
+		} else {
+			return 1.0f;
+		}
+	}
+
+	// clang-format off
+	@Kroll.method
+	@Kroll.setProperty
+	public void setZoomLevel(float value)
+	// clang-format on
+	{
+		setProperty(TiC.PROPERTY_ZOOM_LEVEL, value);
+
+		// If the web view has not been created yet, don't set html here. It will be set in processProperties() when the
+		// view is created.
+		TiUIView v = peekView();
+		if (v != null) {
+			if (TiApplication.isUIThread()) {
+				((TiUIWebView) v).zoomBy(value);
+			} else {
+				getMainHandler().sendEmptyMessage(MSG_ZOOM_BY);
+			}
+		}
+	}
+
 	public void clearBasicAuthentication()
 	{
 		fusername = null;

android/modules/ui/src/java/ti/modules/titanium/ui/widget/webview/TiUIWebView.java

@@ -1,6 +1,6 @@
 /**
  * Appcelerator Titanium Mobile
- * Copyright (c) 2009-2013 by Appcelerator, Inc. All Rights Reserved.
+ * Copyright (c) 2009-2018 by Appcelerator, Inc. All Rights Reserved.
  * Licensed under the terms of the Apache Public License
  * Please see the LICENSE included with this distribution for details.
  */
@@ -63,6 +63,9 @@ public class TiUIWebView extends TiUIView
 	private boolean isLocalHTML = false;
 	private boolean disableContextMenu = false;
 	private HashMap<String, String> extraHeaders = new HashMap<String, String>();
+	private float zoomLevel =
+		TiApplication.getInstance().getApplicationContext().getResources().getDisplayMetrics().density;
+	private float initScale = zoomLevel;
 
 	private static Enum<?> enumPluginStateOff;
 	private static Enum<?> enumPluginStateOn;
@@ -479,6 +482,10 @@ public void processProperties(KrollDict d)
 		if (d.containsKey(TiC.PROPERTY_USER_AGENT)) {
 			((WebViewProxy) getProxy()).setUserAgent(d.getString(TiC.PROPERTY_USER_AGENT));
 		}
+
+		if (d.containsKey(TiC.PROPERTY_ZOOM_LEVEL)) {
+			zoomBy(getWebView(), TiConvert.toFloat(d, TiC.PROPERTY_ZOOM_LEVEL));
+		}
 	}
 
 	@Override
@@ -510,6 +517,8 @@ public void propertyChanged(String key, Object oldValue, Object newValue, KrollP
 			}
 		} else if (TiC.PROPERTY_DISABLE_CONTEXT_MENU.equals(key)) {
 			disableContextMenu = TiConvert.toBoolean(newValue);
+		} else if (TiC.PROPERTY_ZOOM_LEVEL.equals(key)) {
+			zoomBy(getWebView(), TiConvert.toFloat(newValue, 1.0f));
 		} else if (TiC.PROPERTY_USER_AGENT.equals(key)) {
 			((WebViewProxy) getProxy()).setUserAgent(TiConvert.toString(newValue));
 		} else {
@@ -526,6 +535,36 @@ public void propertyChanged(String key, Object oldValue, Object newValue, KrollP
 		}
 	}
 
+	private void zoomBy(WebView webView, float scale)
+	{
+		if (Build.VERSION.SDK_INT >= 21 && webView != null) {
+			if (scale <= 0.0f) {
+				scale = 0.01f;
+			} else if (scale >= 100.0f) {
+				scale = 100.0f;
+			}
+
+			float targetVal = (initScale * scale) / zoomLevel;
+			webView.zoomBy(targetVal);
+		}
+	}
+
+	public void zoomBy(float scale)
+	{
+		zoomBy(getWebView(), scale);
+	}
+
+	public float getZoomLevel()
+	{
+		return zoomLevel;
+	}
+
+	public void setZoomLevel(float value)
+	{
+		getProxy().setProperty(TiC.PROPERTY_ZOOM_LEVEL, value / initScale);
+		zoomLevel = value;
+	}
+
 	private boolean mightBeHtml(String url)
 	{
 		String mime = TiMimeTypeHelper.getMimeType(url);
@@ -950,6 +989,7 @@ public boolean shouldInjectBindingCode()
 	public void setBindingCodeInjected(boolean injected)
 	{
 		bindingCodeInjected = injected;
+		initScale = getZoomLevel();
 	}
 
 	public boolean interceptOnBackPressed()

android/modules/ui/src/java/ti/modules/titanium/ui/widget/webview/TiWebViewClient.java

@@ -242,4 +242,11 @@ public void onLoadResource(WebView view, String url)
 		data.put(TiC.PROPERTY_URL, url);
 		proxy.fireEvent(TiC.EVENT_WEBVIEW_ON_LOAD_RESOURCE, data);
 	}
+
+	@Override
+	public void onScaleChanged(WebView view, float oldScale, float newScale)
+	{
+		super.onScaleChanged(view, oldScale, newScale);
+		webView.setZoomLevel(newScale);
+	}
 }

android/titanium/src/java/org/appcelerator/titanium/TiC.java

@@ -3313,6 +3313,11 @@ public class TiC
 	 */
 	public static final String PROPERTY_ZINDEX = "zIndex";
 
+	/**
+	 * @module.api
+	 */
+	public static final String PROPERTY_ZOOM_LEVEL = "zoomLevel";
+
 	/**
 	 * @module.api
 	 */

apidoc/Titanium/UI/WebView.yml

@@ -684,9 +684,15 @@ properties:
         On Android you should avoid Calling `setRequestHeaders()` right after `createWebView()`. Use the `requestHeaders` property
         inside `createWebView()` or put it inside the window `open` event.
     type: Dictionary
-    platforms: [android,iphone,ipad]
+    platforms: [android, iphone, ipad]
     since: "6.1.0"
 
+  - name: zoomLevel
+    summary: Manage the zoom-level of the current page.
+    type: Number
+    default: undefined. Behaves as no zoom applied.
+    platforms: [android, iphone, ipad]
+    since: "7.2.0"
 
 examples:
   - title: Basic Web View to External URL

iphone/Classes/TiUIWebView.m

@@ -409,6 +409,13 @@ - (void)setAutoDetect_:(NSArray *)values
   [[self webview] setDataDetectorTypes:result];
 }
 
+- (void)setZoomLevel_:(id)value
+{
+  ENSURE_TYPE(value, NSNumber);
+
+  [[self webview] stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.body.style.zoom = %@;", value]];
+}
+
 - (void)setHtml_:(NSString *)content withObject:(id)property
 {
   NSString *baseURLString = [TiUtils stringValue:@"baseURL" properties:property];

iphone/Classes/TiUIWebViewProxy.m

@@ -116,6 +116,11 @@ - (id)loading
   return NUMBOOL(loading);
 }
 
+- (NSNumber *)zoomLevel
+{
+  return [[(TiUIWebView *)[self view] webview] stringByEvaluatingJavaScriptFromString:@"document.body.style.zoom"];
+}
+
 - (void)goBack:(id)args
 {
   TiThreadPerformOnMainThread(^{