Guida Rapida - Realtà Virtuale
Poiché Wonderland Engine è focalizzato su WebXR, utilizzare il WebXR Device API è molto comodo.
In questo tutorial, configureremo i componenti necessari per gli input dei controller.
Continuiamo da dove abbiamo interrotto in Iniziare.
Fondamenti
Alcune informazioni di base, sentiti libero di passare a Input del Controller se sei già familiare con la VR e l’esecuzione di app WebXR su Oculus Quest.
Rendering Stereo
Una volta attivata la modalità VR dopo che l’utente ha premuto il pulsante “VR” in basso a destra dello schermo, Wonderland Engine inizia automaticamente il rendering in stereo.
“Stereo” significa che ci sono due viste renderizzate: una per l’occhio sinistro e una per l’occhio destro. L’opposto è “mono”, che è una vista singola.
Cliccando sull’oggetto “Player”, troverai la “NonVrCamera” per il rendering mono, e gli oggetti “EyeLeft” e “EyeRight” per il rendering stereo.
Input del Visore
Per fare in modo che le viste seguano la testa dell’utente, gli oggetti “EyeLeft” e “EyeRight” hanno già impostato i componenti di “input” (dalla scena predefinita). I componenti di input leggono varie forme di posa degli input e le applicano agli oggetti a cui sono attaccati.
Visualizzazione su Dispositivi XR
Per visualizzare sul visore, devi collegare il visore e inoltrare il traffico web locale da localhost
dal visore XR al tuo PC:
- Assicurati di avere il “Debug USB” abilitato per il tuo dispositivo! Su dispositivi Android questo richiede di toccare il “Numero di Build” fino a quando non appare la conferma, poi trova le impostazioni di “Debug USB” e abilita.
Browser Basati su Chromium (Meta Browser, Pico Browser, Edge)
Dispositivi: Meta Quest 1/2/Pro, Pico Neo 3, Pico 4, HoloLens
Segui la guida di Chrome su come effettuare il debug remoto dei dispositivi. Nel caso l’Oculus Quest non appaia, devi eseguire
adb devices
per avviare il server adb. Adb è incluso nei tools della piattaforma Android.Infine, inoltra la porta
8080
seguendo questa guida al Port Forwarding di Chrome. In questo modo puoi accedere ahttp://localhost:8080/index.html
dal Meta/Pico Browser ed evitare la restrizione a “https” per WebXR (questo è possibile solo su “localhost”!).
Browser Basati su Gecko (Wolvic)
Dispositivi: Meta Quest 1/2/Pro, Huawei VR, HTC Vive Focus 3, Lynx R1, Pico Neo 3, Pico 4
Apri Firefox Nightly, trova il menu in alto a destra,
Tools > More Tools > Remote Debugging
.Su Wolvic, vai su “Settings > Developer Options > Enable Remote Debugging”.
Evita il Cavo
Per abilitare il “ADB via Wifi”, inizia collegando il tuo dispositivo tramite USB-C al PC.
Su Meta Quest Developer Hub, puoi attivare “ADB over Wifi” e disconnettere il dispositivo.
Per altri dispositivi, esegui i seguenti comandi dopo aver installato i tools della piattaforma Android:
Input del Controller
Ora che la nostra applicazione funziona su Oculus Quest, il nostro prossimo passo sarà aggiungere i controller.
Modelli dei Controller
Scarica quest_controllers.glb, il modello dei controller Oculus Touch v2 a bassa poligonazione di Jezza3D, importato in Blender ed esportato come glb con alcune modifiche alla trasformazione.
Trascina e rilascia il nuovo file nella cartella assets
. Da lì, trascinali sull’oggetto “Player”.
Componenti
Aggiungi un componente di input a ciascuno dei controller e imposta il tipo di input su hand right
e hand left
rispettivamente.

Dopo aver cliccato su “Package”, i tuoi controller dovrebbero ora essere visibili e muoversi nella VR!
Riassunto
Creare controlli WebXR in Wonderland Engine è molto comodo.
Da qui, puoi iniziare ad aggiungere comportamenti personalizzati con i tuoi componenti JavaScript.