WPF WebView2 컨트롤 오버레이 지원

📤 정보 공유
,
1

WPF 응용 프로그램에서 웹 브라우저를 내장하기 위한 컴포넌트인 WebView2 컨트롤은 WinForms 호스팅 방식으로 동작하여 WPF의 장점인 자유로운 오버레이나 렌더 변형을 사용할 수 없었습니다. (WinUI에서는 가능한걸로 보입니다.)

WebView2의 대안으로 CefSharp을 사용할 경우 이러한 동작이 가능했지만, 런타임 설치 등 배포 크기나 복잡성 때문에 WebView2를 선호하면서도 이 부분이 늘 아쉬웠습니다.

이와 관련된 기능 요청은 공식 피드백 리포지토리에서도 꾸준히 이어져 왔는데요.

그러던 중, 약 4개월 전 등록된 1.0.2646-prerelease 버전에서 기존의 호스팅 방식이 아닌 DirectX를 이용해 WPF에 컨트롤에 직접 컴포지션하는 방식의 WebView2CompositionControl이 추가되었습니다.

아직 공식 릴리스에는 포함되어 있지 않고, 아쉽게도 Classic 프레임워크에서만 정상 동작하지만 미리 사용해 볼 만한 가치가 있습니다.

아래는 동작 예시입니다.

image
image903×646 143 KB

사용방법은 Nuget으로 Microsoft.Web.WebView2 1.0.2646버전 이상의 prerelease 버전을 설치하신 뒤, 기존 코드에서 WebView2 컨트롤 대신 WebView2CompositionControl로만 변경하면 됩니다.

<wv2:WebView2CompositionControl 
           x:Name="_browser" Source="https://google.com/" />

이로써 WPF내 WebView2를 내장하는 Hybrid 어플리케이션 등에서 좀더 리치하고 매끄러운 통합이 가능해 질 것으로 보입니다.

WebView2(Chromium)의 경우 원천적으로 OpenGL 렌더링 파이프라인을 가지고 있어 이러한 구현이 가능할 수도 있지만, 이 기술을 활용해서 기존 WinForms 호스팅 컨트롤이나 ActiveX 컨트롤 같은 요소들, 나아가서 Unity 엔진 같은 제품들을 컴포지션 형식으로 호스팅 할 수 있게 된다면 WPF의 활용도가 조금이나마 높아지지 않을까 생각해봅니다.

이상입니다:blush:

11개의 좋아요
2

.NET에서 사용 시 현재 최신 버전인 1.0.2839-prerelease 버전을 설치하시고 Target OS Version을 10.0.17763.0 이상으로 설정하시면 정상 동작합니다.

image

<Project Sdk="Microsoft.NET.Sdk">
  <PropertyGroup>
    <OutputType>WinExe</OutputType>
    <UseWPF>true</UseWPF>
    <TargetFramework>net8.0-windows10.0.17763.0</TargetFramework>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.Web.WebView2" 
                      Version="1.0.2839-prerelease" />
  </ItemGroup>
</Project>
3개의 좋아요