Semplice esempio di libreria dell'interfaccia utente di Windows in C++/WinRTA simple C++/WinRT Windows UI Library example

Questo argomento illustra nel dettaglio il processo di aggiunta di supporto semplice per la libreria dell'interfaccia utente di Windows (WinUI) in un progetto C++/WinRT.This topic walks you through the process of adding simple support for the Windows UI (WinUI) Library to your C++/WinRT project. Tra l'altro, la libreria dell'interfaccia utente di Windows è scritta in C++/WinRT.Incidentally, the Windows UI Library is itself written in C++/WinRT.

Nota

Il toolkit della libreria dell'interfaccia utente di Windows (WinUI) è disponibile come pacchetto NuGet che è possibile aggiungere a qualsiasi progetto nuovo o esistente usando Visual Studio, come vedremo in questo argomento.The Windows UI (WinUI) Library toolkit is available as NuGet packages that you can add to any existing or new project using Visual Studio, as we'll see in this topic. Per altre informazioni di base, sull'installazione e sul supporto, vedi Introduzione alla libreria dell'interfaccia utente di Windows.For more background, setup, and support info, see Getting started with the Windows UI Library.

Creare un'app vuota (HelloWinUICppWinRT)Create a Blank App (HelloWinUICppWinRT)

In Visual Studio crea un nuovo progetto usando il modello App vuota (C++/WinRT) .In Visual Studio, create a new project using the Blank App (C++/WinRT) project template. Verifica che il modello usato sia (C++/WinRT) e non (Windows universale) .Make sure that you're using the (C++/WinRT) template, and not the (Universal Windows) one.

Imposta il nome del nuovo progetto su HelloWinUICppWinRT e, facendo in modo che la struttura di cartelle corrisponda alla procedura dettagliata, deseleziona Inserisci soluzione e progetto nella stessa directory.Set the name of the new project to HelloWinUICppWinRT, and (so that your folder structure will match the walkthrough) uncheck Place solution and project in the same directory.

Installare il pacchetto NuGet Microsoft.UI.XamlInstall the Microsoft.UI.Xaml NuGet package

Fai clic su Progetto > Gestisci pacchetti NuGet > Sfoglia, digita o incolla Microsoft.UI.Xaml nella casella di ricerca, seleziona l'elemento nei risultati della ricerca e quindi fai clic su Installa per installare il pacchetto nel tuo progetto. Verrà anche visualizzato un messaggio di richiesta relativo al contratto di licenza.Click Project > Manage NuGet Packages... > Browse, type or paste Microsoft.UI.Xaml in the search box, select the item in search results, and then click Install to install the package into your project (you'll also see a license agreement prompt). Presta attenzione a installare solo il pacchetto Microsoft.UI.Xaml e non Microsoft.UI.Xaml.Core.Direct.Be careful to install only the Microsoft.UI.Xaml package, and not Microsoft.UI.Xaml.Core.Direct.

Dichiarare le risorse di WinUI per le applicazioniDeclare WinUI application resources

Apri App.xaml e incolla il markup seguente tra i tag Application di apertura e chiusura esistenti.Open App.xaml and paste the following markup between the existing opening and closing Application tags.

<Application.Resources>
    <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls"/>
</Application.Resources>

Aggiungere un controllo WinUI a MainPageAdd a WinUI control to MainPage

Apri quindi MainPage.xaml.Next, open MainPage.xaml. Nel tag Page di apertura esistente sono presenti alcune dichiarazioni di spazio dei nomi XML.In the existing opening Page tag there are some xml namespace declarations. Aggiungi la dichiarazione di spazio dei nomi XML xmlns:muxc="using:Microsoft.UI.Xaml.Controls".Add the xml namespace declaration xmlns:muxc="using:Microsoft.UI.Xaml.Controls". Incolla quindi il markup seguente tra i tag Page di apertura e di chiusura esistenti, sovrascrivendo l'elemento StackPanel esistente.Then, paste the following markup between the existing opening and closing Page tags, overwriting the existing StackPanel element.

<muxc:NavigationView PaneTitle="Welcome">
    <TextBlock Text="Hello, World!" VerticalAlignment="Center" HorizontalAlignment="Center" Style="{StaticResource TitleTextBlockStyle}"/>
</muxc:NavigationView>

Modificare pch.h in base alle esigenzeEdit pch.h, as necessary

Quando aggiungi un pacchetto NuGet a un progetto C++/WinRT, ad esempio il pacchetto Microsoft.UI.Xaml aggiunto in precedenza, e generi il progetto, gli strumenti generano un set di file di intestazione della proiezione nella cartella \Generated Files\winrt del progetto.When you add a NuGet package to a C++/WinRT project (such as the Microsoft.UI.Xaml package, which you added earlier), and build the project, the tooling generates a set of projection header files in your project's \Generated Files\winrt folder. Se hai seguito la procedura dettagliata, avrai ora una cartella \HelloWinUICppWinRT\HelloWinUICppWinRT\Generated Files\winrt.If you've followed along with the walkthrough, you'll now have a \HelloWinUICppWinRT\HelloWinUICppWinRT\Generated Files\winrt folder. Per inserire i file delle intestazioni nel progetto, in modo che i riferimenti a questi nuovi tipi vengano risolti, puoi passare al file di intestazione precompilata (che in genere è pch.h) e includerli.To bring those headers files into your project, so that references to those new types resolve, you can go into your precompiled header file (typically pch.h) and include them.

È sufficiente includere solo le intestazioni che corrispondono ai tipi usati.You need to include only the headers that correspond to the types that you use. Di seguito è comunque riportato un esempio che include tutti i file di intestazione generati per il pacchetto Microsoft.UI.Xaml.But here's an example that includes all of the generated header files for the Microsoft.UI.Xaml package.

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

Modificare MainPage.cppEdit MainPage.cpp

In MainPage.cpp elimina il codice all'interno dell'implementazione di MainPage::ClickHandler perché myButton non è più incluso nel markup XAML.In MainPage.cpp, delete the code inside your implementation of MainPage::ClickHandler, since myButton is no longer in the XAML markup.

A questo punto puoi compilare ed eseguire il progetto.You can now build and run the project.

Screenshot di una semplice libreria dell'interfaccia utente di Windows in C++/WinRT