TLabWebView

日本語版READMEはこちら

A Unity plugin that enables the use of Android’s web browser component (WebView / GeckoView) as a uGUI (Texture2D). This plugin makes it possible to implement a 3D web browser (3D WebView) within Unity.

• Keyboard Input
• Touch Interaction
• File download (include blob, data url)
• Resize
• Run Javascript
• Support for multiple instances running concurrently
• Support for multiple browser engines
  • WebView: Stable and powerful javascript interface
  • GeckoView: Highly extensible to pop-ups and other areas that cannot be controlled by WebView
• Support for multiple rendering method
  • HardwareBudder: implemented using a low-level feature of Android. Best performance
  • ByteBuffer: Easy access to frames, since the results are obtained as byte arrays on the C# side. High stability. This option is used by default.
  • Surface: Direct rendering to Android's Surface class, used for active use of features such as CompositionLayers

Document is here
Snippets is here
The Java plugin source code is here

Unity version this plugin supports

• Unity 2021
• Unity 2022
• Unity 6000 (Only WebView tested, Not yet tested in GeckoView.)

Graphics api this plugin supports

• OpenGLES
• Vulkan

Screenshot

Screenshot run on Android 13, Adreno 619

VR sample

Operating Environment

Getting Started

Requirements

• TLabVKeyborad v1.0.1+

Installing

git clone https://github.com/TLabAltoh/TLabWebView.git

git submodule add https://github.com/TLabAltoh/TLabWebView.git

https://github.com/TLabAltoh/TLabWebView.git#upm

https://github.com/TLabAltoh/TLabWebView.git#appstore-compatible-upm

Set Up

UNITYWEBVIEW_ANDROID_USES_CLEARTEXT_TRAFFIC

UNITYWEBVIEW_ANDROID_ENABLE_CAMERA

UNITYWEBVIEW_ANDROID_ENABLE_MICROPHONE

org.gradle.jvmargs=-Xmx**JVM_HEAP_SIZE**M
org.gradle.parallel=true
# android.enableR8=**MINIFY_WITH_R_EIGHT**
unityStreamingAssets=**STREAMING_ASSETS**
**ADDITIONAL_PROPERTIES**
android.useAndroidX=true
# android.enableJetifier=true

    ...

    dependencies {
        implementation "androidx.annotation:annotation-jvm:1.9.1"

        def collection_version = "1.4.3"
        implementation "androidx.collection:collection:$collection_version"

        def lifecycle_version = "2.6.1"
        implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-viewmodel-compose:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-livedata-ktx:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-runtime-ktx:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-runtime-compose:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-viewmodel-savedstate:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-common-java8:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-service:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-process:$lifecycle_version"
        implementation "androidx.lifecycle:lifecycle-reactivestreams-ktx:$lifecycle_version"
    }

    ...

Prefab

Prefab is here. Just add prefab to the canvas to implement webview

/Resources/TLab/WebView/Browser.prefab

Keyborad

By default, a virtual keyboard based on uGUI is available in this package. However, while the uGUI-based virtual keyboard has advantages in terms of extensibility of design, etc., there may be situations where you prefer to use the OS standard system keyboard. In such a case, please enable the system keyboard using permissions, etc. on the app side according to the settings of each platform (e.g., see here for settings on Meta Quest). Once the app has been configured, the system keyboard can be used in WebView.

[!NOTE] If you want to download the file to external storage (like /Download, /Picture), please add the following permission to the manifest. This is required for Android 11+ (see here for more details).

<uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" />

[!NOTE] The JavaScript interface window.tlab, which is implemented in WebView, is currently not supported in GeckoView. This is due to the complexity of implementing the communication process between GeckoView and the Java native plugin (.aar). Currently, only the functionality to send messages to C# components by calling window.postMessage as an alternative to window.tlab.unitySendMessage is implemented. However, there are plans to fully support the features of window.tlab in GeckoView in the future. When sending a message from a GeckoView page script to a C# component, use the following JavaScript:

let payload = { go: "Test", method: "OnMessage", message: "this is test message." };
window.postMessage({ type: "TLABWEBVIWE_GECKO_NATIVE_MESSAGE", payload: { method: "unitySendMessage", payload: payload } }, "*");

[!WARNING] Note that this plugin only works on Android devices; it will not display web pages when run on the Unity Editor.

[!WARNING] HardwareBuffer mode may not work properly for some devices. In such cases, Please change the project's Graphics API from Vulkan to OpenGLES (Problems in HardwareBuffer mode are most often reported when using the Vulkan API in a project). Or switch CaptureMode from HardwareBuffer to ByteBuffer (This is a stable rendering option).

[!WARNING] Android WebView doesn't support the WebXR API.

[!WARNING] OculusQuest doesn't support some HTML5 input tags (see below). If you want to use them, please use GeckoView as Browser instead of WebView. It will display a widget implemented by uGUI. Below is the status of HTML5 input tag support by this plugin's custom widget.

• datetime-local
• date
• time
• color
• week
• month
• image
• file

[!WARNING] This plugin supports both Vulkan and OpenGLES, but if you are building an application that uses a Vulkan graphics API, the Android device must support OpenGLES (3.1+) as well as Vulkan.