Eine einfache C++/WinRT-Windows-UI-BeispielbibliothekA simple C++/WinRT Windows UI Library example

Dieses Thema führt durch den Prozess zum Hinzufügen einer einfachen Unterstützung für die Windows-UI-Bibliothek (WinUI) zu einem C++/WinRT-Projekt.This topic walks you through the process of adding simple support for the Windows UI (WinUI) Library to your C++/WinRT project. Die Windows-UI-Bibliothek ist übrigens ebenfalls in C++/WinRT geschrieben.Incidentally, the Windows UI Library is itself written in C++/WinRT.

Hinweis

Das Toolkit für die Windows-UI-Bibliothek (WinUI) steht in Form von NuGet-Paketen zur Verfügung, die mithilfe von Visual Studio zu einem vorhandenen oder neuen Projekt hinzugefügt werden können, wie wir in diesem Thema sehen werden.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. Weitere Hintergrundinformationen sowie Details zu Einrichtung und Unterstützung findest du unter Erste Schritte mit der Windows-UI-Bibliothek.For more background, setup, and support info, see Getting started with the Windows UI Library.

Erstellen einer leeren App (HelloWinUICppWinRT)Create a Blank App (HelloWinUICppWinRT)

Erstelle in Visual Studio ein neues Projekt anhand der Projektvorlage Leere App (C++/WinRT) .In Visual Studio, create a new project using the Blank App (C++/WinRT) project template. Stelle sicher, dass du die Vorlage (C++/WinRT) und nicht die Vorlage (Universelles Windows) verwendest.Make sure that you're using the (C++/WinRT) template, and not the (Universal Windows) one.

Nenne das neue Projekt HelloWinUICppWinRT und deaktiviere Legen Sie die Projektmappe und das Projekt im selben Verzeichnis ab (damit die Ordnerstruktur mit der exemplarischen Vorgehensweise übereinstimmt).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.

Installieren des Microsoft.UI.Xaml-NuGet-PaketsInstall the Microsoft.UI.Xaml NuGet package

Klicke auf Projekt > NuGet-Pakete verwalten... > Durchsuchen, gib Microsoft.UI.Xaml in das Suchfeld ein, wähle das Element in den Suchergebnissen aus, und klicke dann auf Installieren, um das Paket für das Projekt zu installieren (es wird auch eine Aufforderung zur Zustimmung zu einer Lizenzvereinbarung angezeigt).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). Installiere nur das Paket Microsoft.UI.Xaml, nicht Microsoft.UI.Xaml.Core.Direct.Be careful to install only the Microsoft.UI.Xaml package, and not Microsoft.UI.Xaml.Core.Direct.

Deklarieren von WinUI-AnwendungsressourcenDeclare WinUI application resources

Öffne App.xaml, und füge das folgende Markup zwischen den vorhandenen öffnenden und schließenden Application-Tags ein.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>

Hinzufügen eines WinUI-Steuerelements zu MainPageAdd a WinUI control to MainPage

Öffne als Nächstes MainPage.xaml.Next, open MainPage.xaml. Im vorhandenen öffnenden Seite-Tag befinden sich bereits einige XML-Namespacedeklarationen.In the existing opening Page tag there are some xml namespace declarations. Füge die XML-Namespacedeklaration xmlns:muxc="using:Microsoft.UI.Xaml.Controls" hinzu.Add the xml namespace declaration xmlns:muxc="using:Microsoft.UI.Xaml.Controls". Füge dann das folgende Markup zwischen den vorhandenen öffnenden und schließenden Page-Tags ein. Damit wird das vorhandene StackPanel-Element überschrieben.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>

Bearbeiten Sie „pch.h" nach Bedarf.Edit pch.h, as necessary

Wenn du einem C++/WinRT-Projekt ein NuGet-Paket hinzufügst (z. B. das Paket Microsoft.UI.Xaml, das du zuvor hinzugefügt hast) und das Projekt erstellst, generieren die Tools einen Satz von Projektionsheaderdateien im Ordner \Generated Files\winrt des Projekts.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. Wenn du die exemplarische Vorgehensweise befolgt hast, besitzt du jetzt einen Ordner \HelloWinUICppWinRT\HelloWinUICppWinRT\Generated Files\winrt.If you've followed along with the walkthrough, you'll now have a \HelloWinUICppWinRT\HelloWinUICppWinRT\Generated Files\winrt folder. Wenn du diese Headerdateien in das Projekt einbinden möchtest, damit Verweise auf diese neuen Typen aufgelöst werden, kannst du zu deiner vorkompilierten Headerdatei wechseln (normalerweise pch.h) und sie einschließen.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.

Sie brauchen nur die Überschriften für die von Ihnen verwendeten Typen einzubeziehen.You need to include only the headers that correspond to the types that you use. Hier finden Sie jedoch ein Beispiel, in dem alle generierten Headerdateien für das Microsoft.UI.Xaml-Paket einbezogen werden.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"
...

Bearbeiten von „MainPage.cpp“Edit MainPage.cpp

Lösche in MainPage.cpp den Code in deiner Implementierung von MainPage::ClickHandler, da sich myButton nicht mehr im XAML-Markup befindet.In MainPage.cpp, delete the code inside your implementation of MainPage::ClickHandler, since myButton is no longer in the XAML markup.

Jetzt kannst du das Projekt kompilieren und ausführen.You can now build and run the project.

Screenshot: einfache C++/WinRT-Windows-UI-Beispielbibliothek