.NET の Windows FormsアプリケーションでWebView2を利用する - C#

.NET の Windows FormsアプリケーションでWebView2を利用するコードと手順を紹介します。

概要

WebView2を利用して、Webページを表示するWindows Forms アプリケーションを作成します。

手順

Windows Forms アプリケーションの作成

.NET のWindows Forms アプリケーションを作成します。

WebView2 ライブラリのインストール

Microsoft.Web.WebView2 NuGetパッケージをインストールします。
NuGet パッケージマネージャー コンソールの場合は、次のコマンドを実行します。
NuGet\Install-Package Microsoft.Web.WebView2 -Version (最新バージョン)


GUIのNuGet パッケージマネージャーの場合は、"Microsoft.Web.WebView2" で検索してパッケージをインストールします。

WebView2コントロールのフォームへの配置

WebView2 のパッケージをインストール後、フォームデザイナを表示します。
ツールボックスに[WebView2]のカテゴリが追加され、WebView2コントロールが追加されています。


ツールボックスのWebView2コントロールをフォームにドラッグ&ドロップして配置します。フォームに配置した状態が下図です。


ハンドルをドラッグしてWebView2コントロールをフォームの全体と同じ大きさにします。


ウィンドウのサイズに応じてコントロールの大きさが変わるよう、Anchorプロパティを設定します。


WebView2で読み込むコンテンツをSourceプロパティで指定します。今回はWebページを表示することにします。 Sourceプロパティの値を "https://www.ipentec.com" に設定します。

実行結果

プロジェクトを実行します。下図のウィンドウが表示されます。Sourceプロパティに指定したページが画面に表示されます。


ページのスクロールもできます。リンクをクリックするとページ遷移もできます。


.NET のWindowsフォームアプリケーションで、WebView2コントロールを利用したアプリケーションを実装できました。

補足: ツールボックスにWebView2コントロールが表示されない場合

フォームの編集画面でツールボックスウィンドウを開きます。


右クリックしてポップアップメニューを表示します。[アイテムの選択]の項目をクリックします。


下図の[ツールボックス アイテムの選択]ダイアログが表示されます。[.NET Framework コンポーネント]のタブをクリックして選択し、 ウィンドウ右下の[参照]ボタンをクリックします。


[開く]ダイアログが表示されますので、Microsoft.Web.WebView2.WinForms.dll を選択して開きます。
dllファイルの配置位置はVisual Studioのバージョンにより異なります。以下のどちらかになります。
  • C:\Users\(現在のログインユーザー)\.nuget\packages\Microsoft.Web.WebView2\(バージョン番号)\\lib\net462 フォルダ
  • プロジェクトのフォルダ内の (プロジェクトルート)\packages\Microsoft.Web.WebView2.(バージョン番号)\lib\net45 フォルダ



補足
...\lib\netcoreapp3.0 フォルダにも、Microsoft.Web.WebView2.WinForms.dll ファイルがあります。


こちらのファイルを読み込むと、「Microsoft.Web.WebView2.WinForms.dll はツールボックス項目を動的に列挙できないプラットフォームを対象としています。」の エラーメッセージが表示されます。

開くと、"WebView2" コントロールが読み込まれて[.NET Framework コンポーネント]の一覧に表示されます。
項目の左側のチェックボックスにチェックがついていることを確認しダイアログの[OK]ボタンをクリックします。


ダイアログが閉じられ、ツールボックスウィンドウに戻ります。ツールボックスに[WebView2]のグループが追加され、 グループ内に "WebView2" のコントロールが追加されています。

著者
iPentecのメインプログラマー
C#, ASP.NET の開発がメイン、少し前まではDelphiを愛用
掲載日: 2022-07-29
改訂日: 2024-06-29
iPentec all rights reserverd.