WinForms サンプル アプリ

このサンプル の WebView2WindowsFormsBrowser は、WebView2 コントロールと WebView2 API を使用して、WinForms アプリに Web ブラウザーを実装する方法を示しています。

• サンプル名: WebView2WindowsFormsBrowser
• リポジトリ ディレクトリ: WebView2WindowsFormsBrowser
• ソリューション ファイル: WebView2WindowsFormsBrowser.sln

• [コントロール] メニューには、[アクセラレータ キー] と [外部ドロップを許可する] の切り替えメニュー項目があります。
• [ 表示 ] メニューには、[ ズーム] サブメニューと [背景色] サブメニューがあります。
• [ イベント] ボタンをクリックすると、 EventMonitor ウィンドウが開きます。

手順 1 - Visual Studio をインストールする

Microsoft Visual Studio が必要です。 このサンプルでは、Microsoft Visual Studio Code はサポートされていません。

1. Visual Studio (最小必須バージョン) がまだインストールされていない場合は、別のウィンドウまたはタブで、「WebView2 用の開発環境を設定する」の「Visual Studio のインストール」を参照してください。 そのセクションの手順に従って、このページに戻り、以下の手順を続行します。

手順 2 - Microsoft Edge のプレビュー チャネルをインストールする

1. Microsoft Edge (Beta、Dev、または Canary) のプレビュー チャネルがまだインストールされていない場合は、別のウィンドウまたはタブで、「WebView2 用の開発環境を設定する」の「Microsoft Edge のプレビュー チャネルをインストールする」を参照してください。 そのセクションの手順に従って、このページに戻り、以下の手順を続行します。

2. 試験段階の API を事前にテストし、WebView2 アプリの前方互換性を確認するには、「今後の API と機能をテストする」の「特定のブラウザー チャネルをアプリで使用するためのアプローチ」を参照してください。 そのセクションの手順に従って、このページに戻り、以下の手順を続行します。

手順 3 - WebView2Samples リポジトリを複製またはダウンロードする

1. まだ完了していない場合は、リポジトリを WebView2Sample 複製するか、ローカル ドライブにダウンロードします。 別のウィンドウまたはタブで、「 WebView2 の開発環境をセットアップする」の「WebView2Samples リポジトリをダウンロード する」を参照 してください。 そのセクションの手順に従って、このページに戻り、以下に進みます。

手順 4 - Visual Studio で .sln を開く

1. ローカル ドライブで、ディレクトリ内の .sln Visual Studio でファイルを開きます。

   • <your-repos-directory>/WebView2Samples/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln

   または:

   • <your-repos-directory>/WebView2Samples-main/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln

手順 5 - プロンプトが表示されたらワークロードをインストールする

1. メッセージが表示されたら、要求された Visual Studio ワークロードをインストールします。 別のウィンドウまたはタブで、「WebView2 用の開発環境を設定する」の「Visual Studio ワークロードをインストールする」を参照してください。 そのセクションの手順に従って、このページに戻り、以下に進みます。

手順 6 - プロジェクトをビルドして実行する

上記の手順から、Visual Studio で WebView2WindowsFormsBrowser プロジェクトが開きます。 Visual Studio の上部で、次のようにビルド ターゲットを設定します。

1. [ ソリューション構成] ドロップダウン リストで、[ デバッグ ] または [リリース] を選択 します。

2. [ ソリューション プラットフォーム ] ドロップダウン リストで、[ 任意の CPU] を選択します。

3. ソリューション エクスプローラーで、WebView2WindowsFormsBrowser プロジェクトを右クリックし、[ビルド] を選択します。

   これにより、プロジェクト ファイル SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojがビルドされます。 これには数分かかる場合があります。

   .NET Framework 4.6.2 Developer Pack が見つからないというエラー メッセージが表示される場合は、次の手順に従います。 それ以外の場合は、次のメジャー セクションに進んでください。

4. Visual Studio で、[ デバッグ>の開始] [デバッグの開始] (F5) を選択します。

   サンプル アプリ ウィンドウが開きます。

   

5. サンプル アプリを使用します。 「WebView2WindowsFormsBrowser の README ファイル」を参照してください。

6. Visual Studio で、[デバッグ] [ デバッグ>の停止] の順に選択します。 Visual Studio はアプリを閉じます。

手順 7 - .NET Framework 4.6.2 Developer Pack をインストールする

WebView2WindowsFormsBrowser プロジェクトをビルドし、.NET Framework 4.6.2 Developer Pack が見つからないというエラー メッセージが表示される場合は、次の手順に従います。 それ以外の場合は、次のメジャー セクションに進んでください。

1. [ダウンロード .NET Framework] に移動し、[v4.6.2] を選択し、[ダウンロード .NET Framework 4.6.2 Developer Pack] ボタンをクリックします。

   

2. Microsoft Edge で、[ 設定] を選択し、[その他の>ダウンロード][>フォルダーに表示 ] アイコンを選択します。

   

3. フォルダーで Downloads 、 などの ndp462-devpack-kb3151934-enu.exeファイルをダブルクリックします。

   [Microsoft .NET Framework Developer Pack の使用許諾契約書] ダイアログが表示されます。

   

4. [ ライセンスの使用条件に同意する ] チェック ボックスをオンにし、[ インストール ] ボタンをクリックします。

   [ユーザー アカウント制御] ウィンドウが表示され、"このアプリがデバイスに変更を加えることを許可しますか?

5. [はい] ボタンをクリックします。

   [Microsoft .NET Framework Developer Pack のセットアップが成功しました] ダイアログが表示されます。

   

6. [ 閉じる ] ボタンをクリックします。

Microsoft .NET Framework 4.6.2 Developer Packがコンピューターにインストールされました。

手順 8 - WebView2 SDK を更新またはインストールする

1. WebView2 SDK - ソリューション エクスプローラーのプロジェクト ノード (ソリューション ノードではなく) に WebView2 SDK を更新またはインストールします。 別のウィンドウまたはタブで、「WebView2 用の開発環境をセットアップする」の「WebView2 SDK をインストールまたは更新する」を参照してください。 そのセクションの手順に従って、このページに戻り、以下に進みます。

   

手順 9 - 更新されたプロジェクトをビルドして実行する

1. 上記.NET Framework 4.6.2 Developer Pack をインストールしたばかりの場合は、Visual Studio を閉じてから、ディレクトリから Visual Studio でソリューション ファイルをもう一度開きます。

   • <your-repos-directory>/WebView2Samples/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln

   または:

   • <your-repos-directory>/WebView2Samples-main/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln

Visual Studio の上部で、次のようにビルド ターゲットを設定します。

1. [ ソリューション構成] ドロップダウン リストで、[ デバッグ ] または [リリース] を選択 します。

2. [ ソリューション プラットフォーム ] ドロップダウン リストで、[ 任意の CPU] を選択します。

3. ソリューション エクスプローラーで、WebView2WindowsFormsBrowser プロジェクトを右クリックし、[ビルド] を選択します。

   これにより、プロジェクト ファイル SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojがビルドされます。

4. Visual Studio で、[ デバッグ>の開始] [デバッグの開始] (F5) を選択します。

   サンプル アプリ ウィンドウが開きます。

   

   • [コントロール] メニューには、[アクセラレータ キー] と [外部ドロップを許可する] の切り替えメニュー項目があります。
   • [ 表示 ] メニューには、[ ズーム] サブメニューと [背景色] サブメニューがあります。
   • [ イベント] ボタンをクリックすると、 EventMonitor ウィンドウが開きます。

5. Visual Studio で、[デバッグ] [ デバッグ>の停止] の順に選択します。 Visual Studio はアプリを閉じます。

手順 10 - コードを検査する

1. Visual Studio コード エディターで、コードを検査します。

   

関連項目

• WebView2 API リファレンス
• WinForms アプリでの WebView2 の概要