Native Controls & JS Bridge Functions

A reference guide for controlling native UI elements and triggering JavaScript functions through the WebtoNative bridge.

You'll need to import the javascript file in your website before starting from this link.

1. Trigger JavaScript Functions via URL Scheme

You can call JavaScript functions inside your WebView directly by using the w2n:// URL scheme.

Syntax:-
w2n://jsFunction:YOUR_JS_CODE

Example:-
w2n://jsFunction:alert("Hello World");

This will execute the JavaScript alert("Hello World") inside the WebView.

2. Hide Native Components

You can hide native UI components dynamically using the hideNativeComponents() JavaScript function.

Available Components:

• secondary_navigation

• admob

• floating_button

• connect

• bottom_navigation

• advanced_bottom_navigation

• header

Syntax:-
hideNativeComponents(["component1", "component2"]);

Example:-
hideNativeComponents(["bottom_navigation"]);

To hide multiple components:
hideNativeComponents(["bottom_navigation", "header", "admob"]);

3. Show Native Components

You can show native UI components using the showNativeComponents() JavaScript function.

Available Components:

• secondary_navigation

• admob

• floating_button

• connect

• bottom_navigation

• advanced_bottom_navigation

• header

Syntax:-
showNativeComponents(["component1", "component2"]);

Example:-
showNativeComponents(["header"]);

To show multiple components:
showNativeComponents(["header", "floating_button", "secondary_navigation"]);

Feature taken live on 24/11/25

3. Setting Navigation Bar color in android

Set the android system navigation bar color.

window.WTN.setNavigationBarColor({ color: selectedColor });

//Pass the color you want to set in string format.

4. Pinch to zoom setting control in Android

Control pinch to zoom feature.

window.WTN.pinchToZoom({state:false});

//Pass the state as either true or false to enable or disable respectively.

5. Invoke Sidebar in Android and iOS

To open side bar in android and iOS call the below url scheme.

w2n://open-sidebar

6. Hiding the splash screen in Android and iOS

When the splash screen's type is set to JS_TRIGGER (instead of a timer or page-load trigger), the native app waits for the web page to explicitly call window.splashScreenJsTrigger() before hiding the splash screen and navigating forward.

window.WTN.Splash.splashScreenJsTrigger();