Prise en main de WinUI 2 pour UWP

WinUI 2.8 est la dernière version stable de WinUI qui peut être utilisée pour créer des applications UWP de production (et des applications de bureau utilisant XAML Islands).

La bibliothèque est disponible en tant que package NuGet qui peut être ajouté à n’importe quel projet Visual Studio nouveau ou existant.

Configurer Visual Studio pour le développement UWP

Téléchargez Visual Studio 2022 et installez les outils pour le développement UWP. Pour obtenir des instructions plus détaillées, consultez Créer une application UWP dans la documentation Visual Studio.

Sous l’onglet Charges de travail de l’application Visual Studio Installer, sélectionnez les charges de travail et les composants suivants :

Télécharger et installer WinUI

1. Ouvrez un projet existant ou créez un projet à l’aide du modèle Application vide sous Visual C# > Windows > Universal, ou le modèle approprié pour votre projection de langage.

   Important

   Pour utiliser WinUI 2.8, vous devez définir TargetPlatformVersion >= 10.0.18362.0 et TargetPlatformMinVersion >= 10.0.17763.0 dans les propriétés du projet.

2. Dans le panneau Explorateur de solutions, cliquez avec le bouton droit sur le nom de votre projet, puis sélectionnez Gérer les packages NuGet.

   
   panneau Explorateur de solutions avec le projet cliqué avec le bouton droit et l’option Gérer les packages NuGet mise en surbrillance.

3. Dans le Gestionnaire de package NuGet, sélectionnez l’onglet Parcourir et recherchez Microsoft.UI.Xaml ou WinUI. Sélectionnez les packages NuGet WinUI que vous souhaitez utiliser (le package Microsoft.UI.Xaml contient des contrôles Fluent et des fonctionnalités adaptés à toutes les applications). Cliquez sur Installer.

   Cochez la case « Inclure la préversion » pour afficher les dernières versions préliminaires qui incluent de nouvelles fonctionnalités expérimentales.

   
   boîte de dialogue Gestionnaire de package NuGet montrant l’onglet Parcourir avec winui dans le champ de recherche et inclure la préversion activée.

4. Ajoutez les ressources de thème WinUI à votre fichier App.xaml.

   Il existe deux façons de procéder, selon que vous disposez de ressources d’application supplémentaires.

   a) Si vous n’avez pas besoin d’autres ressources d’application, ajoutez l’élément de ressources WinUI XamlControlsResources comme illustré dans l’exemple suivant :

   <Application
       x:Class="ExampleApp.App"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       RequestedTheme="Light">
   
       <Application.Resources>
           <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
       </Application.Resources>
   
   </Application>
   

   b. Si vous avez d’autres ressources, nous vous recommandons d’ajouter ces ressources à XamlControlsResources.MergedDictionaries. Cela fonctionne avec le système de ressources de la plateforme pour permettre le remplacement des ressources XamlControlsResources.

   <Application
       x:Class="ExampleApp.App"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:controls="using:Microsoft.UI.Xaml.Controls"
       RequestedTheme="Light">
   
       <Application.Resources>
           <controls:XamlControlsResources>
               <controls:XamlControlsResources.MergedDictionaries>
                   <ResourceDictionary Source="/Styles/Styles.xaml"/>
                   <!-- Other app resources here -->
               </controls:XamlControlsResources.MergedDictionaries>
           </controls:XamlControlsResources>
       </Application.Resources>
   
   </Application>
   

5. Ajoutez une référence au package WinUI aux pages XAML et/ou aux pages code-behind.

   • Dans votre page XAML, ajoutez une référence en haut de votre page

     xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
     

   • Dans votre code (si vous souhaitez utiliser les noms de type sans les qualifier), vous pouvez ajouter une directive using.

     using MUXC = Microsoft.UI.Xaml.Controls;
     

Étapes supplémentaires pour un projet C++/WinRT

Lorsque vous ajoutez un package NuGet à un projet C++/WinRT, l’outil génère un ensemble d’en-têtes de projection dans le dossier \Generated Files\winrt de votre projet. Pour placer ces fichiers d’en-têtes dans votre projet, afin que les références à ces nouveaux types soient résolues, vous pouvez accéder à votre fichier d’en-tête précompilé (généralement pch.h) et les inclure. Voici un exemple qui inclut les fichiers d’en-tête générés pour le package Microsoft.UI.Xaml.

// pch.h
...
#include <winrt/Microsoft.UI.Xaml.Automation.Peers.h>
#include <winrt/Microsoft.UI.Xaml.Controls.Primitives.h>
#include <winrt/Microsoft.UI.Xaml.Media.h>
#include <winrt/Microsoft.UI.Xaml.XamlTypeInfo.h>
...

Pour obtenir une procédure pas à pas complète de l’ajout d’une prise en charge simple de WinUI à un projet C++/ WinRT, consultez un exemple Simple C++/WinRT WinUI.

WinUI sur GitHub

Nous accueillons les rapports de bogues dans le dépôt microsoft-ui-xaml sur GitHub.