WebView2コントロールを使う

WebBrowserコントロールはInternetExplorer（Tridentエンジン）をベースとしている為、 最近のWebページを表示すると崩れたりJavaScriptがエラーになることがあります。
（また、WebBrowserのInternetExplorerバージョンはIE7になっていますので、IE11として表示するにはレジストリを書き換える必要があります）

WebView2コントロールはEdgeブラウザ（Chromium）をベースとしてますので、そういった問題が解消されます。

必要環境

開発の為に必要な環境は以下になります。
・Windows10 1803（ビルド17110）以降
・WebView2ランタイム または Microsoft Edge (Chromium) カナリアチャネル
・VisualStudio 2017以降
・.NET Framework 4.6.2以降

WebView2ランタイムのインストール

ここから WebView2ランタイムの「Evergreen Bootstrapper」をインストールしましょう。
Windows11の場合は最初からWebView2ランタイムが入っていますので、インストールは不要です。

NuGetから「WebView2」のSDKをインストールします。

メニューの[ツール]->[NuGetパッケージマネージャー]->[ソリューションのNuGetパッケージの管理]を選択します。


検索欄に「WebView2」を入力し、右側で適用するプロジェクトを選択してインストールします。
バージョンは最新の安定版のものを選びます。


VisualStudioの再起動後、ツールボックスにWebView2が現れました。


フォームに張り付けてコードをかき、アプリを実行するとこのように表示されます。

ツールボックスにWebView2が表示されない場合

Nugetでインストールした直後はツールボックスに現れない場合があります。
その時はいったん保存して再度VisualStudioを立ち上げなおしてください。

VisualStudio2017の場合、パッケージ管理方法の変更が必要

VisualStudio2017でNuGetを使う関係上、 パッケージ管理方法をpackages.configではなくPackageReferenceを使用する必要があります。
もし設定を変更していない場合、WebViewを使ってビルドすると以下のエラーがでました。


変更方法ですが、メニューの[ツール]->[NuGetパッケージマネージャー]->[パッケージマネージャー設定]を選択します。


「パッケージの管理」の「既定のパッケージ管理形式」を"PackageReference"に設定してください。

ターゲットフレームワークの設定

ビルド時に使用する.NET Frameworkが4.6.2以降になっている必要があります。
プロジェクトのプロパティからアプリケーションを選択し、ターゲットフレームワークを確認してください。


もし4.6.2より古いフレームワークが選択されていた場合は変更します。
新しいバージョンがインストールされていない場合は選択できません。


その場合、「別のフレームワークをインストールします」をクリックし、表示されるサイトからダウンロード＆インストールします。

「Developer Pack」のリンクをクリックするとインストーラーがダウンロードされます。
インストールすればVisualStudioから選択できるようになります。

次のページでWebView2コントロールでの具体的な操作方法について解説します。
WebView2コントロールでの操作

Microsoft Edge WebView2 の概要 (プレビュー)
Windows Forms アプリでの WebView2 の概要 (プレビュー)
WebView2 SDK のリリースノート
Microsoft Edge WebView2 API リファレンス
WebView2 ソース