Compartilhar via

Janela vs. Alojamento visual do WebView2

  • Artigo

Existem três opções para alojar o controlo Microsoft Edge WebView2 na sua aplicação:

  • O modo de alojamento em janela.
  • O modo de alojamento Janela para Elemento Visual.
  • O modo de alojamento visual.

Não precisa de ler este artigo se utilizar o Alojamento em janelas na maioria dos cenários. O alojamento em janelas é um bom ponto de partida para a maioria das aplicações. Leia este artigo:

  • Se estiver a utilizar o alojamento em Janelas em cenários invulgares e estiver a ter problemas persistentes com o DPI e o dimensionamento. Neste caso, considere Alojamento janela para elemento visual.
  • Se quiser proporcionar uma experiência de utilizador mais personalizada (UX). Neste caso, considere Alojamento visual.

As diferentes abordagens para alojar o controlo WebView2 na sua aplicação são semelhantes na funcionalidade, mas adequam-se a diferentes necessidades consoante os requisitos da aplicação, da seguinte forma:

Abordagem Descrição Otimizado para
Alojamento em janelas O controlo WebView2 recebe entradas do sistema operativo (SO). O SO envia a entrada para o WebView2. Apresentar conteúdo Web de forma rápida e fácil, sem ter de incluir funcionalidades para entradas, saídas e acessibilidade.
Janela para Alojamento visual Uma combinação de Alojamento em Janelas e Elementos Visuais. Semelhante ao Alojamento em Janelas, exceto que o conteúdo webView2 é exportado para um Elemento visual alojado numa janela, em vez de ter o conteúdo a ser exportado diretamente para a janela. Uma experiência de programador é quase idêntica ao alojamento em Janelas, mas com um processamento de PPP/dimensionamento melhorado e a ressalva de que a experiência de Escrita Manual do Windows Shell não é suportada.
Alojamento visual A aplicação anfitriã recebe entradas espaciais (como entrada de rato ou toque) do utilizador. A sua aplicação envia esta entrada para o controlo WebView2. Controlo mais granular sobre a composição do controlo. A aplicação tem de processar especificamente as APIs de composição e gestão de janelas.

Estas abordagens têm diferentes requisitos, restrições e benefícios.

  • O alojamento em janelas é mais simples de implementar do que o Alojamento visual.
  • O alojamento visual requer todas as chamadas à API necessárias para o alojamento em Janelas e tem requisitos adicionais para que seja composto corretamente.

As listas de API suportadas estão ligadas nas secções abaixo:

Alojamento em janelas: para apresentar conteúdo de forma rápida e fácil

O alojamento em janelas significa que, na sua aplicação, o conteúdo webView2 está alojado diretamente numa janela; ou seja, um HWND. O WebView2 HWND herda muitas propriedades predefinidas do sistema operativo (SO). O controlo WebView2 recebe entradas do SO e o SO envia a entrada para o controlo WebView2. Pode ter vários HWNDs na sua aplicação que serão utilizados como um componente WebView2 para aceder a conteúdos Web.

A vantagem disto é que alguns dos comandos Entrada/Saída são processados por si pelo SO ou pela arquitetura. No entanto, ainda terá de lidar com alguns aspetos da gestão de janelas.

Para obter informações gerais sobre a gestão e HWND funcionalidade do Windows, consulte Acerca do Windows.

Vantagens

  • O alojamento em janelas permite uma solução que apresenta rapidamente conteúdo Web sem ter de implementar funcionalidades para entradas, saídas e acessibilidade.

  • As janelas próprias e subordinadas (como menus e menus de contexto) são dimensionadas automaticamente para corresponder ao dimensionamento principal HWND da aplicação.

  • O alojamento em janelas processa a forma como o controlo WebView2 gere a concentração e a tabulação por si só quando premir a Tecla de Tabulação chega ao elemento final.

  • Se não quiser, não tem de gerir os vários controlos de composição baseados em composição (como Entradas, Saídas e Controlos de acessibilidade).

Desvantagens

O modo de alojamento em janelas pode deparar-se com problemas de DPI em alguns cenários, como ao partilhar uma pasta de dados de utilizador (e, assim, para partilhar um processo do browser) em diferentes aplicações com deteção de PPP diferente.

APIs para alojamento em Janelas

Para obter uma lista de APIs que podem ser utilizadas ao configurar o WebView2 para alojamento em Janelas (ou para Alojamento de Janelas para Elementos Visuais), veja Rendering WebView2 in non-framework apps in Overview of WebView2 features and APIs (Composição de WebView2 em aplicações não estruturais) em Overview of WebView2 features and APIs (Descrição geral das funcionalidades e APIs do WebView2).

Janela para Alojamento visual: para uma experiência semelhante a Alojamento em janelas, com benefícios adicionais e desvantagem

O alojamento De Janela para Elemento Visual significa que o conteúdo do WebView2 é exportado para um Elemento Visual alojado num HWND, em vez de exportar conteúdo diretamente para uma janela ou para um Elemento Visual diretamente. Ao alojar conteúdos num HWND, é fácil utilizar o alojamento da Janela para o Elemento Visual, da mesma forma que o alojamento em Janelas. No entanto, ao apresentar conteúdo através de um alojamento Visual, Janela para Elemento Visual evita alguns problemas de DPI e de entrada que podem resultar na utilização do alojamento em Janelas.

A Janela para o Alojamento visual não requer que utilize as APIs de alojamento de Elementos Visuais webView2.

Para ativar o alojamento do Windows para Visual, a variável COREWEBVIEW2_FORCED_HOSTING_MODE de ambiente tem de ser definida como o valor COREWEBVIEW2_HOSTING_MODE_WINDOW_TO_VISUAL antes de inicializar o WebView2.

No alojamento De Janela para Elemento Visual e alojamento visual, um Elemento visual é uma unidade gráfica básica que pode ser utilizada para compor experiências gráficas no Windows. As APIs gráficas do Windows que expõem esta funcionalidade e são relevantes para o WebView2 são DirectComposition e Windows.UI.Composition. O "Visual" no "Alojamento visual" pode ser qualquer um dos elementos IDCompositionTargetvisuais que são expostos através das IDCompositionVisualDirectComposition APIs e Windows.UI.Composition .Windows.UI.Composition.Visual (O alojamento janela para elemento visual utiliza IDCompositionVisual especificamente.) Veja:

Vantagens

  • As diferentes aplicações que partilham uma pasta de dados de utilizador do WebView2 podem ter uma deteção de PPP diferente.

  • As diferentes aplicações que partilham uma pasta de dados de utilizador webView2 podem ter níveis de integridade diferentes.

  • As diferentes aplicações que partilham uma pasta de dados de utilizador webView2 não farão com que entrem em bloqueio devido a filas de entrada de janelas anexadas.

  • Ao alojar um WebView2 num Suplemento VSTO, alterar a escala do monitor não fará com que a aplicação fique bloqueada. Veja VsTO Add-ins in Office solutions development overview (VSTO) (Descrição geral do desenvolvimento de soluções do VSTO [VSTO]).

Desvantagens

Ativar o modo de alojamento Janela para Elemento Visual remove o suporte para Escrita Manual da Shell do Windows no WebView2.

Veja também:

APIs para Alojamento de Janelas para Elementos Visuais

Para obter uma lista de APIs que podem ser utilizadas ao configurar a Janela WebView2 para o Alojamento visual (ou para alojamento em janelas), veja Rendering WebView2 in non-framework apps in Overview of WebView2 features and APIs (Composição de WebView2 em aplicações não estruturais) em Overview of WebView2 features and APIs (Descrição geral das funcionalidades e APIs do WebView2).

Alojamento visual: para um controlo mais granular sobre o esquema

Ao utilizar o Alojamento visual, a aplicação anfitriã recebe entradas espaciais (como entrada de rato ou toque) do utilizador e reencaminha esta entrada para o controlo WebView2. O alojamento visual requer que a aplicação faça a mesma gestão de janelas que o Alojamento em janelas, mas tem requisitos de gestão de janelas adicionais em relação a:

  • Dimensionar os conteúdos.
  • Encaminhar entradas espaciais (como rato, toque ou caneta).

Requisitos para dimensionar os conteúdos

Por composição baseada em composição, um controlo WebView2 faz parte de uma árvore Visual, por isso, por predefinição, é composto numa escala baseada nas escalas de todos os elementos visuais predecessoras. Por exemplo, se um Elemento Visual predecessor do WebView2 for dimensionado (ampliado) 2x, os conteúdos do WebView2 também são compostos à escala 2x. Se o Elemento Visual principal do WebView2 for dimensionado 2x e o elemento principal do Visual também for dimensionado 2x, o WebView2 será dimensionado 4x. No entanto, como o WebView2 não está a dimensionar os seus próprios conteúdos, estão desfocados.

Para resolve isto, a aplicação pode anular o Dimensionamento visual predefinido do WebView2 e, em vez disso, utilizar as APIs de Escala de Rasterização para aplicar o dimensionamento visual pretendido. Isto resulta na composição do conteúdo do WebView2 na escala correta. Veja Escala de rasterização na Descrição geral das funcionalidades e APIs do WebView2.

Requisitos para encaminhar entradas espaciais (rato, toque ou caneta)

Se a aplicação WebView2 utilizar o Alojamento visual, não são enviadas entradas espaciais (como rato, toque ou caneta) para o controlo WebView2, a menos que a aplicação faça a gestão dessas entradas. A entrada é enviada para a aplicação HWNDe a aplicação é responsável por reencaminhar esta entrada espacial para o WebView2, se a posição da entrada estiver sobre o WebView2.

A aplicação também é responsável por qualquer transformação necessária de posições de entrada no espaço de coordenadas do WebView2.

Veja também:

Vantagens e desvantagens

O alojamento visual permite (e requer) um controlo mais granular do esquema. Ao utilizar esta abordagem, a aplicação precisa de um processamento específico das APIs de composição e gestão de janelas.

Por exemplo, se uma ação de utilizador fizer com que a árvore Visual do WebView2 seja dimensionada, a aplicação tem de ajustar a escala do WebView2 para compor corretamente em relação aos elementos visuais principais.

APIs para alojamento visual

Para obter uma lista de APIs que podem ser utilizadas ao configurar o WebView2 num ambiente de alojamento visual, veja Rendering WebView2 using Composition in Overview of WebView2 features and APIs (Composição webView2 com Composição em Descrição Geral das funcionalidades e APIs do WebView2).

Compatibilidade e restrições

As principais limitações de compatibilidade incluem o sistema operativo e a composição em aplicações de arquitetura e não arquitetura.

Sistemas operacionais

Todos os modos de alojamento são suportados onde quer que o WebView2 seja suportado; ou seja, Windows 10 e posterior e determinadas versões do Windows Server. O Windows 7, 8 e 8.1 já não são suportados; O Windows 7 e o Windows 8 só suportam o alojamento em Janelas e não o Alojamento visual.

Veja também:

Restrições de arquitetura

CreateCoreWebView2CompositionControllernão suporta elementos visuais do WinAppSDK; ou seja, objetos visuais no Microsoft.UI.Composition espaço de nomes, descritos em Melhorar IU com a camada Visual (SDK do Aplicativo Windows/WinUI 3).

Confira também

Externo: