feat(android): add props to control pinch to zoom and internal zoom controls (#2113)

Co-authored-by: Mircea Bogdan Stanciu <mirceabogdanstanciu@gmail.com>
Co-authored-by: Thibault Malbranche <thibault.malbranche@epitech.eu>

android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java

@@ -253,6 +253,16 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
     view.getSettings().setJavaScriptEnabled(enabled);
   }
 
+  @ReactProp(name = "setBuiltInZoomControls")
+  public void setBuiltInZoomControls(WebView view, boolean enabled) {
+    view.getSettings().setBuiltInZoomControls(enabled);
+  }
+
+  @ReactProp(name = "setDisplayZoomControls")
+  public void setDisplayZoomControls(WebView view, boolean enabled) {
+    view.getSettings().setDisplayZoomControls(enabled);
+  }
+
   @ReactProp(name = "setSupportMultipleWindows")
   public void setSupportMultipleWindows(WebView view, boolean enabled){
     view.getSettings().setSupportMultipleWindows(enabled);

docs/Reference.md

@@ -52,6 +52,8 @@ This document lays out the current public properties and methods for the React N
 - [`dataDetectorTypes`](Reference.md#datadetectortypes)
 - [`scrollEnabled`](Reference.md#scrollenabled)
 - [`nestedScrollEnabled`](Reference.md#nestedscrollenabled)
+- [`setBuiltInZoomControls`](Reference.md#setBuiltInZoomControls)
+- [`setDisplayZoomControls`](Reference.md#setDisplayZoomControls)
 - [`directionalLockEnabled`](Reference.md#directionalLockEnabled)
 - [`geolocationEnabled`](Reference.md#geolocationenabled)
 - [`allowFileAccessFromFileURLs`](Reference.md#allowFileAccessFromFileURLs)
@@ -1053,6 +1055,26 @@ Setting this to `true` will prevent the `ScrollView` to scroll when scrolling fr
 
 ---
 
+### `setBuiltInZoomControls`[⬆](#props-index)<!-- Link generated with jump2header -->
+
+Sets whether the WebView should use its built-in zoom mechanisms. The default value is `true`. Setting this to `false` will prevent the use of a pinch gesture to control zooming.
+
+| Type | Required | Platform      |
+| ---- | -------- | ------------- |
+| bool | No       | Android       |
+
+---
+
+### `setDisplayZoomControls`[⬆](#props-index)<!-- Link generated with jump2header -->
+
+Sets whether the WebView should display on-screen zoom controls when using the built-in zoom mechanisms (see `setBuiltInZoomControls`). The default value is `false`. 
+
+| Type | Required | Platform      |
+| ---- | -------- | ------------- |
+| bool | No       | Android       |
+
+---
+
 ### `directionalLockEnabled`[⬆](#props-index)<!-- Link generated with jump2header -->
 
 A Boolean value that determines whether scrolling is disabled in a particular direction.

src/WebView.android.tsx

@@ -64,6 +64,8 @@ class WebView extends React.Component<AndroidWebViewProps, State> {
     androidLayerType: 'none',
     originWhitelist: defaultOriginWhitelist,
     setSupportMultipleWindows: true,
+    setBuiltInZoomControls: true,
+    setDisplayZoomControls: false,
     nestedScrollEnabled: false,
   };
 

src/WebViewTypes.ts

@@ -301,6 +301,8 @@ export interface AndroidNativeWebViewProps extends CommonNativeWebViewProps {
   textZoom?: number;
   thirdPartyCookiesEnabled?: boolean;
   messagingModuleName?: string;
+  setBuiltInZoomControls?: boolean,
+  setDisplayZoomControls?: boolean,
   nestedScrollEnabled?: boolean;
   readonly urlPrefixesForDefaultIntent?: string[];
 }
@@ -953,6 +955,23 @@ export interface AndroidWebViewProps extends WebViewSharedProps {
    */
   allowsFullscreenVideo?: boolean;
 
+  /**
+   * Boolean value to control whether pinch zoom is enabled. Used only in Android.
+   * Default to true
+   *
+   * @platform android
+   */
+  setBuiltInZoomControls?: boolean;
+   
+  /**
+   * Boolean value to control whether built-in zooms controls are displayed. Used only in Android.
+   * Default to false
+   * Controls will always be hidden if setBuiltInZoomControls is set to `false`
+   * 
+   * @platform android
+   */
+  setDisplayZoomControls?: boolean;
+  
   /**
    * Allows to scroll inside the webview when used inside a scrollview.
    * Behaviour already existing on iOS.