Native 2D Mode

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

  1. Default 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, and WebGL only):

    • A native 2D webview (android.webkit.WebView, WKWebView or <iframe>) 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, because Native 2D Mode is much faster than the default rendering mode.
  • 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.

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 currently requires that the Canvas's render mode be set to "Screen Space - Overlay". If the Canvas is set to a different render mode, 3D WebView's default rendering mode will be used instead.

  • 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: