Native 2D Mode

3D WebView has two different modes for rendering web content:

  1. Default 3D rendering mode (supported on all platforms except WebGL):

    • Web content from the browser engine is rendered to a texture that is displayed in the Unity scene.
    • User interactions (like clicking, scrolling, and dragging) are detected through Unity and then relayed to the browser engine.
    • Supports both 3D and 2D webviews.
  2. Native 2D Mode (Android, iOS, WebGL, and UWP only):

    • A native 2D webview (Android WebView, WKWebView, <iframe>, or UWP WebView) is positioned in front of the Unity game view so that the user can view and interact with it directly.
    • User interactions are sent directly to the native 2D webview and are not routed through Unity.
    • Supports 2D webviews only.

Enabling Native 2D Mode

Native 2D Mode is supported by the following 3D WebView packages:

You can enable Native 2D Mode for a webview by clicking the "Native 2D Mode" checkbox on its CanvasWebViewPrefab (or by setting its Native2DModeEnabled property programmatically):

checkbox to enable Native 2D Mode

If the 3D WebView package in use doesn't support Native 2D Mode, then the default rendering mode is used instead. When Native 2D Mode is enabled, you can still control a webview just like you can with the default rendering mode:

var userAgent = await canvasWebViewPrefab.WebView.ExecuteJavaScript("navigator.userAgent");

Benefits of Native 2D Mode

  • Better performance on iOS and UWP, because Native 2D Mode is much faster than the default rendering mode.
  • Better video support on iOS, because the browser's native video is used instead of the fallback video implementation.
  • Better image quality out-of-the-box, because it uses the device's native pixel density.
  • Better scrolling, because it uses the native scroll momentum.
  • Support for multitouch gestures, like pinch-to-zoom.
  • Also, Native 2D Mode supports JavaScript touch events like touchstart. In contrast, the default rendering mode currently only triggers mouse events like mousedown and pointerdown instead of touch events like touchstart.
  • On Android, the browser's "fullscreen" feature is supported only in Native 2D Mode.

Limitations of Native 2D Mode

  • Since Native 2D Mode works by positioning a native 2D webview in front of the Unity game view, Unity objects or other UI elements cannot be placed in front of the webview. So, if you need the webview to be placed behind another object, please disable Native 2D Mode to use the default rendering mode instead.

  • Native 2D Mode requires that the Canvas's render mode be set to either "Screen Space - Overlay" or "Screen Space - Camera". If the Canvas's render mode is set to "World Space", then 3D WebView's default rendering mode will be used instead.

  • While a native 2D webview is focused, it receives all mouse and keyboard events, so Unity is unable to detect mouse and keyboard input. In other words, Unity APIs like Input.GetMouseButtonDown() and Input.GetKeyDown() temporarily stop working until the Unity game view is refocused by the user clicking on it or by the application calling IWebView.SetFocused(false). If you want to detect clicks on a native 2D webview, you can do so by using JavaScript and message passing, like this:

    await canvasWebViewPrefab.WaitUntilInitialized();
    
    canvasWebViewPrefab.WebView.PageLoadScripts.Add(@"
        document.body.addEventListener('pointerdown', () => {
            window.vuplex.postMessage('pointerdown');
        });
    ");
    
    canvasWebViewPrefab.WebView.MessageEmitted += (sender, eventArgs) => {
        if (eventArgs.Value == "pointerdown") {
            Debug.Log("The webview was clicked!");
        }
    };
  • Native 2D Mode isn't supported on VR or AR headsets.

  • In order to display hardware-accelerated content like video and WebGL in Native 2D Mode on Android, 3D WebView automatically enables hardware acceleration for the app. However, you can disable this by adding the scripting symbol VUPLEX_ANDROID_DISABLE_HARDWARE_ACCELERATION in your Android player settings.

  • The following APIs are unsupported or ignored in Native 2D Mode: