WinForms-Beispiel-App

In diesem Beispiel, WebView2WindowsFormsBrowser, wird veranschaulicht, wie Sie das WebView2-Steuerelement und webView2-APIs verwenden, um einen Webbrowser in einer WinForms-App zu implementieren.

• Beispielname: WebView2WindowsFormsBrowser
• Repositoryverzeichnis: WebView2WindowsFormsBrowser
• Lösungsdatei: WebView2WindowsFormsBrowser.sln

• Das Menü Steuerelement enthält Umschaltmenüelemente für Zugriffstasten und Externes Ablegen zulassen.
• Das Menü Ansicht enthält die Untermenüs "Zoom " und " Hintergrundfarbe ".
• Mit der Schaltfläche Ereignisse wird das Fenster EventMonitor geöffnet.

Schritt 1: Installieren von Visual Studio

Microsoft Visual Studio ist erforderlich. Microsoft Visual Studio Code wird für dieses Beispiel nicht unterstützt.

1. Wenn Visual Studio (erforderliche Mindestversion) noch nicht installiert ist, finden Sie weitere Informationen in einem separaten Fenster oder einer separaten Registerkarte unter Installieren von Visual Studio unter Einrichten Ihrer Entwicklungsumgebung für WebView2. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie mit den folgenden Schritten fort.

Schritt 2: Installieren eines Vorschaukanals von Microsoft Edge

1. Wenn noch kein Vorschaukanal von Microsoft Edge (Beta, Dev oder Canary) in einem separaten Fenster oder einer separaten Registerkarte installiert ist, finden Sie weitere Informationen unter Installieren eines Vorschaukanals von Microsoft Edge unter Einrichten Ihrer Entwicklungsumgebung für WebView2. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie mit den folgenden Schritten fort.

2. Informationen zum Vorabtest der experimentellen APIs und zum Sicherstellen der Vorwärtskompatibilität Ihrer WebView2-App finden Sie unter Ansätze zum Verwenden eines bestimmten Browserkanals für Ihre App unter Testen anstehender APIs und Features. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie mit den folgenden Schritten fort.

Schritt 3: Klonen oder Herunterladen des WebView2Samples-Repositorys

1. Falls noch nicht geschehen, klonen Sie das Repository, oder laden Sie es WebView2Sample auf Ihr lokales Laufwerk herunter. In einem separaten Fenster oder einer separaten Registerkarte finden Sie weitere Informationen unter Herunterladen des WebView2Samples-Repositorys unter Einrichten Ihrer Entwicklungsumgebung für WebView2. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie weiter unten fort.

Schritt 4: Öffnen der SLN-Datei in Visual Studio

1. Öffnen Sie die .sln Datei auf Ihrem lokalen Laufwerk in Visual Studio im Verzeichnis:

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

   oder:

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

Schritt 5: Installieren von Workloads, wenn Sie dazu aufgefordert werden

1. Wenn Sie dazu aufgefordert werden, installieren Sie alle angeforderten Visual Studio-Workloads. In einem separaten Fenster oder einer separaten Registerkarte finden Sie weitere Informationen unter Installieren von Visual Studio-Workloads unter Einrichten Ihrer Entwicklungsumgebung für WebView2. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie weiter unten fort.

Schritt 6: Erstellen und Ausführen des Projekts

Das WebView2WindowsFormsBrowser-Projekt ist jetzt in Visual Studio geöffnet, nachdem Sie die oben genannten Schritte ausgeführt haben. Legen Sie oben in Visual Studio das Buildziel wie folgt fest:

1. Wählen Sie in der Dropdownliste Projektmappenkonfigurationendie Option Debuggen oder Freigeben aus.

2. Wählen Sie in der Dropdownliste Lösungsplattformendie Option Beliebige CPU aus.

3. Klicken Sie Projektmappen-Explorer mit der rechten Maustaste auf das Projekt WebView2WindowsFormsBrowser, und wählen Sie dann Erstellen aus.

   Dadurch wird die Projektdatei SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojerstellt. Dies kann einige Minuten dauern.

   Wenn Sie Fehlermeldungen erhalten, dass .NET Framework 4.6.2 Developer Pack fehlt, führen Sie die folgenden Schritte aus. Fahren Sie andernfalls mit dem nächsten Hauptabschnitt weiter unten fort.

4. Wählen Sie in Visual Studio Debuggen>Debuggen starten (F5) aus.

   Das Beispiel-App-Fenster wird geöffnet:

   

5. Verwenden Sie die Beispiel-App. Siehe README-Datei für WebView2WindowsFormsBrowser.

6. Wählen Sie in Visual Studio Debuggen>Debuggen Debuggen beenden aus. Visual Studio schließt die App.

Schritt 7: Installieren von .NET Framework 4.6.2 Developer Pack

Wenn Sie das WebView2WindowsFormsBrowser-Projekt erstellen und Fehlermeldungen zu fehlenden .NET Framework 4.6.2 Developer Pack erhalten, führen Sie die folgenden Schritte aus. Fahren Sie andernfalls mit dem nächsten Hauptabschnitt weiter unten fort.

1. Wechseln Sie zu download .NET Framework, wählen Sie v4.6.2 aus, und klicken Sie dann auf die Schaltfläche Download .NET Framework 4.6.2 Developer Pack:

   

2. Wählen Sie in Microsoft Edge Einstellungen und mehr>Downloads>Im Ordner anzeigen aus:

   

3. Doppelklicken Sie im Downloads Ordner auf die Datei, z ndp462-devpack-kb3151934-enu.exe. B. .

   Das Dialogfeld Microsoft .NET Framework Developer Pack-Lizenzvertrag wird angezeigt:

   

4. Aktivieren Sie das Kontrollkästchen Ich stimme den Lizenzbedingungen zu , und klicken Sie dann auf die Schaltfläche Installieren .

   Ein Fenster "Benutzerkontensteuerung " wird angezeigt, in dem Sie gefragt werden: "Möchten Sie zulassen, dass diese App Änderungen an Ihrem Gerät vornahm?"

5. Klicken Sie auf die Schaltfläche Ja .

   Das Dialogfeld Microsoft .NET Framework Developer Pack setup successful (Microsoft .NET Framework Developer Pack Setup erfolgreich) wird angezeigt:

   

6. Klicken Sie auf die Schaltfläche Schließen .

Microsoft .NET Framework 4.6.2 Developer Pack ist jetzt auf Ihrem Computer installiert.

Schritt 8: Aktualisieren oder Installieren des WebView2 SDK

1. WebView2 SDK: Aktualisieren oder installieren Sie das WebView2 SDK auf dem Projektknoten (nicht auf dem Projektmappenknoten) in Projektmappen-Explorer. In einem separaten Fenster oder einer separaten Registerkarte finden Sie weitere Informationen unter Installieren oder Aktualisieren des WebView2 SDK unter Einrichten Ihrer Entwicklungsumgebung für WebView2. Führen Sie die Schritte in diesem Abschnitt aus, kehren Sie dann zu dieser Seite zurück, und fahren Sie weiter unten fort.

   

Schritt 9: Erstellen und Ausführen des aktualisierten Projekts

1. Wenn Sie soeben .NET Framework 4.6.2 Developer Pack oben installiert haben, schließen Sie Visual Studio, und öffnen Sie dann die Projektmappendatei erneut in Visual Studio aus dem Verzeichnis:

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

   oder:

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

Legen Sie oben in Visual Studio das Buildziel wie folgt fest:

1. Wählen Sie in der Dropdownliste Projektmappenkonfigurationendie Option Debuggen oder Freigeben aus.

2. Wählen Sie in der Dropdownliste Lösungsplattformendie Option Beliebige CPU aus.

3. Klicken Sie Projektmappen-Explorer mit der rechten Maustaste auf das Projekt WebView2WindowsFormsBrowser, und wählen Sie dann Erstellen aus.

   Dadurch wird die Projektdatei SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojerstellt.

4. Wählen Sie in Visual Studio Debuggen>Debuggen starten (F5) aus.

   Das Beispiel-App-Fenster wird geöffnet:

   

   • Das Menü Steuerelement enthält Umschaltmenüelemente für Zugriffstasten und Externes Ablegen zulassen.
   • Das Menü Ansicht enthält die Untermenüs "Zoom " und " Hintergrundfarbe ".
   • Mit der Schaltfläche Ereignisse wird das Fenster EventMonitor geöffnet.

5. Wählen Sie in Visual Studio Debuggen>Debuggen Debuggen beenden aus. Visual Studio schließt die App.

Schritt 10: Untersuchen des Codes

1. Untersuchen Sie den Code im Code-Editor von Visual Studio:

   

Siehe auch

• WebView2-API-Referenz
• Erste Schritte mit WebView2 in WinForms-Apps