Share via

Introdução ao WebView2 em HoloLens 2 aplicativos do Unity (versão prévia)

  • Artigo

Este tutorial é para desenvolvedores que usam o WebView2 em aplicativos Imersivos HoloLens 2 Unity.

O WebView2 no HoloLens 2 e o plug-in do WebView para Unity estão em Versão Prévia e estão sujeitos a alterações antes da disponibilidade geral.

O WebView2 só tem suporte em dispositivos HoloLens 2 que executam a atualização Windows 11. Para obter mais informações, consulte Atualizar HoloLens 2.

Para aplicativos 2D habilitados para WebView2 no HoloLens 2, consulte Introdução ao WebView2 em aplicativos WinUI 2 (UWP).

Neste tutorial, você:

  • Configure suas ferramentas de desenvolvimento para criar HoloLens 2 aplicativos do Unity que usam o WebView2 para exibir conteúdo da Web.
  • Instale o kit de ferramentas Realidade Misturada usando a Ferramenta de Recursos Realidade Misturada.
  • Crie um projeto inicial do Unity para HoloLens 2 desenvolvimento.
  • Adicione o plug-in do Microsoft Realidade Misturada WebView para o Unity usando a Ferramenta de Recursos Realidade Misturada.
  • Configure um prefab do WebView que exibe o conteúdo da página da Web em seu aplicativo HoloLens 2.
  • Saiba mais sobre os conceitos e interações do WebView2 no Unity.

Projeto concluído

Uma versão concluída deste projeto Introdução está disponível no repositório WebView2Samples. Você pode usar o projeto concluído (do repositório ou de seguir as etapas abaixo) como uma linha de base para adicionar mais funcionalidade WebView2 e outros recursos ao seu aplicativo HoloLens 2 Unity.

Uma versão concluída deste projeto tutorial está disponível no repositório WebView2Samples :

  • Nome da amostra: HoloLens2_GettingStarted
  • Diretório de repositório: HoloLens2_GettingStarted
  • Pasta do projeto unity: HoloLens2GetStartedApp

Siga as principais seções etapa na sequência, abaixo.

Sobre HoloLens 2, Unity, Realidade Misturada Feature Tool, Realidade Misturada Toolkit e o plug-in do WebView

Ao combinar HoloLens 2, o Unity, o Realidade Misturada Toolkit e o plug-in do WebView para o Unity, você pode criar experiências imersivas de realidade misturada que integram perfeitamente o conteúdo da Web.

HoloLens 2

HoloLens 2 é um dispositivo holográfico inovador e sem amarras, oferecendo uma experiência de realidade misturada prática e imersiva. HoloLens 2 sobrepõe perfeitamente informações digitais ao mundo real, renderizando hologramas de alta definição que permanecem no local e respondem naturalmente à interação.

Você pode usar o mecanismo de jogo do Unity e o Visual Studio para criar seu projeto HoloLens 2.

Unidade

O Unity, um mecanismo de jogo versátil, é uma opção popular para criar aplicativos 3D, incluindo experiências de realidade misturada para dispositivos HoloLens 2, devido a seus amplos recursos e recursos robustos para AR (realidade aumentada), realidade virtual (VR) e realidade misturada (MR).

Realidade Misturada Ferramenta de Recursos (MRFT)

O MRFT (Ferramenta de Recursos Realidade Misturada) é uma nova maneira de os desenvolvedores descobrirem, atualizarem e adicionarem pacotes de recursos de realidade misturada em projetos do Unity. Você pode pesquisar pacotes por nome ou categoria, ver suas dependências e até mesmo exibir alterações propostas no arquivo de manifesto de seus projetos antes de importar. Um arquivo de manifesto é um arquivo JSON que define todos os pacotes do projeto. Depois de validar os pacotes a serem incluídos, a ferramenta Realidade Misturada Recurso irá baixá-los automaticamente em seu projeto do Unity selecionado. Este guia usará o MRFT para instalar o kit de ferramentas Realidade Misturada e o plug-in do Microsoft Realidade Misturada WebView para o Unity.

Realidade Misturada Toolkit (MRTK)

O MRTK (Kit de Ferramentas Realidade Misturada) é um projeto de software livre controlado pela Microsoft que acelera o desenvolvimento de aplicativos de realidade misturada no Unity, fornecendo componentes e recursos essenciais para desenvolver experiências de realidade misturada. O MRTK fornece uma coleção de scripts, componentes e pré-fabricados especificamente projetados para ajudar você a criar experiências de realidade misturada performantes e intuitivas em dispositivos HoloLens 2.

O plug-in do Microsoft Realidade Misturada WebView para Unity

O plug-in do Microsoft Realidade Misturada WebView para Unity permite a integração da funcionalidade do WebView2 ao seu aplicativo HoloLens 2. Este plug-in do WebView para Unity simplifica a integração da funcionalidade WebView2 ao seu aplicativo HoloLens 2, envolvendo o controle WebView2, manipulando automaticamente a renderização e direcionando automaticamente a entrada para o controle WebView2.

Esse plug-in também gerencia o interoperabilidade entre o Unity e o WebView2, habilitando a comunicação entre JavaScript e Unity por meio de mensagens e eventos.

No Unity, o plug-in do Microsoft Realidade Misturada WebView para Unity pode ser instalado usando a Ferramenta de Recursos Realidade Misturada.

Etapa 1 – Instalar o Visual Studio

Este tutorial pressupõe que você tenha o Unity 2021.3 LTS ou posterior e o Visual Studio 2019 versão 16.9 ou posterior instalado. Não há suporte para o Visual Studio 2017. Nesta etapa, começaremos configurando seu ambiente do Visual Studio para HoloLens 2 desenvolvimento, siga o guia de instalação Realidade Misturada ferramentas. Esse artigo orienta você a instalar e configurar as ferramentas necessárias, incluindo o Visual Studio e a carga de trabalho de desenvolvimento Plataforma Universal do Windows.

Configure também seu ambiente de desenvolvimento para WebView2, seguindo as etapas em Configurar seu ambiente de desenvolvimento para WebView2.

Depois de concluir a instalação, retorne a esta página e continue com as próximas etapas para instalar o Unity.

Etapa 2 – Instalar o Unity para HoloLens 2 desenvolvimento

Antes de começar a desenvolver um aplicativo HoloLens 2 com o WebView2, você precisará instalar o Unity. Siga as etapas em Escolher uma versão do Unity e um plug-in XR para concluir a instalação do conjunto de ferramentas necessário para criar aplicativos de realidade misturada.

Etapa 3 – Configurar o projeto do Unity para Realidade Misturada desenvolvimento

Depois de instalar suas ferramentas, você estará pronto para criar e configurar seu projeto. A maneira mais fácil de começar com HoloLens 2 desenvolvimento é usar o kit de ferramentas Realidade Misturada em seu projeto.

O Realidade Misturada Feature Tool simplifica o processo de descoberta, instalação e gerenciamento de recursos de realidade misturada, incluindo o kit de ferramentas Realidade Misturada e pacotes para seu projeto do Unity. Para obter mais diretrizes sobre como instalar a Ferramenta de Recursos Realidade Misturada, consulte Bem-vindo à Ferramenta de Recursos do Realidade Misturada.

  1. Primeiro, baixe a ferramenta de recursos Realidade Misturada do Centro de Download da Microsoft.

  2. Execute o executável Realidade Misturada Ferramenta de Recursos baixado e siga os prompts para instalar o kit de ferramentas Realidade Misturada e quaisquer pacotes necessários adicionais para HoloLens 2 desenvolvimento.

    A Ferramenta de Recursos Realidade Misturada permite que você selecione e instale as versões apropriadas do kit de ferramentas Realidade Misturada, juntamente com outros recursos de realidade misturada, diretamente em seu projeto do Unity.

Depois de usar o Realidade Misturada Ferramenta de Recursos para instalar o kit de ferramentas Realidade Misturada, os ativos e os pré-fabricados do kit de ferramentas serão exibidos em seu projeto do Unity. O kit de ferramentas Realidade Misturada orientará você por meio da configuração do plug-in Open XR para seu projeto.

Para obter um passo a passo detalhado da configuração do projeto do Unity, consulte Configurar um novo projeto OpenXR com o MRTK.

Etapa 4 – Instalar o plug-in do WebView para o Unity usando a Ferramenta de Recursos Realidade Misturada

Nesta etapa, conforme acima, você usará o Realidade Misturada Ferramenta de Recursos para instalar o plug-in do Microsoft Realidade Misturada WebView para o Unity. Isso instalará a versão específica do pacote NuGet do WebView2 compatível com HoloLens 2.

  1. Inicie o Realidade Misturada Feature Tool (que você instalou acima). A página Iniciar da Ferramenta de Recursos Realidade Misturada para Unity é aberta, contendo opções para configurar configurações e exibir a documentação:

    O botão Configurar Configurações na Ferramenta de Recursos Realidade Misturada

  2. Clique no botão engrenagem. O painel Configurações é aberto.

  3. Clique na guia Recurso e verifique se a caixa de seleção Mostrar versões prévias está selecionada:

    a guia Recurso em Configurações para a Ferramenta de Recursos Realidade Misturada

  4. Clique no botão Ok para retornar à página inicial.

  5. Clique no botão Iniciar para começar a descobrir pacotes de recursos.

  6. Aponte a Ferramenta de Recursos Realidade Misturada para seu projeto do Unity. Para fazer isso, clique no botão Procurar a pasta do projeto (...) à direita do campo Caminho do Projeto :

    Selecione o projeto do Unity na Ferramenta de Recursos Realidade Misturada

  7. Na caixa de diálogo seleção de arquivos, selecione sua pasta de projeto do Unity e clique no botão Abrir .

  8. Na caixa de diálogo Selecionar projeto , clique no botão Descobrir Recursos .

  9. Na página Descobrir Recursos, expanda a seção Outros recursos e selecione a caixa de seleção Microsoft Realidade Misturada WebView:

    O painel Descobrir Recursos na Ferramenta de Recursos Realidade Misturada

    Isso marca o plug-in do WebView para o Unity para instalação. Na lista suspensa Versão suspensa, por padrão, a versão mais recente do plug-in é selecionada.

  10. Clique no botão Obter Recursos . Isso baixa os pacotes necessários.

  11. Depois que os pacotes forem baixados, clique no botão Importar :

    O painel Importar Recursos na Ferramenta de Recursos Realidade Misturada

  12. Na página Revisar e Aprovar, inspecione as modificações que serão feitas no arquivo do projeto manifest.json e inspecione a lista de arquivos (como .tgz pacotes) que serão copiados em seu projeto:

    O painel Revisar e Aprovar na Ferramenta de Recursos do Realidade Misturada

  13. Clique no botão Aprovar para finalizar as alterações.

  14. No projeto do Unity, na pasta Ativos do projeto, inspecione o prefab do WebView.

O plug-in do Microsoft Realidade Misturada WebView para Unity agora está instalado e importado. Continue com a próxima etapa abaixo.

Para obter mais informações, consulte Bem-vindo à Ferramenta de Recursos do Realidade Misturada.

Etapa 5 – Configurar o prefab do WebView na cena do Unity

Agora que o plug-in do WebView para Unity está instalado e importado, configure o prefab do WebView em sua cena do Unity, da seguinte maneira:

  1. No Editor do Unity, navegue até a janela Projeto e, em seguida, localize o prefab do WebView indo para Pacotes>Microsoft Realidade Misturada WebView (Versão Prévia)>Pré-fabricadodo Runtime>.

  2. Arraste o prefab do WebView para sua cena.

  3. Com o prefab do WebView selecionado na janela Hierarquia , mova-o para um local inicial adequado dentro da cena (como no MixedRealitySceneContent nó), certificando-se de que ele esteja em exibição da câmera padrão.

  4. Na janela Inspetor , você pode alterar a URL inicial carregada pelo prefab do WebView. Para fazer isso, localize a caixa de texto URL atual e insira a URL desejada. Por padrão, o pré-fabricado carrega https://www.microsoft.com:

    O campo de entrada da URL atual para o pré-fabricado do WebView no Inspetor do Unity

Etapa 6 – Testar o projeto

Agora que você adicionou o plug-in do WebView à cena, é uma boa hora para testar seu projeto.

  1. Para testar o projeto diretamente no editor do Unity, clique no botão Reproduzir :

    Modo de reprodução do editor inicial

  2. Para testar o projeto no dispositivo real, siga as etapas em Compilar e implantar no HoloLens.

Em seguida, continue com as próximas etapas abaixo.

Etapa 7 – Estendendo a funcionalidade do WebView2

Embora o prefab exponha apenas uma única propriedade, há uma funcionalidade adicional exposta no WebView script. Vamos dar uma olhada em expor algumas dessas funcionalidades em nosso projeto. Primeiro, inspecione o WebView script para ter uma ideia do que está disponível.

Dica

Para exibir o conteúdo de um script no editor de código padrão, clique duas vezes no nome do script na janela Inspetor .

Agora que você revisou o WebView código, vamos estender a funcionalidade do exemplo. No restante desta etapa, adicionaremos algumas funcionalidades básicas para que o usuário tenha um botão Voltar , um botão Ir e um campo de texto para navegar até uma URL personalizada.

Adicionar o campo de entrada e os botões

  1. Modifique a hierarquia de cena da seguinte maneira:

    1. Em MixedRealitySceneContent, adicione um novo componente de entrada (clique com o botão direito do mouse > no Campo de Entrada da interface> do usuário– TextMeshPro). Isso adiciona automaticamente um pai Canvas para o componente.
    2. No novo Canvas, adicione dois novos Button componentes (clique com o botão direito do mouse >no botão da interface do usuário>– TextMeshPro).
    3. Reordene o WebView componente para torná-lo filho do Canvas componente:

    Hierarquia de cena atualizada com novos componentes no Unity

  2. Atualize as propriedades do Canvas selecionando a Tela no painel Hierarquia e, em seguida, faça as seguintes alterações no painel Inspetor :

    1. Alterar Largura e Altura para 600, 400, respectivamente.
    2. Alterar Escala para X, Y e Z para 0,001, 0,001, 0,001:

    Propriedades atualizadas do Canvas no Inspetor do Unity

  3. Atualize as propriedades do campo de entrada selecionando-as no painel Hierarquia e, em seguida, fazendo as seguintes alterações no painel Inspetor :

    1. Alterar nome para "AddressField (TMP)"
    2. Altere Pos X, Pos Y, Pos Z para -2, 178, -5, respectivamente.
    3. Alterar Largura e Altura para 390, 30, respectivamente:

    Propriedades atualizadas do Campo de Entrada no Inspetor do Unity

  4. Atualize as propriedades do primeiro botão selecionando-as no painel Hierarquia e, em seguida, fazendo as seguintes alterações no painel Inspetor :

    1. Alterar Nome para "Botão voltar"
    2. Altere Pos X, Pos Y, Pos Z para -248, 178, -5, respectivamente.
    3. Alterar Largura e Altura para 75, 30, respectivamente:

    Propriedades atualizadas do Botão De Volta no Inspetor do Unity

  5. Atualize as propriedades do segundo botão selecionando-as no painel Hierarquia e, em seguida, fazendo as seguintes alterações no painel Inspetor :

    1. Alterar Nome para "Botão Ir"
    2. Altere Pos X, Pos Y, Pos Z para 242, 178, -5, respectivamente.
    3. Alterar Largura e Altura para 75, 30, respectivamente:

    Propriedades atualizadas do Botão Go no Inspetor do Unity

  6. Atualize as propriedades do WebView selecionando-as no painel Hierarquia e, em seguida, fazendo as seguintes alterações no painel Inspetor :

    1. Alterar Posição>X, Y, Z para 0, -16, -5, respectivamente.
    2. Alterar Escala>X, Y, Z para 570, 340, 1, respectivamente:

    Propriedades atualizadas do WebView no Inspetor do Unity

  7. Adicione uma imagem em segundo plano à Tela:

    1. Selecione a Tela no painel Hierarquia .
    2. Clique no botão Adicionar Componente na parte inferior do painel Inspetor .
    3. Digite Imagem e selecione o resultado superior na lista.
    4. Clique bem na Cor da imagem e escolha uma cor de fundo. Em nosso exemplo, escolhemos uma cor cinza. (Isso é simplesmente para mostrar algum contraste entre os diferentes controles na tela.)

    Definir a cor de segundo plano da Tela no Inspetor do Unity

  8. No painel Hierarquia , em Botão Voltar, selecione Texto (TMP). Em seguida, no painel Inspetor , altere a entrada de texto para Voltar:

    Alterar o texto do botão para 'Voltar' no Inspetor do Unity

  9. Repita o processo acima para o Botão Ir, substituindo Go como o texto.

    Agora você deve ter uma cena semelhante à seguinte:

    A cena atual no modo de exibição Cena do Unity

Adicionar código para conectar os botões

Agora que temos nossa interface do usuário projetada, agora criaremos o código para conectar os botões. Para fazer isso, criaremos um novo script que deriva de Microsoft.MixedReality.WebView.

  1. Na janela Inspetor para WebView, clique em Adicionar Componente, selecione Novo script, digite WebViewBrowser e clique em Criar e adicionar. Seu novo componente é adicionado à janela Inspetor .

  2. Na janela Inspetor , clique duas vezes no WebViewBrowser script para editar o script.

  3. Substitua o conteúdo desse arquivo pelo seguinte código:

    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;
   }
}

  4. Conecte a interface GameObjects do usuário ao WebViewBrowser código que acabamos de escrever:

    1. Selecione o WebViewBrowser.
    2. Arraste o botão Voltar do painel Hierarquia para o campo variável Botão De Volta para o Navegador WebView no Inspetor.
    3. Arraste o Botão Ir do painel Hierarquia para o campo variável Botão Ir para o Navegador WebView no Inspetor:

    O Prefab do Navegador WebView com variáveis atribuídas no Inspetor do Unity

  5. Agora você pode testar a cena no Editor do Unity. Com tudo conectado em sua cena, você deve ser capaz de verificar se tudo está funcionando conforme o esperado. Tente testar a cena inserindo uma nova URL na AddressField caixa de texto (deve ser uma URL completa, incluindo o protocolo), pressionando o botão Ir . Verifique se o botão Voltar também funciona.

    Às vezes, pode ser útil depurar seu aplicativo em execução em seu HoloLens, e as etapas para isso são ligeiramente diferentes da depuração padrão no Visual Studio. Para obter mais informações sobre como configurar e se conectar ao aplicativo em execução no HoloLens ou dentro do editor do Unity, consulte Depuração gerenciada com o Unity.

Veja também:

Continue com as próximas etapas abaixo.

Etapa 8 – Saiba mais sobre eventos e interações do WebView2 no Unity

O plug-in do Microsoft Realidade Misturada WebView para Unity fornece eventos para trabalhar com a visão da Web.

Um evento importante é IWithPostMessage.MessageReceived, que é gerado quando uma mensagem é enviada da visão da Web para o aplicativo Unity. O MessageReceived evento é definido na Microsoft.MixedReality.WebView.IWithPostMessage interface.

IWithPostMessage também define o PostMessage() método, que pode ser usado para enviar uma mensagem do aplicativo Unity para a webview.

Aqui está um exemplo de como usar esses eventos e métodos para trabalhar com a visão da 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);
    }
}

Considerações adicionais para o WebView2 no HoloLens 2

Limitações e problemas conhecidos

Ao desenvolver um aplicativo HoloLens 2 Unity com o WebView2, esteja ciente de algumas limitações e problemas conhecidos:

  • Pop-ups: pop-ups não funcionam bem no WebView2 dentro de aplicativos do Unity no HoloLens 2, mas funcionam bem em aplicativos XAML 2D no dispositivo. Evite pop-ups e use técnicas alternativas ou designs de interface do usuário, como elementos pop-up personalizados no WebView usando HTML, CSS e JavaScript.

  • Novas janelas: as instâncias do WebView2 no HoloLens 2 navegam na mesma janela por padrão, ao contrário da Área de Trabalho. Siga esse comportamento padrão para obter uma melhor experiência de usuário. Além disso, a janela DevTools não pode ser lançada.

  • Autenticação empresarial: O SSO (Sign-On Único Automático) que aproveita tokens no nível do sistema operacional não tem suporte no WebView2 no HoloLens 2. Os usuários ainda podem entrar fornecendo credenciais, exceto para casos que exigem autenticação no nível do dispositivo. O armazenamento de cookies funciona conforme o esperado.

  • Interações do usuário: ao contrário das HoloLens 2 ardósias nativas, o WebView2 é melhor interagido usando raios de mão de interação distante. As interações touch-to-swipe e scroll podem não ter suporte.

  • Desempenho: sites complexos com uso intenso de JavaScript ou renderização avançada podem afetar o desempenho do sistema ou a taxa de quadros do aplicativo host. Para obter limitações e recomendações gerais relacionadas ao desempenho, consulte Noções básicas sobre o desempenho da realidade misturada na documentação de realidade misturada. Veja também a otimização de desempenho, abaixo.

Otimização de desempenho

Otimizar o desempenho do WebView2 em seu aplicativo HoloLens 2 Unity é crucial para uma experiência suave do usuário. Aqui estão algumas recomendações:

  • Limitar o número de instâncias do WebView2: sugerimos usar apenas uma instância do WebView2 em um aplicativo do Unity. Reutilize a mesma instância ou derrube e crie uma nova conforme necessário. Tenha em mente que a remoção do prefab do WebView da cena pode não destruir a instância subjacente do WebView2. Você deve chamar o Destroy() método no objeto do jogo para destruí-lo corretamente.

  • Aplicar técnicas gerais de otimização do Unity: para otimizar o desempenho do WebView2, use as abordagens padrão de otimização do Unity, como abate de oclusão ou limitação da taxa de atualização. Para obter mais informações, consulte Recomendações de desempenho para o Unity na documentação de realidade misturada.

  • Perfil e monitorar o desempenho do WebView2: há várias maneiras de perfilar o desempenho de um aplicativo do HoloLens 2 Unity:

    • Unity Profiler: uma ferramenta interna no Unity que permite medir e otimizar o desempenho do aplicativo em várias plataformas, incluindo HoloLens 2.

    • Visual Profiler: um recurso do kit de ferramentas Realidade Misturada que fornece uma exibição no aplicativo do desempenho do aplicativo.

    • PIX: uma ferramenta de ajuste e depuração de desempenho para Windows que também pode ser usada para perfilar aplicativos do Unity no HoloLens 2.

Na Etapa 7 – Estendendo a funcionalidade do WebView2, tocamos em alguns métodos de navegação. Nesta seção, vamos expandir o que aprendemos.

Veja também:

Interface IWebView

A IWebView interface expõe alguns métodos, eventos e propriedades relacionadas à navegação de página. A funcionalidade main exposta aqui é a capacidade de navegar até uma determinada URL usando 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);
}
Interface IWithBrowserHistory

A IWithBrowserHistory interface expõe alguns métodos e eventos relacionados à navegação de página. Isso permite principalmente que os desenvolvedores naveguem para frente e para trás, como seria de esperar com uma experiência típica de navegação na Web:

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

    event WebView_OnCanGoForwardUpdated CanGoForwardUpdated;

    event WebView_OnCanGoBackUpdated CanGoBackUpdated;

    void GoBack();

    void GoForward();
}
SetVirtualHostNameToFolderMapping e SetVirtualHostMapping

O Método CoreWebView2.SetVirtualHostNastNameToFolderMapping permite o mapeamento entre um nome de host virtual e um caminho de pasta, tornando-o acessível a sites usando esse nome de host. Esse método mapeia um nome de domínio local para uma pasta local, de modo que o controle WebView2 carregue conteúdo da pasta local especificada ao tentar acessar um recurso para esse domínio.

O plug-in do WebView para Unity expõe essa funcionalidade por meio da IWithVirtualHost interface, que tem um único método: SetVirtualHostMapping(string hostName, string folderPath)

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

Para usar o SetVirtualHostMapping método, defina hostName como qualquer cadeia de caracteres de conformidade de URL válida, como webview2.sample. folderPath pode ser um caminho absoluto ou um caminho relativo ao diretório de trabalho do aplicativo, como Assets\Html.

Supondo que tenhamos um arquivo HTML chamado demo.html em Assets\Html, o snippet de código a seguir demonstra o carregamento demo.html usando o plug-in do 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

Há várias maneiras de lidar com a entrada no Unity para aplicativos de realidade misturada.

Independentemente do sistema de entrada usado em seu aplicativo Unity, é necessário interoperabilidade entre os vários eventos de entrada do aplicativo e o plug-in do WebView para Unity. Isso significa traduzir esses eventos (como eventos pointer) em um WebViewMouseEventData objeto e encaminhar esses eventos para o plug-in por meio da IWithMouseEvent interface:

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

O WebView2 não tem conhecimento do sistema de entrada do Unity e provavelmente tem um sistema de coordenadas diferente da cena do Unity. Como resultado, quando há um evento de ponteiro para baixo, suas coordenadas devem ser traduzidas para o sistema de coordenadas do controle WebView2. Além disso, o evento ponteiro para baixo precisa ser convertido em um tipo de evento apropriado WebViewMouseEventData .

Exemplo simples:

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);
    }
}

No exemplo acima, os eventos de ponteiro para baixo são convertidos em WebViewMouseEventData objetos e encaminhados para o plug-in do WebView para Unity. Ele é essencialmente convertido em um evento mouse-down. Para criar eventos de clique do mouse, os eventos de ponteiro para cima precisariam ser tratados de maneira semelhante.

No exemplo acima, ConvertToWebViewSpace não é implementado intencionalmente.

Confira também