Exemple d’application WinForms

Cet exemple, WebView2WindowsFormsBrowser, montre comment utiliser le contrôle WebView2 et les API WebView2 pour implémenter un navigateur web dans une application WinForms.

• Exemple de nom : WebView2WindowsFormsBrowser
• Répertoire du référentiel : WebView2WindowsFormsBrowser
• Fichier solution : WebView2WindowsFormsBrowser.sln

• Le menu Contrôle a des éléments de menu bascule pour les touches d’accélérateur et Autoriser la suppression externe.
• Le menu Affichage comporte des sous-menus Zoom et Couleur d’arrière-plan .
• Le bouton Événements ouvre la fenêtre EventMonitor .

Étape 1 : Installer Visual Studio

Microsoft Visual Studio est requis. Microsoft Visual Studio Code n’est pas pris en charge pour cet exemple.

1. Si Visual Studio (version minimale requise) n’est pas déjà installé, dans une fenêtre ou un onglet distinct, consultez Installer Visual Studio dans Configurer votre environnement de développement pour WebView2. Suivez les étapes décrites dans cette section, puis revenez à cette page et poursuivez les étapes ci-dessous.

Étape 2 : Installer un canal en préversion de Microsoft Edge

1. Si un canal d’aperçu de Microsoft Edge (bêta, dev ou canary) n’est pas déjà installé, dans une fenêtre ou un onglet distinct, consultez Installer un canal d’aperçu de Microsoft Edge dans Configurer votre environnement de développement pour WebView2. Suivez les étapes décrites dans cette section, puis revenez à cette page et poursuivez les étapes ci-dessous.

2. Pour tester les API expérimentales à l’avance et vous assurer de la compatibilité avant de votre application WebView2, consultez Approches permettant à votre application d’utiliser un canal de navigateur spécifique dans Tester les API et fonctionnalités à venir. Suivez les étapes décrites dans cette section, puis revenez à cette page et poursuivez les étapes ci-dessous.

Étape 3 : Cloner ou télécharger le référentiel WebView2Samples

1. Si ce n’est pas déjà fait, clonez ou téléchargez le WebView2Sample référentiel sur votre lecteur local. Dans une fenêtre ou un onglet distinct, consultez Télécharger le référentiel WebView2Samples dans Configurer votre environnement de développement pour WebView2. Suivez les étapes décrites dans cette section, revenez à cette page et continuez ci-dessous.

Étape 4 : Ouvrir .sln dans Visual Studio

1. Sur votre lecteur local, ouvrez le .sln fichier dans Visual Studio, dans le répertoire :

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

   ou :

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

Étape 5 : Installer les charges de travail si vous y êtes invité

1. Si vous y êtes invité, installez toutes les charges de travail Visual Studio demandées. Dans une fenêtre ou un onglet distinct, consultez Installer des charges de travail Visual Studio dans Configurer votre environnement de développement pour WebView2. Suivez les étapes décrites dans cette section, revenez à cette page et continuez ci-dessous.

Étape 6 : Générer et exécuter le projet

Le projet WebView2WindowsFormsBrowser est maintenant ouvert dans Visual Studio, après avoir effectué les étapes ci-dessus. En haut de Visual Studio, définissez la cible de build comme suit :

1. Dans la liste déroulante Configurations de solution, sélectionnez Déboguer ou Mettre en production.

2. Dans la liste déroulante Plateformes de solutions, sélectionnez N’importe quel processeur.

3. Dans Explorateur de solutions, cliquez avec le bouton droit sur le projet WebView2WindowsFormsBrowser, puis sélectionnez Générer.

   Cela génère le fichier SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojprojet . Cette opération peut prendre quelques minutes.

   Si vous recevez des messages d’erreur concernant le pack de développement .NET Framework 4.6.2 manquant, suivez les étapes ci-dessous. Sinon, passez à la section principale suivante ci-dessous.

4. Dans Visual Studio, sélectionnez Déboguer>Démarrer le débogage (F5).

   La fenêtre exemple d’application s’ouvre :

   

5. Utiliser l’exemple d’application ; consultez fichier README pour WebView2WindowsFormsBrowser.

6. Dans Visual Studio, sélectionnez Déboguer>Arrêter le débogage. Visual Studio ferme l’application.

Étape 7 : Installer .NET Framework 4.6.2 Developer Pack

Si vous générez le projet WebView2WindowsFormsBrowser et recevez des messages d’erreur concernant le pack de développement .NET Framework 4.6.2 manquant, suivez les étapes ci-dessous. Sinon, passez à la section principale suivante ci-dessous.

1. Accédez à Télécharger .NET Framework, sélectionnez v4.6.2, puis cliquez sur le bouton Télécharger le pack de développement .NET Framework 4.6.2 :

   

2. Dans Microsoft Edge, sélectionnez Paramètres et autres>Téléchargements> Afficher dans l’icônedu dossier :

   

3. Dans le Downloads dossier , double-cliquez sur le fichier, par ndp462-devpack-kb3151934-enu.exeexemple .

   La boîte de dialogue Contrat de licence microsoft .NET Framework Developer Pack s’affiche :

   

4. Cochez la case J’accepte les termes et conditions du contrat de licence , puis cliquez sur le bouton Installer .

   Une fenêtre Contrôle de compte d’utilisateur s’affiche et vous demande « Voulez-vous autoriser cette application à apporter des modifications à votre appareil ? »

5. Cliquez sur le bouton Oui .

   La boîte de dialogue Installation réussie du pack de développement Microsoft .NET Framework s’affiche :

   

6. Cliquez sur le bouton Fermer .

Microsoft .NET Framework 4.6.2 Developer Pack est maintenant installé sur votre ordinateur.

Étape 8 : Mettre à jour ou installer le Kit de développement logiciel (SDK) WebView2

1. Kit de développement logiciel (SDK) WebView2 : Mettez à jour ou installez le Kit de développement logiciel (SDK) WebView2 sur le nœud de projet (et non le nœud de solution) dans Explorateur de solutions. Dans une fenêtre ou un onglet distinct, consultez Installer ou mettre à jour le Kit de développement logiciel (SDK) WebView2 dans Configurer votre environnement de développement pour WebView2. Suivez les étapes décrites dans cette section, revenez à cette page et continuez ci-dessous.

   

Étape 9 : Générer et exécuter le projet mis à jour

1. Si vous venez d’installer .NET Framework 4.6.2 Developer Pack ci-dessus, fermez Visual Studio, puis ouvrez à nouveau le fichier solution dans Visual Studio, à partir du répertoire :

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

   ou :

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

En haut de Visual Studio, définissez la cible de build comme suit :

1. Dans la liste déroulante Configurations de solution, sélectionnez Déboguer ou Mettre en production.

2. Dans la liste déroulante Plateformes de solutions, sélectionnez N’importe quel processeur.

3. Dans Explorateur de solutions, cliquez avec le bouton droit sur le projet WebView2WindowsFormsBrowser, puis sélectionnez Générer.

   Cela génère le fichier SampleApps/WebView2WindowsFormsBrowser/WebView2WindowsFormsBrowser.vcxprojprojet .

4. Dans Visual Studio, sélectionnez Déboguer>Démarrer le débogage (F5).

   La fenêtre exemple d’application s’ouvre :

   

   • Le menu Contrôle a des éléments de menu bascule pour les touches d’accélérateur et Autoriser la suppression externe.
   • Le menu Affichage comporte des sous-menus Zoom et Couleur d’arrière-plan .
   • Le bouton Événements ouvre la fenêtre EventMonitor .

5. Dans Visual Studio, sélectionnez Déboguer>Arrêter le débogage. Visual Studio ferme l’application.

Étape 10 : Inspecter le code

1. Dans l’éditeur de code Visual Studio, inspectez le code :

   

Voir aussi

• Informations de référence sur l’API WebView2
• Prise en main de WebView2 dans les applications WinForms