一個基本的 C++/WinRT Windows UI 程式庫 2 範例(UWP)

本主題將引導你了解如何在 C++/WinRT UWP 專案中加入 Windows UI 程式庫(WinUI)的基本支援。 這個主題特別針對 WinUI 2,也就是 UWP 應用程式。 桌面應用程式方面,有 WinUI 3。 順帶一提,WinUI 本身是用 C++/WinRT 撰寫的。

這很重要

桌面應用程式方面,Windows 應用程式 SDK 提供 Windows UI 程式庫(WinUI)3。 WinUI 3 並非設計用來配合本主題的攻略,該攻略是針對 UWP。 另見從 UWP 遷移到 Windows 應用程式 SDK

Note

Windows UI 程式庫(WinUI)工具包以 NuGet 套件形式提供,你可以用 Visual Studio 加入任何現有或新專案,正如本專題所述。 更多背景、設定與支援資訊,請參閱「開始使用 Windows UI 程式庫」。

建立一個空白應用程式(HelloWinUICppWinRT)

在 Visual Studio 中,使用 Blank App(C++/WinRT)專案範本建立一個新的 UWP 專案(WinUI 3 桌面應用程式則使用 Blank App, Packaged(WinUI 3 桌面版)範本)。 確定你使用的是(C++/WinRT)範本,而不是(通用 Windows)範本。

將新專案名稱設為 HelloWinUICppWinRT,並且(這樣你的資料夾結構會與攻略一致)取消勾選 「將解決方案與專案置入同一目錄」。

安裝 Microsoft。UI。Xaml NuGet 套件

按一下 Project>Manage NuGet Packages...>Browse,在搜尋方塊中輸入或貼上 Microsoft.UI.Xaml,在搜尋結果中選取該項目,然後按一下 Install,將套件安裝到您的專案中(您也會看到授權合約提示)。 請小心只安裝 Microsoft。UI。Xaml 套件,不是 Microsoft。UI。Xaml.Core.Direct

宣告 WinUI 應用程式資源

打開 App.xaml 並貼上以下標記,夾在現有的開啟與關閉 應用程式 標籤之間。

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

在主頁面新增 WinUI 控制項

接著,打開 MainPage.xaml。 在現有的開頭 頁面 標籤中,有一些 XML 命名空間宣告。 新增 XML 命名空間宣告 xmlns:muxc="using:Microsoft.UI.Xaml.Controls"。 接著,將以下標記貼在現有的開頁 與關閉頁面 標籤之間,覆蓋現有的 StackPanel 元素。

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

必要時編輯 pch.h。

當你將 NuGet 套件加入 C++/WinRT 專案(例如 Microsoft,UI。Xaml 套件,你之前加入的),然後建置專案,工具會在你的專案\Generated Files\winrt資料夾中產生一組投影標頭檔案。 如果你有跟著攻略走,現在你就會有一個 \HelloWinUICppWinRT\HelloWinUICppWinRT\Generated Files\winrt 資料夾。 若要將這些標頭檔加入到專案中,讓對這些新類型的參考能順利解析,你可以在預先編譯標頭檔(通常是 pch.h)中將它們包含進去。

你只需要包含與你所使用類型對應的標頭。 但這裡有一個範例,包含 Microsoft.UI.Xaml 套件的所有產生的標頭檔。

// 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"
...

編輯MainPage.cpp

MainPage.cpp中,刪除你實作 MainPage::ClickHandler 中的程式碼,因為 myButton 已不再出現在 XAML 標記中。

您現在可以建置並執行專案。

簡單的 C++/WinRT Windows UI 程式庫 截圖