Introducción a WebView2 en HoloLens 2 aplicaciones de Unity (versión preliminar)

Artículo
08/10/2023

Este tutorial está destinado a desarrolladores que usan WebView2 en aplicaciones envolventes HoloLens 2 Unity.

WebView2 en HoloLens 2 y el complemento WebView para Unity están en versión preliminar y están sujetos a cambios antes de la disponibilidad general.

WebView2 solo se admite en dispositivos HoloLens 2 que ejecutan la actualización de Windows 11. Para obtener más información, vea Actualizar HoloLens 2.

Para las aplicaciones 2D habilitadas para WebView2 en HoloLens 2, consulta Introducción a WebView2 en aplicaciones WinUI 2 (UWP).

En este tutorial:

Configure las herramientas de desarrollo para crear HoloLens 2 aplicaciones de Unity que usen WebView2 para mostrar contenido web.
Instale Mixed Reality Toolkit mediante la herramienta de características de Mixed Reality.
Cree un proyecto inicial de Unity para el desarrollo HoloLens 2.
Agregue el complemento WebView de Microsoft Mixed Reality para Unity mediante la herramienta de características de Mixed Reality.
Configure un objeto prefabricado de WebView que muestre el contenido de la página web en la aplicación de HoloLens 2.
Obtenga información sobre los conceptos e interacciones de WebView2 en Unity.

Proyecto completado

Hay disponible una versión completa de este proyecto de Introducción en el repositorio WebView2Samples. Puede usar el proyecto completado (desde el repositorio o siguiendo los pasos siguientes) como línea base para agregar más funcionalidad de WebView2 y otras características a la aplicación de HoloLens 2 Unity.

Hay disponible una versión completa de este proyecto de tutorial en el repositorio WebView2Samples :

Nombre de ejemplo: HoloLens2_GettingStarted
Directorio del repositorio: HoloLens2_GettingStarted
Carpeta del proyecto de Unity: HoloLens2GetStartedApp

Siga las secciones principales del paso en secuencia, a continuación.

Acerca de HoloLens 2, Unity, Mixed Reality Feature Tool, Mixed Reality Toolkit y el complemento WebView

Al combinar HoloLens 2, Unity, Mixed Reality Toolkit y el complemento WebView para Unity, puede crear experiencias inmersivas de realidad mixta que integren sin problemas contenido web.

HoloLens 2

HoloLens 2 es un dispositivo holográfico innovador y sin ataduras, que ofrece una experiencia de realidad mixta envolvente y manos libres. HoloLens 2 superpone sin problemas la información digital en el mundo real, representando hologramas de alta definición que permanecen en su lugar y responden de forma natural a la interacción.

Puede usar el motor de juegos de Unity y Visual Studio para crear el proyecto de HoloLens 2.

Unidad

Unity, un motor de juegos versátil, es una opción popular para crear aplicaciones 3D, incluidas experiencias de realidad mixta para dispositivos HoloLens 2, debido a sus amplias características y funcionalidades sólidas para realidad aumentada (AR), realidad virtual (VR) y realidad mixta (MR).

Herramienta de características de Mixed Reality (MRFT)

La herramienta de características de Mixed Reality (MRFT) es una nueva manera de que los desarrolladores detecten, actualicen y agreguen paquetes de características de realidad mixta a proyectos de Unity. Puede buscar paquetes por nombre o categoría, ver sus dependencias e incluso ver los cambios propuestos en el archivo de manifiesto de los proyectos antes de la importación. Un archivo de manifiesto es un archivo JSON que define todos los paquetes del proyecto. Una vez que haya validado los paquetes que se incluirán, la herramienta de características de Mixed Reality los descargará automáticamente en el proyecto de Unity seleccionado. En esta guía se usará MRFT para instalar el kit de herramientas de Mixed Reality y el complemento WebView de Microsoft Mixed Reality para Unity.

kit de herramientas de Mixed Reality (MRTK)

El kit de herramientas de Mixed Reality (MRTK) es un proyecto de código abierto basado en Microsoft que acelera el desarrollo de aplicaciones de realidad mixta en Unity proporcionando componentes y características esenciales para desarrollar experiencias de realidad mixta. MRTK proporciona una colección de scripts, componentes y prefabs diseñados específicamente para ayudarle a crear experiencias de realidad mixta intuitivas y eficaces en dispositivos HoloLens 2.

Complemento WebView de Microsoft Mixed Reality para Unity

El complemento Microsoft Mixed Reality WebView para Unity permite la integración de la funcionalidad WebView2 en la aplicación de HoloLens 2. Este complemento WebView para Unity simplifica la integración de la funcionalidad WebView2 en la aplicación de HoloLens 2 ajustando el control WebView2, controlando automáticamente la representación y dirigiendo automáticamente la entrada al control WebView2.

Este complemento también administra la interoperabilidad entre Unity y WebView2, lo que permite la comunicación entre JavaScript y Unity a través de mensajes y eventos.

En Unity, el complemento WebView de Microsoft Mixed Reality para Unity se puede instalar mediante la herramienta de características de Mixed Reality.

Paso 1: Instalación de Visual Studio

En este tutorial se supone que tiene Unity 2021.3 LTS o posterior y Visual Studio 2019, versión 16.9 o posterior instalada. No se admite Visual Studio 2017. En este paso comenzaremos configurando el entorno de Visual Studio para el desarrollo de HoloLens 2, siga la guía de instalación de herramientas de Mixed Reality. En este artículo se le guía por la instalación y configuración de las herramientas necesarias, como Visual Studio y la carga de trabajo de desarrollo de Plataforma universal de Windows.

Configure también el entorno de desarrollo para WebView2 siguiendo los pasos descritos en Configuración del entorno de desarrollo para WebView2.

Una vez que haya completado la instalación, vuelva a esta página y continúe con los pasos siguientes para instalar Unity.

Paso 2: Instalación de Unity para el desarrollo de HoloLens 2

Antes de empezar a desarrollar una aplicación de HoloLens 2 con WebView2, deberá instalar Unity. Siga los pasos descritos en Elección de una versión de Unity y un complemento XR para completar la instalación del conjunto de herramientas necesario para compilar aplicaciones de realidad mixta.

Paso 3: Configuración del proyecto de Unity para el desarrollo de Mixed Reality

Una vez instaladas las herramientas, estará listo para crear y configurar el proyecto. La manera más fácil de empezar a trabajar con el desarrollo de HoloLens 2 es usar Mixed Reality Toolkit en el proyecto.

La Mixed Reality Feature Tool simplifica el proceso de detección, instalación y administración de características de realidad mixta, incluidos el kit de herramientas de Mixed Reality y los paquetes para el proyecto de Unity. Para obtener más instrucciones sobre cómo instalar la herramienta de características de Mixed Reality, consulte Bienvenido a la herramienta de características de Mixed Reality.

En primer lugar, descargue la herramienta de características Mixed Reality del Centro de descarga de Microsoft.
Ejecute el ejecutable descargado Mixed Reality Feature Tool y siga las indicaciones para instalar el kit de herramientas de Mixed Reality y los paquetes adicionales necesarios para el desarrollo de HoloLens 2.

La herramienta de características Mixed Reality permite seleccionar e instalar las versiones adecuadas del kit de herramientas de Mixed Reality, junto con otras características de realidad mixta, directamente en el proyecto de Unity.

Una vez que haya usado la herramienta de características de Mixed Reality para instalar el kit de herramientas de Mixed Reality, los recursos y los objetos prefabricados del kit de herramientas aparecerán en el proyecto de Unity. El kit de herramientas de Mixed Reality le guiará a través de la configuración del complemento Open XR para el proyecto.

Para ver un tutorial detallado paso a paso sobre cómo configurar el proyecto de Unity, consulte Configuración de un nuevo proyecto de OpenXR con MRTK.

Paso 4: Instalación del complemento WebView para Unity mediante la herramienta de características de Mixed Reality

En este paso, como se ha indicado anteriormente, usará la herramienta de características de Mixed Reality para instalar el complemento Microsoft Mixed Reality WebView para Unity. Esto instalará la versión específica del paquete NuGet WebView2 compatible con HoloLens 2.

Inicie la herramienta de características Mixed Reality (que instaló anteriormente). Se abre la página Inicio de la herramienta de características de Mixed Reality para Unity, que contiene opciones para configurar la configuración y ver la documentación:
Haga clic en el botón de engranaje. Se abre el panel Configuración .
Haga clic en la pestaña Característica y, a continuación, asegúrese de que la casilla Mostrar versiones preliminares esté seleccionada:
Haga clic en el botón Aceptar para volver a la página de inicio.
Haga clic en el botón Inicio para empezar a detectar paquetes de características.
Apunte la herramienta de características de Mixed Reality al proyecto de Unity. Para ello, haga clic en el botón Examinar para la carpeta del proyecto (...) situado a la derecha del campo Ruta de acceso del proyecto:
En el cuadro de diálogo de selección de archivos, seleccione la carpeta del proyecto de Unity y haga clic en el botón Abrir .
En el cuadro de diálogo Seleccionar proyecto , haga clic en el botón Detectar características .
En la página Detectar características, expanda la sección Otras características y, a continuación, active la casilla Microsoft Mixed Reality WebView:

Esto marca el complemento WebView para Unity para la instalación. En la lista desplegable Versión , de forma predeterminada, se selecciona la versión más reciente del complemento.
Haga clic en el botón Obtener características . De este modo, se descargan los paquetes necesarios.
Una vez descargados los paquetes, haga clic en el botón Importar :
En la página Revisar y aprobar , inspeccione las modificaciones que se realizarán en el archivo del proyecto manifest.json e inspeccione la lista de archivos (como .tgz paquetes) que se copiarán en el proyecto:
Haga clic en el botón Aprobar para finalizar los cambios.
En el proyecto de Unity, en la carpeta Activos del proyecto, inspeccione el objeto prefabricado WebView.

El complemento WebView de Microsoft Mixed Reality para Unity ya está instalado e importado. Continúe con el siguiente paso a continuación.

Para obtener más información, vea Bienvenido a la herramienta de características de Mixed Reality.

Paso 5: Configuración del objeto prefabricado de WebView en la escena de Unity

Ahora que el complemento WebView para Unity está instalado e importado, configure el objeto prefabricado de WebView en la escena de Unity, como se indica a continuación:

En el Editor de Unity, vaya a la ventana Proyecto y, a continuación, busque el objeto prefabricado WebView. Para ello, vaya a Paquetes>de Microsoft Mixed Reality WebView (versión preliminar)>Prefab en tiempo de ejecución>.
Arrastre el objeto prefabricado WebView a la escena.
Con el objeto prefabricado WebView seleccionado en la ventana Jerarquía , muévalo a una ubicación inicial adecuada dentro de la escena (por ejemplo, en el MixedRealitySceneContent nodo), asegurándose de que está en la vista de la cámara predeterminada.
En la ventana Inspector , puede cambiar la dirección URL inicial que carga el objeto prefabricado de WebView. Para ello, busque el cuadro de texto Dirección URL actual y escriba la dirección URL deseada. De forma predeterminada, el objeto prefab carga https://www.microsoft.com:

Paso 6: Prueba del proyecto

Ahora que ha agregado el complemento WebView a la escena, es un buen momento para probar el proyecto.

Para probar el proyecto directamente en el editor de Unity, haga clic en el botón Reproducir :
Para probar el proyecto en el dispositivo real, siga los pasos descritos en Compilación e implementación en HoloLens.

A continuación, continúe con los pasos siguientes.

Paso 7: Ampliación de la funcionalidad WebView2

Aunque el objeto prefab expone solo una sola propiedad, hay funcionalidad adicional expuesta en el WebView script. Echemos un vistazo a la exposición de algunas de estas funciones en nuestro proyecto. En primer lugar, inspeccione el WebView script para obtener una idea de lo que está disponible.

Sugerencia

Para ver el contenido de un script en el editor de código predeterminado, haga doble clic en el nombre del script en la ventana Inspector .

Ahora que ha revisado el WebView código, ampliaremos la funcionalidad del ejemplo. En el resto de este paso, agregaremos algunas funciones básicas para que el usuario tenga un botón Atrás , un botón Ir y un campo de texto para navegar a una dirección URL personalizada.

Agregar el campo de entrada y los botones

Modifique la jerarquía de la escena de la siguiente manera:
1. En MixedRealitySceneContent, agregue un nuevo componente de entrada (haga clic con el botón derecho en > Campo de entrada de la interfaz> de usuario- TextMeshPro). Esto agrega automáticamente un elemento primario Canvas para el componente.
2. En el nuevo Canvas, agregue dos nuevos Button componentes (haga clic con el botón derecho en > Botón de interfaz> de usuario- TextMeshPro).
3. Reordene el WebView componente para convertirlo en un elemento secundario del Canvas componente:
Actualice las propiedades de Canvas seleccionando canvas en el panel Jerarquía y, a continuación, realizando los siguientes cambios en el panel Inspector :
1. Cambie Width y Height a 600, 400 respectivamente.
2. Cambie Escala de X, Y y Z a 0,001, 0,001, 0,001:
Actualice las propiedades del campo de entrada seleccionándolo en el panel Jerarquía y, a continuación, realizando los siguientes cambios en el panel Inspector :
1. Cambie el nombre a "AddressField (TMP)"
2. Cambie Pos X, Pos Y, Pos Z a -2, 178, -5, respectivamente.
3. Cambie Width (Ancho ) y Height (Alto ) a 390 y 30 respectivamente:
Para actualizar las propiedades del primer botón, selecciónelo en el panel Jerarquía y, a continuación, realice los siguientes cambios en el panel Inspector :
1. Cambie el nombre a "Botón Atrás"
2. Cambie Pos X, Pos Y, Pos Z a -248, 178, -5, respectivamente.
3. Cambie Ancho y Alto a 75, 30 respectivamente:
Actualice las propiedades del segundo botón seleccionándolo en el panel Jerarquía y, a continuación, realizando los siguientes cambios en el panel Inspector :
1. Cambie el nombre a "Go Button" (Botón Go)
2. Cambie Pos X, Pos Y, Pos Z a 242, 178, -5, respectivamente.
3. Cambie Ancho y Alto a 75, 30 respectivamente:
Para actualizar las propiedades de WebView, selecciónelas en el panel Jerarquía y, a continuación, realice los siguientes cambios en el panel Inspector :
1. Cambie la posición>X, Y, Z a 0, -16 y -5, respectivamente.
2. Cambie Escala>X, Y, Z a 570, 340 y 1 respectivamente:
Agregue una imagen de fondo al lienzo:
1. Seleccione el lienzo en el panel Jerarquía .
2. Haga clic en el botón Agregar componente en la parte inferior del panel Inspector .
3. Escriba Imagen y, a continuación, seleccione el resultado superior en la lista.
4. Haga clic en el cuadro Color de la imagen y, a continuación, elija un color de fondo. En nuestro ejemplo, elegimos un color gris. (Esto es simplemente para mostrar cierto contraste entre los distintos controles del lienzo).
En el panel Jerarquía , en Botón Atrás, seleccione Texto (TMP).. A continuación, en el panel Inspector , cambie la entrada de texto a Atrás:
Repita el proceso anterior para el botón Go y sustituya Go como texto.

Ahora debería tener una escena similar a la siguiente:

Agregar código para enlazar los botones

Ahora que tenemos nuestra interfaz de usuario diseñada, ahora crearemos el código para enlazar los botones. Para ello, crearemos un nuevo script que derive de Microsoft.MixedReality.WebView.

En la ventana Inspector de WebView, haga clic en Agregar componente, seleccione Nuevo script, escriba WebViewBrowsery, a continuación, haga clic en Crear y agregar. El nuevo componente se agrega a la ventana Inspector .
En la ventana Inspector , haga doble clic en el WebViewBrowser script para editarlo.

Reemplace el contenido de ese archivo por el código siguiente:

using Microsoft.MixedReality.WebView;
using UnityEngine.UI;
using UnityEngine;
using TMPro;
using System;

public class WebViewBrowser : MonoBehaviour
{
   // Declare UI elements: Back button, Go button, and URL input field
   public Button BackButton;
   public Button GoButton;
   public TMP_InputField URLField;

   private void Start()
   {
      // Get the WebView component attached to the game object
      var webViewComponent = gameObject.GetComponent<WebView>();
      webViewComponent.GetWebViewWhenReady((IWebView webView) =>
      {
            // If the WebView supports browser history, enable the Back button
            if (webView is IWithBrowserHistory history)
            {
               // Add an event listener for the Back button to navigate back in history
               BackButton.onClick.AddListener(() => history.GoBack());

               // Update the Back button's enabled state based on whether there's any history to go back to
               history.CanGoBackUpdated += CanGoBack;
            }

            // Add an event listener for the Go button to load the URL that was entered in the input field
            GoButton.onClick.AddListener(() => webView.Load(new Uri(URLField.text)));

            // Subscribe to the Navigated event to update the URL input field whenever a navigation occurs
            webView.Navigated += OnNavigated;

            // Set the initial value of the URL input field to the current URL of the WebView
            if (webView.Page != null)
            {
               URLField.text = webView.Page.AbsoluteUri;
            }
      });
   }

   // Update the URL input field with the new path after navigation
   private void OnNavigated(string path)
   {
      URLField.text = path;
   }

   // Enable or disable the Back button based on whether there's any history to go back to
   private void CanGoBack(bool value)
   {
      BackButton.enabled = value;
   }
}

Conecte la interfaz de usuario GameObjects al WebViewBrowser código que acabamos de escribir:
1. Seleccione WebViewBrowser.
2. Arrastre el botón Atrás desde el panel Jerarquía hasta el campo Variable Botón atrás del explorador WebView en el inspector.
3. Arrastre Go Button (Botón Go ) desde el panel Hierarchy (Jerarquía) hasta el campo Go Button variable (Go Button variable) del explorador WebView en el inspector:
Ahora puede probar la escena en el Editor de Unity. Con todo conectado en la escena, debe ser capaz de comprobar que todo funciona según lo esperado. Pruebe a probar la escena escribiendo una nueva dirección URL en el AddressField cuadro de texto (debe ser una dirección URL completa, incluido el protocolo) y, a continuación, presione el botón Ir . Asegúrese de que el botón Atrás también funciona.

A veces puede resultar útil depurar la aplicación que se ejecuta en HoloLens y los pasos para hacerlo son ligeramente diferentes de la depuración estándar en Visual Studio. Para obtener más información sobre cómo configurar y conectarse a la aplicación que se ejecuta en HoloLens o dentro del editor de Unity, consulte Depuración administrada con Unity.

Vea también:

Referencia de api de WebView2
Referencia de API para Mixed Reality complemento WebView: para HoloLens 2 en el complemento WebView2 Unity.

Continúe con los pasos siguientes.

Paso 8: Información sobre eventos e interacciones de WebView2 en Unity

El complemento WebView de Microsoft Mixed Reality para Unity proporciona eventos para trabajar con la vista web.

Un evento importante es IWithPostMessage.MessageReceived, que se genera cuando se envía un mensaje desde la vista web a la aplicación de Unity. El MessageReceived evento se define en la Microsoft.MixedReality.WebView.IWithPostMessage interfaz.

IWithPostMessage también define el PostMessage() método , que se puede usar para enviar un mensaje desde la aplicación de Unity a la vista web.

Este es un ejemplo de cómo usar estos eventos y métodos para trabajar con la vista web:

using Microsoft.MixedReality.WebView;

public class WebViewExample : MonoBehaviour, IWithPostMessage
{
    private void Start()
    {
        var webViewComponent = gameObject.GetComponent<WebView>();

        if (Url != string.Empty)
        {
            Debug.Log("Loading URL: " + Url);
            webViewComponent.Load(new Uri(Url));
        }

        webViewComponent.GetWebViewWhenReady((IWebView webView) =>
        {
            // Add event listeners for WebView2 events
            ((IWithPostMessage)webView).MessageReceived += OnMessageReceived;
        });
    }

    // Handler for WebView2 OnPostMessage event
    void OnMessageReceived(string message)
    {
        Debug.Log("WebView2 message received: " + message);
    }
}

Consideraciones adicionales para WebView2 en HoloLens 2

Limitaciones y problemas conocidos

Al desarrollar una aplicación de HoloLens 2 Unity con WebView2, tenga en cuenta algunas limitaciones y problemas conocidos:

Elementos emergentes: los elementos emergentes no funcionan bien dentro de WebView2 dentro de las aplicaciones de Unity en HoloLens 2, pero funcionan bien en aplicaciones XAML 2D en el dispositivo. Evite elementos emergentes y use técnicas alternativas o diseños de interfaz de usuario, como elementos emergentes personalizados dentro de WebView mediante HTML, CSS y JavaScript.
Nuevas ventanas: las instancias de WebView2 en HoloLens 2 navegar por la misma ventana de forma predeterminada, a diferencia de en Escritorio. Siga este comportamiento predeterminado para mejorar la experiencia del usuario. Además, no se puede iniciar la ventana DevTools.
Autenticación empresarial: el uso automático de tokens de nivel de sistema operativo Sign-On único (SSO) no se admite actualmente en WebView2 en HoloLens 2. Los usuarios todavía pueden iniciar sesión proporcionando credenciales, excepto en los casos que requieren autenticación de nivel de dispositivo. El almacenamiento de cookies funciona según lo esperado.
Interacciones del usuario: a diferencia de las pizarras nativas HoloLens 2, WebView2 se interactúa mejor con mediante el uso de rayos de mano de interacción lejana. Es posible que no se admitan interacciones táctiles para deslizar y desplazarse.
Rendimiento: los sitios web complejos con un uso intensivo de JavaScript o la representación avanzada pueden afectar al rendimiento del sistema o a la velocidad de fotogramas de la aplicación host. Para obtener recomendaciones y limitaciones generales relacionadas con el rendimiento, consulte Descripción del rendimiento de la realidad mixta en la documentación de realidad mixta. Consulte también Optimización del rendimiento, a continuación.

Optimización del rendimiento

La optimización del rendimiento de WebView2 en la aplicación HoloLens 2 Unity es fundamental para una experiencia de usuario fluida. Estas son algunas recomendaciones:

Limitar el número de instancias de WebView2: se recomienda usar solo una instancia de WebView2 dentro de una aplicación de Unity. Reutilice la misma instancia o desintega y cree una nueva según sea necesario. Tenga en cuenta que es posible que la eliminación del objeto prefabricado WebView de la escena no destruya la instancia de WebView2 subyacente. Debes llamar al Destroy() método en el objeto de juego para destruirlo correctamente.
Aplicar técnicas generales de optimización de Unity: para optimizar el rendimiento de WebView2, use los enfoques de optimización estándar de Unity, como la eliminación de oclusión o la limitación de la velocidad de actualización. Para obtener más información, consulte Recomendaciones de rendimiento para Unity en la documentación de mixed reality.
Generar perfiles y supervisar el rendimiento de WebView2: hay varias maneras de generar perfiles del rendimiento de una aplicación de HoloLens 2 Unity:
- Generador de perfiles de Unity: una herramienta integrada en Unity que le permite medir y optimizar el rendimiento de la aplicación en varias plataformas, incluidos HoloLens 2.
- Visual Profiler: una característica del kit de herramientas de Mixed Reality que proporciona una vista en la aplicación del rendimiento de la aplicación.
- PIX: una herramienta de optimización y depuración de rendimiento para Windows que también se puede usar para generar perfiles de aplicaciones de Unity en HoloLens 2.

En el paso 7: Ampliación de la funcionalidad WebView2, hemos abordado algunos métodos de navegación. En esta sección, ampliaremos lo que hemos aprendido.

Vea también:

Referencia de api de WebView2
Referencia de API para Mixed Reality complemento WebView: para HoloLens 2 en el complemento WebView2 Unity.

Interfaz IWebView

La IWebView interfaz expone algunos métodos, eventos y propiedades relacionados con la navegación por páginas. La funcionalidad principal que se expone aquí es la capacidad de navegar a una dirección URL determinada mediante Load(Uri url):

public interface IWebView
{
    // Non-navigation methods are removed for clarity.

    event WebView_OnNavigated Navigated;

    Uri Page { get; }

    void Load(Uri url);

    void Reload(bool ignoreCache);
}

Interfaz IWithBrowserHistory

La IWithBrowserHistory interfaz expone algunos métodos y eventos relacionados con la navegación por páginas. Esto permite principalmente a los desarrolladores navegar hacia delante y hacia atrás, como cabría esperar con una experiencia de exploración web típica:

public interface IWithBrowserHistory : IWebView
{
    // Non-navigation methods are removed for clarity.

    event WebView_OnCanGoForwardUpdated CanGoForwardUpdated;

    event WebView_OnCanGoBackUpdated CanGoBackUpdated;

    void GoBack();

    void GoForward();
}

SetVirtualHostNameToFolderMapping y SetVirtualHostMapping

El método CoreWebView2.SetVirtualHostNameToFolderMapping permite la asignación entre un nombre de host virtual y una ruta de acceso de carpeta, lo que hace que sea accesible para los sitios web que usan ese nombre de host. Este método asigna un nombre de dominio local a una carpeta local, de modo que el control WebView2 carga contenido de la carpeta local especificada al intentar acceder a un recurso para ese dominio.

El complemento WebView para Unity expone esta funcionalidad a través de la IWithVirtualHost interfaz, que tiene un único método, SetVirtualHostMapping(string hostName, string folderPath):

public interface IWithVirtualHost : IWebView
{
    void SetVirtualHostMapping(string hostName, string folderPath);
}

Para usar el SetVirtualHostMapping método , establezca en hostName cualquier cadena de cumplimiento de dirección URL válida, como webview2.sample. folderPath puede ser una ruta de acceso absoluta o una ruta de acceso relativa al directorio de trabajo de la aplicación, como Assets\Html.

Suponiendo que tenemos un archivo HTML llamado demo.html en Assets\Html, el siguiente fragmento de código muestra la carga demo.html mediante el complemento WebView para Unity:

using Microsoft.MixedReality.WebView;

public class WebViewExample : MonoBehaviour
{
    private void Start()
    {
        var webViewComponent = gameObject.GetComponent<WebView>();

        webViewComponent.GetWebViewWhenReady((IWebView webView) =>
        {
            ((IWithVirtualHost)webView).SetVirtualHostMapping("webview2.sample", "Assets\\Html");

            // Navigate to our local content.
            webViewComponent.Load(new Uri("http://webview2.sample/demo.html"));
        });
    }
}

Input

Hay varias maneras de controlar la entrada en Unity para aplicaciones de realidad mixta.

Introducción a la entrada: MRTK2, recomendado para aplicaciones de Mixed Reality Toolkit 2.8.
Entrada : MRTK3: se recomienda para las aplicaciones de Mixed Reality Toolkit 3.
Sistema de entrada de Unity

Independientemente del sistema de entrada usado en la aplicación de Unity, se requiere código de interoperabilidad entre los distintos eventos de entrada de la aplicación y el complemento WebView para Unity. Esto significa traducir esos eventos (como eventos pointer) en un WebViewMouseEventData objeto y, a continuación, reenviar esos eventos al complemento a través de la IWithMouseEvent interfaz:

public interface IWithMouseEvents : IWithInputEvents
{
    void MouseEvent(WebViewMouseEventData mouseEvent);
}

WebView2 no es consciente del sistema de entrada de Unity y probablemente tenga un sistema de coordenadas diferente al de la escena de Unity. Como resultado, cuando hay un evento de puntero hacia abajo, sus coordenadas deben traducirse al sistema de coordenadas del control WebView2. Además, el evento de puntero a abajo debe convertirse en un tipo de evento adecuado WebViewMouseEventData .

Ejemplo simple:

using Microsoft.MixedReality.WebView;

public class WebViewExample : MonoBehaviour, IPointerDownHandler
{
    // WebView setup steps skipped for brevity

    public void OnPointerDown(PointerEventData eventData)
    {
        IWithMouseEvents mouseEventsWebView = webView as IWithMouseEvents;

        // Call hypothetical function which converts the event's x, y into the WebView2's coordinate space.
        var hitCoord = ConvertToWebViewSpace(eventData.position.x, eventData.position.y);

        WebViewMouseEventData mouseEvent = new WebViewMouseEventData
        {
            X = hitCoord.x,
            Y = hitCoord.y,
            Type = WebViewMouseEventData.EventType.MouseDown,
            Button = WebViewMouseEventData.MouseButton.ButtonLeft,
            TertiaryAxisDeviceType = WebViewMouseEventData.TertiaryAxisDevice.PointingDevice
        };

        // Propagate the event to the WebView plugin.
        mouseEventsWebView.MouseEvent(mouseEvent);
    }
}

En el ejemplo anterior, los eventos de puntero a abajo se convierten en WebViewMouseEventData objetos y se reenvía al complemento WebView para Unity. Básicamente se convierte en un evento de mouse-down. Para crear eventos de clic del mouse, los eventos de puntero hacia arriba deben controlarse de forma similar.

En el ejemplo anterior, ConvertToWebViewSpace no se implementa intencionadamente.

Vea también

Introducción a WebView2 en aplicaciones winUI 2 (UWP)
Referencia de api de WebView2
Referencia de API para Mixed Reality complemento WebView: para HoloLens 2 en el complemento WebView2 Unity.

Compartir a través de