WinForms 範例應用程式
此範例 WebView2WindowsFormsBrowser 示範如何使用 WebView2 控制件和 WebView2 API 在 WinForms 應用程式中實作網頁瀏覽器。
- 範例名稱: WebView2WindowsFormsBrowser
- 存放庫目錄: WebView2WindowsFormsBrowser
- 方案檔:
WebView2WindowsFormsBrowser.sln
- [ 控件] 功能表有 [ 快 捷鍵] 和 [ 允許外部卸除] 的切換功能表項。
- [ 檢視] 功能表具有 [ 縮放 ] 和 [ 背景色彩 ] 子功能表。
- [ 事件] 按鈕會開啟 [EventMonitor] 視窗。
步驟 1 - 安裝 Visual Studio
Microsoft需要 Visual Studio。 此範例不支援Microsoft Visual Studio Code。
- 如果尚未安裝 Visual Studio (最低必要版本) ,請在個別的視窗或索引標籤中,參閱在設定 WebView2 的開發環境中安裝 Visual Studio。 遵循該節中的步驟,然後返回此頁面並繼續執行下列步驟。
步驟 2 - 複製或下載 WebView2Samples 存放庫
- 如果尚未完成,請將存放庫複製或下載
WebView2Samples
到本機磁碟驅動器。 在個別的視窗或索引標籤中,請參閱為 WebView2 設定開發環境中的下載 WebView2Samples 存放庫。 請遵循該區段中的步驟,然後返回此頁面,然後繼續進行下列步驟。
步驟 3 - 在 Visual Studio 中開啟.sln
在本機磁碟驅動器上
.sln
,在 Visual Studio 的 目錄中開啟 檔案:<your-repos-directory>/WebView2Samples/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln
或:
<your-repos-directory>/WebView2Samples-main/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln
步驟 4 - 出現提示時安裝工作負載
- 如果出現提示,請安裝任何要求的Visual Studio工作負載。 在個別的視窗或索引標籤中,請參閱為 WebView2 設定開發環境中的安裝 Visual Studio 工作負載。 請遵循該區段中的步驟,然後返回此頁面,然後繼續進行下列步驟。
步驟 5 - 建置並執行專案
WebView2WindowsFormsBrowser 項目現在已在Visual Studio中開啟,方法是執行上述步驟。 在 Visual Studio 頂端設定建置目標,如下所示:
在 [ 方案組態] 下拉式清單中,選取 [ 偵錯] 或 [ 發行]。
在 [ 解決方案平臺] 下拉式清單中,選取 [ 任何 CPU]。
在 方案總管 中,以滑鼠右鍵按兩下 WebView2WindowsFormsBrowser 專案,然後選取 [建置]。
這會建置項目檔
SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxproj
。 這可能需要幾分鐘的時間。如果您收到有關遺失 .NET Framework 4.6.2 開發人員套件的錯誤訊息,請遵循下列步驟。 否則,請跳至下一個主要區段。
在 Visual Studio 中,選取 [ 偵錯>開始偵 錯] (F5) 。
範例應用程式視窗隨即開啟:
使用範例應用程式;請參閱 WebView2WindowsFormsBrowser 的自述檔。
在 Visual Studio 中,選取 [ 偵錯>停止偵錯]。 Visual Studio 會關閉應用程式。
步驟 6 - 安裝 .NET Framework 4.6.2 開發人員套件
如果您建置 WebView2WindowsFormsBrowser 專案,並取得有關遺漏 4.6.2 開發人員套件 .NET Framework 錯誤訊息,請遵循下列步驟。 否則,請跳至下一個主要區段。
移至 [下載 .NET Framework],選取 v4.6.2,然後按兩下 [下載 .NET Framework 4.6.2 開發人員套件] 按鈕:
在 Microsoft Edge 中,選取 [ 設定] 和 [更多>下載>顯示在資料夾中 ] 圖示:
在資料夾中
Downloads
,按兩下檔案, 例如ndp462-devpack-kb3151934-enu.exe
。[Microsoft .NET Framework 開發人員套件許可協定] 對話框隨即出現:
選取 [ 我同意授權條款和條件] 複選框,然後按兩下 [ 安裝 ] 按鈕。
[ 用戶帳戶控制] 視窗隨即出現,詢問「您要允許此應用程式對您的裝置進行變更嗎?」
按兩下 [ 是] 按鈕。
[Microsoft .NET Framework 開發人員套件安裝成功] 對話框隨即出現:
按兩下 [ 關閉] 按鈕。
Microsoft .NET Framework 4.6.2 開發人員套件 現在已安裝在您的電腦上。
步驟 7 - 更新或安裝 WebView2 SDK
WebView2 SDK - 更新或安裝項目節點上的 WebView2 SDK (不是 方案總管 中的解決方案節點) 。 在個別的視窗或索引標籤中,請參閱為 WebView2 設定開發環境中的安裝或更新 WebView2 SDK。 請遵循該區段中的步驟,然後返回此頁面,然後繼續進行下列步驟。
步驟 8 - 建置並執行更新的專案
如果您剛才安裝上述 .NET Framework 4.6.2 開發人員套件,請關閉 Visual Studio,然後從 目錄再次開啟 Visual Studio 中的方案檔:
<your-repos-directory>/WebView2Samples/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln
或:
<your-repos-directory>/WebView2Samples-main/SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.sln
在 Visual Studio 頂端設定建置目標,如下所示:
在 [ 方案組態] 下拉式清單中,選取 [ 偵錯] 或 [ 發行]。
在 [ 解決方案平臺] 下拉式清單中,選取 [ 任何 CPU]。
在 方案總管 中,以滑鼠右鍵按兩下 WebView2WindowsFormsBrowser 專案,然後選取 [建置]。
這會建置項目檔
SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxproj
。在 Visual Studio 中,選取 [ 偵錯>開始偵 錯] (F5) 。
範例應用程式視窗隨即開啟:
- [ 控件] 功能表有 [ 快 捷鍵] 和 [ 允許外部卸除] 的切換功能表項。
- [ 檢視] 功能表具有 [ 縮放 ] 和 [ 背景色彩 ] 子功能表。
- [ 事件] 按鈕會開啟 [EventMonitor] 視窗。
在 Visual Studio 中,選取 [ 偵錯>停止偵錯]。 Visual Studio 會關閉應用程式。
步驟 9 - 檢查程序代碼
在 Visual Studio 程式代碼編輯器中,檢查程式代碼: