🤖 作者：包瑞清（richie bao）: lastmod: 2025-01-07T09:39:35+08:00 10.1 框架选择， VS 安装项 link10.1.1 框架选择 linkWindows 提供了广泛的编程语言、框架（frameworks）和工具来构建应用程序，包括WinUI、UWP（Universal Windows Platform）、桌面版 React Native、WPF（Windows Presentation Foundation）、Windows Forms，以及多种跨平台跨平台框架。支持的编程语言包括 C++、C#，JavaScript等。针对 Windows 开发应用程序的多种选择，其最佳选项取决于用户对应用程序的需求、编程语言的选择和对相关技术的熟悉程度。表列出了当前 Windows 最流行的应用开发框架（App Development Frameworks）及其支持的功能。表：应用开发框架功能比较（表引自，Overview of framework options） Feature（功能）\框架 .NET MAUI Blazor Hybrid React Native for Desktop UWP XAML (Windows.UI.Xaml) Win32 (MFC or ATL) Windows Forms WinUI 3 WPF Language（支持的语言） C# C# JavaScript, TypeScript C#, C++, Visual Basic C++, Rust C#, Visual Basic C#, C++ C#, Visual Basic UI language（用户界面语言） XAML/Code Razor JSX XAML Code Code XAML XAML UI designer（用户界面设计器） ❌ ❌ ❌ ✅ ❌ ✅ ❌ ✅ UI debugging（用户界面调试） Hot Reload Hot Reload Fast Refresh Hot Reload - Hot Reload Hot Reload Hot Reload Fluent Design ✅ ✅ ✅ ✅ (via WinUI 2) ❌ ❌ ✅ ❌ .NET .NET .NET N/A .NET Core & .NET Native N/A .NET & .NET Framework .NET .NET & .NET Framework Windows App SDK（Software Development Kit） ✅ (more info) ✅ via MAUI ✅ (more info) ❌ ✅ ✅ (more info) ✅ ✅ (more info) Great for touch（适合触摸操作） ✅ ✅ ✅ ✅ ❌ ❌ ✅ ❌ Cross-platform（跨平台） ✅ ✅ ✅ ❌ ❌ ❌ ❌ ❌ Xbox/HoloLens apps ❌ ❌ ✅ ✅ ❌ ❌ ❌ ❌ Sandboxing (AppContainer) ❌ ❌ ✅ ✅ ❌ ❌ ❌ ❌ Currently supported（当前支持） ✅ ✅ ✅ ✅ ✅ ✅ ✅ ✅ Receiving updates（接收更新） ✅ ✅ ✅ ✅ (security & bugfix) ✅ ✅ ✅ ✅ Roadmap（开发路径） GitHub GitHub GitHub n/a n/a GitHub GitHub GitHub XAML（Extensible Application Markup Language），是微软开发的标记语言，主要用于构建用户界面（UI），允许开发者通过简单的 XML 结构定义控件、布局、样式和事件，类似于 HTML 和 XML，可以清晰的分离界面的结构（标记部分）与逻辑（代码部分）。 XAML 是一种声明式语言（Declarative Language），可以使用一种语言结构初始化对象并设置对象的属性，这种结构展示了多个对象之间的层级关系，并通过支持扩展类型的类型约定来扩展类型，这意味着开发者通过 XAML 语言定义界面元素的外观和布局，而不是通过编程方式逐步构建界面。声明式的方式使得界面的结构清晰易懂，且易于维护。XAML 语言支持在开发过程中不同工具和角色之间交换源代码，例如在设计工具和互动开发环境（Interactive Development Environment，IDE）之间交换 XAML 源代码，或在开发人员之间交换源代码。通过 XAML 作为交换格式，可以保持设计师角色和开发者角色的独立性或将其结合起来，并在开发过程中不断迭代代码。XAML 语言文件扩展名通常为 .xaml，可以通过可视化设计工具（用户界面设计，UI designer）进行编辑和预览，并支持数据绑定，允许控件的属性与后台数据模型直接连接，使得 UI 更新与数据源保持同步，便于实现响应式界面，是现代 Windows 应用程序开发不可或缺的组成部分。 Fluent Design (System) ，是微软提出的一种设计语言，旨在提供更加现代化、灵活且互动性强的体验，其首次在 Windows 10 中提出，并随着 Windows11 及其他微软产品的开发不断演进。Fluent Design 强调视觉、声音、动画和触感的统一，旨在为开发者提供更直观和丰富的互动界面，其设计理解基于的主要核心要素有光纤（Light）、深度（Depth）、运动（Motion）、材质（Material）和缩放（Scale）等。Fluent2 是 Fluent Design（Fluent1）的迭代版本，提供了更多的视觉效果和更强大的互动支持，着重提升了现代操作系统和应用的用户体验，更具沉浸感和动态感的交换界面。WinUI3 是 Windows App SDK 的一部分，包含了 Fluent2 的最新设计控件和效果。开发者可以通过 WinUI 控件轻松实现 Fluent2 风格的 UI，为开发现代桌面和跨平台应用的一个重要设计语言，已帮助开发者创建更美观、直观且一致的用户界面。 Windows App SDK，是微软提供的一组新的开发者组件和工具，代表了 Windows 应用开发平台的下一次演进，其提供了一套任何 Window11 上的桌面应用都可以一致使用的统一的应用程序接口（Application Programming Interface ，APIs）和组件，并且向下兼容 Windows10，版本1809及以上。Windows APP SDK 并不替代 Windows SDK 或现有的桌面 Windows 应用类型，例如 .NET（包括 Windows Forms 和 WPF）及使用 C++ 的桌面 Win32 应用。相反，Windows App SDK补充了这些现有工具和应用类型，提供了一套开发者可以在这些平台上依赖的公共 API，包括 WinUI3。通过参考应用开发框架功能比较表，选择的框架应该能够同时支持 C++ 和 C#，以便比较演示两种语言的应用开发；并支持 XAML 标记语言，方便构建 UI；最好支持 Fluent Design，用于建立现代感十足的界面设计；且为微软当前和未来持续维护更新，主流的框架。因此选择 WinUI3 框架构建应用开发程序。 WinUI3 是微软推出的一个现代化 UI 框架，专为 Windows 应用开发而设计，是 Windows App SDK 的一部分。WinUI3 是在 UWP（Universial Windows Platform）和 WPF（Windows Presentation Foundation）的基础上发展而来，旨在提供更加一致和灵活的跨平台开发体验，支持 Windows10 和 Windows11 应用的开发。WinUI3 的核心特性和优势包括：现代化的 UI 控件和样式。WinUI3 包含了 Fluent2 的最新设计控件和效果，可以帮助开发者创建更美观、现代、和响应式的应用界面；并支持更高效的自定义样式。跨平台支持。WinUI3 支持在 Windows10 和Windows11 上运行，且在未来支持更多的 Windows 设备（如 PC、平板和可穿戴设备）和平台。支持桌面应用。WinUI3 允许开发者创建传统的桌面应用程序，而不仅仅是 UWP 应用，并兼容现有的 Windows 桌面技术，如 WPF 和WinForms（Wndows Forms）。对于传统桌面开发，WinUI3 提供了同一的 UI 和控件，以便开发者更加方便的开发现代化的桌面应用。高性能和可扩展性。WinUI3 提供了高性能的 UI 渲染，可以在不同的设备上运行时提供流畅的动画、图形和交互；并支持 MVVM （Model-View-ViewModel）架构，帮助分离数据层、界面层和逻辑层，有助于提高应用的可维护性和扩展性。与 .NET 和 C++ 兼容。 WinUI3 支持 C# 和 XAML 开发，可以通过 .NET 和 C# 编写应用程序的逻辑；并支持 C++/WinRT，使得开发者可以使用 C++ 语言来构建 Windows 应用程序。支持多平台和开发工具。通过 Windows App SDK，WinUI3 可以与其他现代 Windows 开发工具和库集成；并支持 Visual Studio、Visual Studio Code 等开发环境。 10.1.2 技术/组件关系梳理 link前文中涉及到框架 WinUI，标记语言 XAML， C++/WinRT，Windows App SDK 和 Fluent Design System 等技术，其之间的关系如表，技术/组件作用/功能关系说明 WinUI3 现代化 UI 框架，用于构建 Windows 应用用户界面与 XAML 配合使用，构建 UI；与 Fluent Design System 配合，提供现代化的设计风格提供一套现代 UI 控件和设计规范，支持响应式和动态 UI 元素 XAML 用于声明式界面设计的标记语言与 WinUI3 配合，定义界面元素和布局声明界面结构、支持数据绑定和与后台（代码）逻辑的交互 C++/WinRT C++ 与 WinRT API 的互操作库使 C++ 开发者能够调用 WinRT API，支持 Windows 应用开发作为后台代码（backing code），处理应用的业务逻辑，操作系统服务，及与 UI 的交互 WinRT Windows Runtime API，提供底层操作系统服务被 C++/WinRT 或 C# 访问，提供文件管理，UI 控件等服务提供应用开发所需的操作系统 API，可通过 C++/WinRT 调用 Window App SDK 开发框架，整合多种工具和库整合了 WinUI3、C++/WinRT、WinRT，为开发者提供跨版本的 Windows 应用开发工具简化 Windows 应用开发，支持最新功能和跨版本的兼容性 Fluent Design System 设计语言，提供现代的视觉风格在 WinUI3 中实现，用于增强 UI 的外观和交互性提供光影、透明度、动画等视觉效果，通过 WinUI3 实现控件的外观设计 WinUI3 是开发 Windows 应用界面的框架，结合了标记语言 XAML 和 Fluent Design System 实现现代化的用户界面设计；C++/WinRT 和 WinRT 提供底层 API 支持，供开发者用高性能代码实现应用逻辑；Windows App SDK 将所有开发工具（如 WinUI、WinRT 等）打包，成为现代 Windows 应用开发的基础。 10.1.3 VS 安装项 link在安装 Visual Studio[2022]（VS）时，需要安装用于开发 WinUI 和 Windows App SDK 所需的工作负载（workloads）和组件（components）。如果已完成安装，但没有勾选相关负载和组件时，则可以打开 Visual Studio Installer应用，选择修改以添加所需负载和组件。在 VS 安装程序的 workloads 选项卡中，使用 Windows App SDK，开发 C# 应用程序，需要选择负载Windows application development。如果开发 C++ 应用程序，则还需要在Installation Details（安装详情）面板中勾选C++ WinUI app development tools，如图。图 10-1 VS 安装勾选模块 Windows 为开发者提供了一种特殊模式，可以调整安全设置以运行正在开发的应用程序。在使用 VS 构建、部署和测试应用程序前需要启用Developer Mode，其位于Windows 设置->System->For developers页面下。 VS 项目模板包括快速创建应用程序所需的所有文件，在从 WinUI3 应用程序模板VS->Create a new project->Blank App, Packaged (WinUI 3 in Desktop)（如图）创建项目后（项目名称起名为WinUI3Cpp），就已经内置了一个可以运行的应用程序（如图），可以在Soluution Explorer中查看文件结构，并打开文件查看代码。执行Start Debugging[Local Machine]（快捷键 F5）后，结果如图，可以用Live Visual Tree，XAML Live Preview与.xaml代码行交互定位来辅助设计 UI 界面，诊断可能出现的问题，调试代码。同时，编译该项目，部署到本地机器上，并在调试模式下运行，结果如图。图 10-2 选择 Blank App, Packaged (WinUI 3 in Desktop) 图 10-3 打开应用程序，查看文件结构图 10-4 运行后的界面，查看 Live Visual Tree，XAML Live Preview 及 Diagnostic Tools 图 10-5 应用程序运行结果，点击按钮前后变化 Windows App SDK（含 WinUI）作为 NuGet 包发布，意味着更新可能会与 Windows 和 VS 的更新不同步。因此，创建项目的 VS 模板可能没有引用最新的 Windows App SDK NutGet 包。为了确保获得最新的功能和修复，建议每次在 VS 中创建新项目时更新 NutGet 包，其位于 VS->Tools->NuGet Package Manager->Manage NuGet Packages for Solution...下。 10.2 默认应用（C++）代码解读和 Hello world! link10.2.1 默认应用（C++）代码解读 linkBlank App, Packaged (WinUI 3 in Desktop)模板创建了一个带有交互式按钮的窗口（图10-5），当点击按钮后，显示在按钮上的文字Click Me会变为Clicked。 10.2.1.1 项目文件结构 link首先查看Solution Explorer（解决方案的资源管理器），即项目的文件结构，如图10-3，各文件的具体解释如下表，表，文件说明，参考调整于 Build a Hello World app using C# and WinUI 3 / Windows App SDK（https://learn.microsoft.com/en-us/windows/apps/how-tos/hello-world-winui3）项（Item）描述（Description） Solution 'WinUI3Cpp' 为一个解决方案（一个解决方案可以包含多个项目（Project）），是项目的逻辑容器（Logical container）。项目通常是应用程序（Apps），但也支持类库（class libraries）。此处的解决方案名称为WinUI3Cpp WinUI3Cpp(Desktop) 为一个项目，是应用程序文件的逻辑容器，用于构建基于 WinUI3 的桌面应用程序。名称与创建项目时，同为该项目起的名称 External Dependencies 和 References 为应用依赖的框架（如，.NET，Windows SDK 等）和包（如，Windows App SDK）；也包含开发者在应用中引入的其他功能和第三方库 Assets 资产文件夹，包含用于应用程序的图标、图像和其它媒体资产，为保存用户界面需要的静态文件 App.manifest 这个应用程序清单文件包含与应用安装在用户设备上时 Windows 显示应用程序方式相关的配置 App.xaml 该标记文件指定应用所依赖的，共享并全局可访问的资源，相关联的代码文件有App.xaml.cpp和App.xaml.h App.xaml.cpp 和 App.xaml.h .cpp代码后置（code-behind）文件表示应用程序业务逻辑（business logic）的入口点，负责创建和激活MainWindow实例。.h为声明.cpp的头文件，定义应用程序类App的接口 MainWindow.xaml 该标记文件包含了应用程序主窗口展示的相关内容 MainWindow.xaml.cpp 和 MainWindow.xaml.h .cpp代码后置（code-behind）文件包含了与应用程序主窗口相关的业务逻辑。.h声明与MainWindow.xaml界面逻辑相关的类和成员函数 MainWindow.xaml.idl IDL（Interface Definition Language）文件用于定义应用程序与WinRT接口的交互，提供了MainWindow类的 WinRT投影接口 module.g.cpp 模块生成文件，通常由工具生成，负责与WinRT或COM模块的交互，包含项目模块的初始化和其他低级别设置 Package.appxmanifest 这个包清单文件为开发者提供发布信息、图标、处理器架构和其他细节的配置信息，及应用程序在 Windows Store 中显示方式等内容，通常包括的版块有Application、Visual Assets、Capabilities、Declarations、Content URIs和Packaging等 packages.config 为包管理配置文件，记录了项目所依赖的包，如Microsoft.WindowsAppSDK、Microsoft.Windows.SDK.BuildTools、Microsoft.Windows.ImplementationLibrary、Microsoft.Windows.CppWinRT和Microsoft.Web.WebView2等 pch.cpp 和 pch.h 预编译头文件，.h包含项目中常用的头文件，以减少重复编译，提供编译速度；.cpp编译.h中的内容，生成预编译头文件 readme.txt 说明文档，通常包含关于项目的基本信息，如项目的功能描述、编译和运行步骤及作者信息等 wil.natvis 该文件是一个用于自定义如何在调试器的Locals和Watch窗口中显示来自 Windows 实现库（Windows Implementation Library，WIL）的本地 C++ 对象的文件，其允许在调试 C++ 应用程序时，更友好地查看复杂的数据结构。本质上，是通过Nativs框架为 WIL类型提供了自定义可视化，使开发者能够在 VS 调试器中更容易理解这些类型的内容上述WinUI3 C++桌面项目，其文件结构可以主要概况为：项目基础文件（app.manifest，Package.appxmanifest）：配置应用元数据和权限。用户界面文件/标记文件（App.xaml，MainWindow.xaml）：配置应用的外观和主窗口。代码逻辑文件/代码文件（*.cpp，*.h）：实现和声明应用程序功能。资源文件（Assets）：存储应用所需的静态资源。工具生成文件（module.g.cpp，wil.natvis）：辅助 WinRT和调试器工作。 10.2.1.2 主窗口实现 link主窗口实现主要包括一个标记文件MainWindow.xaml和一个代码文件MainWindow.xaml.cpp，及其对应的头文件MainWindow.xaml.h，及MainWindow.idl IDL 文件。文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp MainWindow.idl 代码 Click Me #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3Cpp::implementation { struct MainWindow : MainWindowT { MainWindow() { // Xaml objects should not call InitializeComponent during construction. // See https://github.com/microsoft/cppwinrt/tree/master/nuget#initializecomponent } int32_t MyProperty(); void MyProperty(int32_t value); void myButton_Click(IInspectable const& sender, Microsoft::UI::Xaml::RoutedEventArgs const& args); }; } namespace winrt::WinUI3Cpp::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; // To learn more about WinUI, the WinUI project structure, // and more about our project templates, see: http://aka.ms/winui-project-info. namespace winrt::WinUI3Cpp::implementation { int32_t MainWindow::MyProperty() { throw hresult_not_implemented(); } void MainWindow::MyProperty(int32_t /* value */) { throw hresult_not_implemented(); } void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&) { myButton().Content(box_value(L"Clicked")); } } namespace WinUI3Cpp { [default_interface] runtimeclass MainWindow : Microsoft.UI.Xaml.Window { MainWindow(); Int32 MyProperty; } } 🤖 代码解读配置：声明了XML文件的版本为 1.0，并指定了文件的字符编码为 UTF-8，为一个标准的 XML 声明，用于确保正确处理文件中的字符编码。 x:Class="WinUI3Cpp.MainWindow"：绑定到WinUI3Cpp.MainWindow类，表明该 XAML 文件将与此 C++/C# 类关联。 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"：定义WinUI 3使用的命名空间，用于包含 UI 相关的控件和元素。 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"：定义 XAML 标记语言本身使用的命名空间，用于支持 XAML 特性，如 x:Name等。 xmlns:local="using:WinUI3Cpp"：引用本地应用程序命名空间（即WinUI3Cpp），用于将本地类型引入 XAML 文件。 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"：用于设计时支持的命名空间，通常用于设计器工具，例如 Blend for Visual Studio （Visual Studio Installer->.NET desktop development[workload]-> Blend for Visual Studio[component]）。 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"：支持标记兼容性的命名空间，允许在多个平台或版本之间兼容使用。 mc:Ignorable="d"：这个属性告诉 XAML 解析器忽略设计时命名空间d，因其只用于设计器工具。 Title="WinUI3Cpp"：设置窗口的标题为WinUI3Cpp。窗口 UI ：定义了一个StackPanel布局容器，将子元素垂直或水平方向堆叠，其中，Orientation="Horizontal"设置StackPanel内部元素按水平方向排列；HorizontalAlignment="Center"和VerticalAlignment="Center"为水平/垂直居中对齐StackPanel内的所有元素。 Click Me：定义了一个Button按钮控件，其中x:Name="myButton"为按钮指定了一个名称myButton，可以在C++/C#代码中引用；Click="myButton_Click"为该按钮的Click事件绑定到myButton_Click方法，当按钮被点击时会调用该方法；Click Me为按钮上显示的文本。：关闭StackPanel标签，结束这个布局容器的定义。：结束Window标签，结束整个窗口的定义。这段 XAML 标记代码定义了一个简单的 WinUI3 应用界面，包含一个水平排列、居中对齐的StackPanel，该面板内有一个按钮控件，其上显示Click Me文本，并在点击时触发myButton_Click事件。 #pragma once：是一种编译指令，确保该头文件在单个编译单元中只被包含一次，防止重复包含头文件，通常用于防止多重包含问题。 #include "MainWindow.g.h"：引入由 XAML 文件自动生成的代码（编译时由 XAML 编译器生成的代码），通常这个文件包含了与 XAML 文件对应的控件、事件等的定义。 namespace winrt::WinUI3Cpp::implementation：该命名空间表示MainWindow类的实现部分，属于WinUI3Cpp项目中实现的命名空间。 struct MainWindow : MainWindowT：是MainWidow类的定义。MainWindowT是模板类，通常由 WinUI 3 自动生成，用于绑定MainWindow类和 XAML 之间的关联。继承MainWindowT使得MainWindow类能够继承与 XAML 文件相关联的行为和功能。 MainWindow() { // Xaml objects should not call InitializeComponent during construction. // See https://github.com/microsoft/cppwinrt/tree/master/nuget#initializecomponent } MainWindow()是MainWindow类的构造函数，其中的注释说明了：XAML 对象不应在构造函数中调用InitializeComponent，这是因为InitializeComponent通常是在 XAML 文件加载并与 C++ 类关联后才调用的。调用InitializeComponent会初始化 XAML 定义的控件，而此时如果在构造函数中调用，可能会遇到尚未完全初始化的资源或控件，因此推荐将其推迟到正确的时间点。InitializeComponent是由 XAML 自动生成的代码来初始化 UI 元素。具体内容可以在MainWindow.g.cpp中找到。 int32_t MyProperty(); void MyProperty(int32_t value); 这两个方法定义了一个属性的 getter和setter： int32_t MyProperty();：是MyProperty属性的 getter方法，返回一个int32_t类型的值。 void MyProperty(int32_t value);：是MyProperty属性的setter方法，接受一个int32_t类型的参数，设置属性的值。位于头文件（.h）的这些方法目前没有实现，通常会在对应的实现文件（.cpp）中提供具体的实现。 void myButton_Click(IInspectable const& sender, Microsoft::UI::Xaml::RoutedEventArgs const& args);：是按钮点击事件的处理函数声明： sender：事件的发送者，通常是触发事件的控件（此处为myButton）。 args：包含有关事件信息的对象，通常是RoutedEventArgs，包括事件的源、附加数据等。 namespace winrt::WinUI3Cpp::factory_implementation：该命名空间定义了工厂实现，用于创建MainWindow实例，与winrt::WinUI3Cpp::implementation命名空间中的实现类相对应。 struct MainWindow : MainWindowT：定义MainWindow的工厂类，用于实例化MainWindow类的对象，其继承了MainWindowT模板。模板参数包括MainWindow和implementation::MainWindow，表示工厂类和实现类之间的关联。这段代码是C++/WinRT项目的头文件，定义了MainWindow类的接口部分和构造函数，具体实现的细节通常在.cpp文件（本例为MainWindow.xaml.cpp）中进行定义和实现。头文件和命名空间 #include "pch.h"：是预编译头文件，通常用于提高编译效率。预编译头文件包含了在多个源文件中都会使用的常用头文件。 #include "MainWindow.xaml.h"：引用MainWindow.xaml.h头文件，包含了由 XAML 文件自动生成的代码和说明，连接了 XAML 与 C++ 实现部分。 #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif 为条件编译，检查MainWindow.g.cpp文件是否存在，如果存在则包含该文件。MainWindow.g.cpp是由 XAML 生成的代码，通常包含 XAML 文件的控件、事件等的实现部分。通过这种方式，项目的构建可以更加灵活。 using namespace winrt;：引入winrt命名空间，winrt是 Microsoft 提供的C++/WinRT库，提供了与 Windows Runtime API 的交互功能。 using namespace Microsoft::UI::Xaml;：引入 WinUI 的 XAML 命名空间，提供了与 WinUI3 中 XAML 相关的功能，如 UI 控件、事件、属性等。项目实现 namespace winrt::WinUI3Cpp::implementation { 定义了winrt::WinUI3Cpp::implementation命名空间，表示该类是WinUI3Cpp项目的实现部分。winrt::是 Windows Runtime 命名空间的前缀。 int32_t MainWindow::MyProperty() { throw hresult_not_implemented(); } int32_t MainWindow::MyProperty()：是MainWindow类中的MyProperty方法的定义，其返回类型是int32_t（即 32 位整数）。 throw hresult_not_implemented();：因上述方法还没实现，因此之间抛出hresult_not_implemented异常，表示该方法尚未实现。 void MainWindow::MyProperty(int32_t /* value */) { throw hresult_not_implemented(); } 这是MainWindow类中另一个MyProperty方法，负责设置属性的值。该方法的参数是一个整数value，但参数用/* value */方式注释掉，表明该参数在方法内还未实现。由于方法尚未实现，同样抛出hresult_not_implemented异常。 void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&) { myButton().Content(box_value(L"Clicked")); } void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&)：是MainWindow类中按钮点击事件的处理函数。此方法在myButton按钮被点击时被调用。其中IInspectable const&是事件的发送者（通常是触发事件的控件或对象）；RoutedEventArgs const&包含有关事件的信息（如，事件源、事件处理等）。 myButton().Content(box_value(L"Clicked"));：将按钮的Content设置为Clicked。其中myButton()是访问 XAML 中x:Name="myButton"按钮控件的方法；box_value是一个用于将字符串（L"Clicked"）转换为 Windows Runtime 类型的函数，Content属性设置按钮的显示内容。这段代码是MainWindow类的实现文件，连接了 XAML 中定义的 UI 控件（如按钮）和 C++ 实现部分。 namespace WinUI3Cpp：声明了一个WinUI3Cpp的命名空间。命名空间用于将代码逻辑组织成一个隔离区域，以避免名称冲突。在这个命名空间下定义的所有类型（如类、接口等）都将以WinUI3Cpp为前缀进行访问。 [default_interface]：为一个特性（attribute），指定了类的默认接口（用于强制生成默认接口，否则不会生成默认接口）。接口是一组函数或方法的声明，这些函数或方法在实现时需要提供具体的行为。在 WinUI3 中，runtimeclass本质上是一个具有默认接口的类，默认接口通常是该类与外部交互的主要接口。这里MainWindow类有一个默认接口，并通常指向自身，因为这个类的本质就是窗口类，用于显示和管理应用的主窗口。 runtimeclass MainWindow : Microsoft.UI.Xaml.Window：runtimeclass关键字用于声明一个 WinRT 类，是 Windows Runtime（WinRT）API 中的一个概念，表示能够在应用程序中动态加载和实例化的类。runtimeclass通常对应一个类，而这个类可以通过 WinRT 接口与其它组件进行交互。MainWindow是一个 WinRT 类（runtimeclass），意味着其是一个可以被实例化并与系统交互的类。MainWindow类继承自Microsoft.UI.Xaml.Window，其是 WinUI3 中的窗口类，提供了窗口管理行为和 UI 呈现的功能。通过继承Window类，MainWindow类可以作为应用程序的主窗口。 {...}：包含MainWindow类的成员。类内包含了构造函数和属性。 MainWindow();：这是MainWindow类的构造函数。构造函数是类的一部分，在类实例化时自动调用，通常用于初始化类的成员。由于没有给构造函数提供参数，是一个无参构造函数。构造函数的实现可以在.cpp文件中，或在实现类时提供。 Int32 MyProperty;：这是一个名为MyProperty的属性，类型是Int32，即一个 32 位整数。Int32类型在 C++/WinRT 中通常对应int类型。通过MyProperty属性，可以读取或设置与MainWindowe类相关的整数值。通常，MyProperty会有相应的getter和setter方法来进行访问和修改。这个 IDL 文件定义了一个MainWindow类，继承自Microsoft.UI.Xaml.Window，表示一个应用程序窗口。MainWindow类有一个无参构造函数和一个Int32类型的属性MyProperty，用于存储一个整数值。MainWindow是一个 WinRT 类，可以与外部的 WinRT API 进行交互。 10.2.2 Hello world! link基于既有默认应用，按钮点击后除了改变按钮的显示内容从Click Me，修改为Clicked外；增加TextBlock控件显示文本，点击按钮前显示文本内容为Hi, there.，点击按钮后显示文本内容为Hello World!。另外，通过检索WinUI 3 Gallery（需从给出的链接下载安装程序，安装后运行查看）现代 UI 框架提供的示例应用，重新配置了按钮的样式，及配置文本显示的字体样式。并将应用的 UI 主题色由暗色模式Dark调整为了亮色模式Light，结果如图10-6。图 10-6 Hello World! 点击按钮前后首先在MainWindow.xaml UI 界面标记文件中调整按钮Button的样式；并增加文本块TextBlock控件。调整StackPanel中的样式为Orientation="Vertical"以垂直向布局按钮和文本块。并修改了窗口的标题为HelloWorld!，修改和增加部分的代码如下， ... Title="HelloWorld!"> 不需要修改MainWindow.xaml.h头文件，只在MainWindow.xaml.cpp代码文件下myButton_Click按钮点击事件的处理函数中增加修改名为x:Name="TB_SayHi"文本块TextBlock的文本内容，修改的部分代码如下， void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&) { myButton().Content(box_value(L"Clicked")); TB_SayHi().Text(L"Hello World!"); } TB_SayHi().Text(L"Hello World!");中TB_SayHi()是对MainWindow类中名为TB_SayHi控件（TextBlock）的访问方法。.Text是TextBLock控件的属性，表示文本框中显示的文本内容。TB_SayHi().Text表示访问该文本框的Text属性。L"Hello World!"是一个宽字符字符串，将文本框的内容设置为"Hello World!"。因此，当按钮被点击时，TB_SayHi文本块的内容被修改为"Hello World!"。应用 UI 主题色的修改位于App.xaml标记文件下，增加代码RequestedTheme="Light"实现，其代码如下， 10.3 C++/WinRT + WinUI3 link10.3.1 数据绑定 link• {x:Bind} 标记扩展图10.7为{x:Bind}标记扩展（markup extension）数据绑定的一个小示例。同前文默认应用，用程序模板Blank App, Packaged (WinUI 3 in Desktop)（C++）创建项目，但项目名为WinUI3X。每次点击按钮Click Me，都会更新上方的数字，增加1。即，属性propertyValue的初始值为 0，通过数据绑定显示在 UI 的TextBlock中，为初始状态；每次点击按钮，propertyValue增加1，并通过Bindings->Update()更新 UI。图 10-7 {x:Bind} 标记扩展试验 App 文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp 代码 Click Me #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3X::implementation { struct MainWindow : MainWindowT { private: int32_t propertyValue = 0; public: MainWindow(){} int32_t MyProperty(); void MyProperty(int32_t value); void myButton_Click(IInspectable const& sender, Microsoft::UI::Xaml::RoutedEventArgs const& args); }; } namespace winrt::WinUI3X::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { int32_t MainWindow::MyProperty() { return propertyValue; } void MainWindow::MyProperty(int32_t value) { propertyValue = value; this->Bindings->Update(); OutputDebugString(L"Property value updated to: "); OutputDebugString(winrt::to_hstring(propertyValue).c_str()); OutputDebugString(L"\r\n"); } void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&) { MyProperty(propertyValue + 1); } } 🤖 代码解读这段 XAML 定义了一个简单的 WinUI3 窗口布局，其中包含一个TextBlock和一个Button，并使用{x:Bind}数据绑定实现动态更新。：定义一个文本块，用于显示绑定的文本。Text="{x:Bind MyProperty}"使用{x:Bind}绑定到MyProperty属性。数据绑定会动态更新TextBlock的TextBlock属性。HorizontalAlignment="Center"为文本块水平居中对齐。FontSize="64"为设置文本的字体大小为 64。 Click Me：定义一个按钮，用户点击时会触发事件。x:Name="myButton"为按钮定义一个名称myButton，可以在代码后端（backing code，后端代码）通过这个名字访问按钮。Click="myButton_Click"绑定按钮的点击事件到后端代码的myButton_Click方法。Click Me按钮显示的内容是"Click Me"。窗口功能：一个简单的窗口，包含一个绑定到属性MyProperty的TextBlock和一个按钮。点击按钮后触发myButton_Click，可以在后端（代码）更新MyProperty，从而动态更新TextBlock的文本内容。数据绑定：使用{x:Bind}提供高性能绑定，将后端数据直接绑定到 UI 元素属性。这段代码定义了一个MainWindow类的声明，使用 C++/WinRT 风格和 WinUI3 框架，包括属性、事件处理方法的声明及工厂实现。 int32_t propertyValue = 0;：声明一个私有成员变量propertyValue，类型为int32_t（32 位整数），并被初始化位值0，用于存储绑定到 UI 的属性值。 int32_t MyProperty();：声明了一个名为MyProperty的公共成员函数，用于获取propertyValue的值（getter 方法）。 void MyProperty(int32_t value);：声明另一个名为MyProperty的公共成员函数，用于设置propertyValue的值（setter 方法），接受一个参数value，类型为int32_t。 void myButton_Click(IInspectable const& sender, Microsoft::UI::Xaml::RoutedEventArgs const& args);：声明一个事件处理函数myButton_Click，用于处理按钮点击事件。参数IInspectable const& sender为事件的源对象；Microsoft::UI::Xaml::RoutedEventArgs const& args为事件的附加信息（如路由事件的相关数据）。成员变量和方法/函数：propertyValue是用于存储一个整数值的私有成员变量。MyProperty()和MyProperty(int32_t value)为属性的 getter 和 setter，用于与 UI 数据绑定。myButton_Click(...)为按钮点击事件的处理函数。用途：该代码是一个典型的 WinUI3 应用程序的后端框架，支持与前端 XAML 的数据绑定和交互。这段代码是对MainWindow类的实现，展示了如何定义属性和事件处理函数，及如何在 C++/WinRT 中使用数据绑定与更新逻辑。 int32_t MainWindow::MyProperty() { return propertyValue; } int32_t MainWindow::MyProperty()：定义MyProperty的 getter 方法，返回私有成员变量propertyValue的值。 void MainWindow::MyProperty(int32_t value) { propertyValue = value; // 更新属性值。 this->Bindings->Update(); // 通知绑定系统属性值已更新。 OutputDebugString(L"Property value updated to: "); // 输出调试信息。 OutputDebugString(winrt::to_hstring(propertyValue).c_str()); // 转换值为字符串并输出。 OutputDebugString(L"\r\n"); // 添加换行符。 } void MainWindow::MyProperty(int32_t value)：定义MyProperty的 setter 方法。功能包括更新propertyValue；调用this->Bindings->Update() 更新 UI，通知数据绑定系统绑定的属性值已更新；使用OutputDebugString输出调式信息，便于开发者跟踪值的变化。 void MainWindow::myButton_Click(IInspectable const&, RoutedEventArgs const&) { MyProperty(propertyValue + 1); } 定义按钮点击事件的处理函数myButton_Click。通过调用MyProperty方法，将propertyValue的值加1。更新后的值自动通过数据绑定反映到绑定的 UI 元素（如 TextBlock 的Text属性）。属性机制： MyProperty是一个读写属性，通过数据绑定链接到 UI。使用Bindings->Update()保证数据绑定的同步更新。按钮事件： myButton_Click用于处理按钮的点击事件，每次点击将propertyValue加1。数据绑定会自动更新 UI。调试支持：通过OutputDebugString打印调试信息到输出窗口，方便开发调试。 10.3.2 控件 link• 控件（Controls）-事件处理图10.8 用程序模板Blank App, Packaged (WinUI 3 in Desktop)（C++）创建名为WinUI3X的项目，移除了默认应用程序中按钮和属性部分的代码，从而在一个完全空的项目上构建应用。该示例应用包括两个部分，左部分是选择不同的单选按钮，变换圆形边框的颜色；右部分是在输入的文本框中输入名字等字符，点击Sy Hi!按钮后会弹出对话框，显示消息。该部分展示了前端 UI 控件（XAML）和后端事件处理函数（C++/WinRT），表示与逻辑分离和交互实现的方式；也展示了winrt::fire_and_forget和co_await配合使用执行异步任务（操作）。图 10-8 控件——事件处理由 XAML 标记语言前端 UI 生成对应事件处理函数的后端代码（如示例中的 yellowButton_Checked 等在 .cpp 和 .h中的代码），可以将光标置于 XAML 的对应代码段内，按 F12 键自动生成。更改 XAML 代码后，重构（Build Solution）应用程序，以便在.cpp代码中识别 XAML 元素。文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp MainWindow.idl 代码 #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3X::implementation { struct MainWindow : MainWindowT { private: winrt::fire_and_forget showMessage(hstring message); public: MainWindow(){} void yellowButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void blueButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void redButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void sayHiButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); }; } namespace winrt::WinUI3X::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; using namespace Microsoft::UI::Xaml::Media; namespace winrt::WinUI3X::implementation { winrt::fire_and_forget MainWindow::showMessage(hstring message) { Microsoft::UI::Xaml::Controls::ContentDialog dialog{}; dialog.XamlRoot(this->Content().XamlRoot()); dialog.Title(box_value(L"Greetings")); dialog.Content(box_value(message)); dialog.CloseButtonText(L"Close"); co_await dialog.ShowAsync(); } void MainWindow::yellowButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { colorPanel().Background(SolidColorBrush{ Microsoft::UI::Colors::Yellow() }); } void MainWindow::blueButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { colorPanel().Background(SolidColorBrush{ Microsoft::UI::Colors::Blue() }); } void MainWindow::redButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { colorPanel().Background(SolidColorBrush{ Microsoft::UI::Colors::Red() }); } void MainWindow::sayHiButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { if (nameBox().Text().empty()) { showMessage(L"Enter your name!"); return; } showMessage(hstring{ L"Hi, " + nameBox().Text() }); } } namespace WinUI3X { [default_interface] runtimeclass MainWindow : Microsoft.UI.Xaml.Window { MainWindow(); } } 🤖 代码解读这段 XAML 代码定义了一个用户界面，包含一个圆形边框作为颜色展示面板，及单选按钮组和文本框按钮组合，用于与用户交互。：外层，其中Orientation="Horizontal"属性配置内部子元素按水平布局。HorizontalAlignment="Center"和VerticalAlignment="Center"将StackPanel水平和垂直居中于窗口。：为圆形颜色边框。x:Name="colorPanel"为边框赋予一个名称，便于后端代码引用。Width="64" Height="64"设置边框高宽为 64 像素。CornerRadius="32"将角半径设置为 32，使边框呈圆形。Background="Black"设背景色为黑色。Margin="0,0,10,0"为右边添加 10 像素间距。第一组垂直布局：颜色选项按钮 Orientation="Vertical"为左内层，配置其子元素垂直排列。包含三个RadioButton（单选按钮），分别代表"Yellow"、“Blue"和"Red”。x:Name="..."为每个按钮指定名称，用于后端逻辑。Checked="..."当按钮被选中时，触发相应的事件处理函数（如yellowButton_Checked）。第二组垂直布局：输入框与按钮 Orientation="Vertical"为右内层，配置其子元素垂直排列。Margin="20,0,0,0"为左边添加 20 像素间距，使其与颜色选项按钮组分开。 TextBox文本框中，x:Name="nameBox"为文本框指定名称。Header="Enter your name:"在文本框上方显示提示文本。Width="200"宽度设置为 200 像素。 Button按钮中，x:Name="sayHiButton"为按钮指定名称。Content="Say Hi!"为按钮上显示"Say Hi!"文本。Click="sayHiButton_CLick"点击按钮时触发后端的sayHiButton_CLick事件处理函数。Margin="0,10,0,0"为在顶部添加 10 像素间距。前端用户界面有三个部分，一个显示当前颜色的圆形面板；一个垂直排列的颜色选项按钮组；和一个输入框和按钮的组合，用于输入和触发事件。功能是，当选中不同颜色按钮时，触发Checked事件，改变圆形面板的颜色；在输出框中输入文本，点击按钮时触发弹出窗口dialog对话框，显示提示信息。后端绑定的事件包括yellowButton_Checked、blueButton_Checked和redButton_Checked，用于设置圆形面板背景颜色为黄色、蓝色和红色；sayHiButton_CLick获取文本框中的值并显示用户输入的问候信息。这段代码定义了MainWindow类的接口和实现结构（头文件），旨在支持用户界面中边框、颜色按钮切换和文本框、按钮点击事件的处理逻辑。 winrt::fire_and_forget showMessage(hstring message);：定义了一个私有异步函数showMessage，参数message类型为hstring。返回类型为winrt::fire_and_forget，是 C++/WinRT 中用于异步编程的一个返回类型，表示一种无需等待结果的异步操作，主要用于事件处理、后台任务或其它不需要返回值或等待完成的场景，从而避免不必要的等待，提高性能，特别是当任务的结果对应用程序其余部分无关紧要时。功能是通过对话框显示一条消息。 MainWindow(){}：定有MainWindow的默认构造函数，用于初始化MainWindow类的实例。事件处理函数 void yellowButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void blueButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void redButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void sayHiButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); 定义了4个事件处理函数，分别对应 UI 元素的交互。yellowButton_Checked、blueButton_Checked和redButton_Checked分别处理黄色、蓝色和红色单选按钮被选中的事件。sayHiButton_CLick处理点击Say Hi!按钮的事件，通过对话框显示基于用户输入的消息。sender为触发事件的对象；e为事件参数对象。事件处理：头文件定义了四个事件处理函数，分别响应单选按钮的选中事件和按钮的点击事件。异步支持：提供了showMessage函数，用于以异步方式显示消息。 using namespace Microsoft::UI::Xaml::Media;：是一个命名空间，包含在 WinUI3 框架中，用于处理用户界面（UI）中媒体相关功能，例如颜色、画刷、几何图形、转换等，提供了支持创建视觉效果的重要类和接口，帮助开发者自定义控件的外观和行为。 namespace winrt::WinUI3X::implementation：这是为WinUI3项目自动生成的实现命名空间，包含MainWindow类的实现。定义异步方法showMessage，是一个典型的 WinUI 异步对话框展示逻辑，适合用于弹出消息或提示用户的场景。 winrt::fire_and_forget MainWindow::showMessage(hstring message) { Microsoft::UI::Xaml::Controls::ContentDialog dialog{}; dialog.XamlRoot(this->Content().XamlRoot()); dialog.Title(box_value(L"Greetings")); dialog.Content(box_value(message)); dialog.CloseButtonText(L"Close"); co_await dialog.ShowAsync(); } winrt::fire_and_forget MainWindow::showMessage(hstring message)：其中winrt::fire_and_forget表示这是一个异步方法，但不会返回任何值，也不允许调用者等待它完成，而是方法执行完成后，系统自动“忘记”它，适用于无需处理结果或异常的异步任务。MainWindow::showMessage表示方法定义在MainWindow类中，负责显示一条消息对话框。hstring message参数message是一个hstring类型（WinRT 的字符串类型），用于传递要显示的消息内容。 Microsoft::UI::Xaml::Controls::ContentDialog dialog{};：创建ContentDialog，是由 WinUI 提供的对话框控件，用于显示模态消息框（Modal Message Box）。模态消息框为一种用户界面元素，通常用于显示消息或提示用户做出决策时，要求用户与其交互并在关闭消息框之前不能与应用程序中的其它部分进行交互，常用于显示警告、确认操作、错误信息等场景，确保用户注意到某个重要事项或做出特定选择。 dialog.XamlRoot(this->Content().XamlRoot());为设置对话框的XamlRoot属性，指向当前窗口的XamlRoot（this->Content()返回窗口的内容（UIElement），调用XamlRoot()方法获取XamlRoot）。XamlRoot代表了窗口中根级 XAML 元素，在 WinUI 中作为视觉树的根节点，有助于管理和更新用户界面的布局及处理界面元素的渲染，可以实现模态对话框等窗口的显示与管理，确保它们的呈现与根窗口一致，否则对话框无法正确显示在当前窗口中。 dialog.Title(box_value(L"Greetings"));为设置对话框的标题。box_value(L"Greetings")是将普通的宽字符串(L"Greetings")，L表示字符串中的字符使用的是宽字符类型wchar_t，通常为 16 位或 32 位字符，以表示更多字符集中的字符，如 Unicode 字符等)转换为 WinRT 的IInspectable类型。IInspectable 是一个 Windows Runtime（WinRT）接口，提供对象的类型信息和接口查询功能，支持反射（Reflection）、类型查询、接口查询等操作，使得开发者可以在动态环境中操作对象，通常用于访问或操作 WinRT 对象的内部数据和方法。 dialog.Content(box_value(message));：设置对话框的主要内容为传入的message字符串。同样用box_value()将message转换为IInspectable类型，从而将普通的值类型包装为能够在 Windows Runtime API 中进行处理的对象。 dialog.CloseButtonText(L"Close");：设置对话框的关闭按钮文本为"Close"。用户点击此按钮后对话框会关闭。 co_await dialog.ShowAsync();：用于显示对话框。co_await暂停当前方法，等待ShowAsync异步完成。co_await属于协程coroutine机制的一部分，用于在协程中暂停当前的执行，等待一个异步操作完成，并在操作完成时恢复执行。dialog.ShowAsync()显示对话框并等待用户与对话框交互完成。用户可能点击对话框或其它地方关闭对话框。 yellowButton_Checked是yellowButton选项按钮触发Checked事件处理函数。（blueButton和redButton同） void MainWindow::yellowButton_Checked(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { colorPanel().Background(SolidColorBrush{ Microsoft::UI::Colors::Yellow() }); } 事件处理函数yellowButton_Checked是当黄色按钮被选中（Checked）时触发。colorPanel().Background(...)设置colorPanel控件的背景颜色为黄色。SolidColorBrush{ Microsoft::UI::Colors::Yellow() }用于创建一个表示黄色的画刷对象。 sayHiButton_Click是sayHiButton按钮单击触发Click事件处理函数。 void MainWindow::sayHiButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { if (nameBox().Text().empty()) { showMessage(L"Enter your name!"); return; } showMessage(hstring{ L"Hi, " + nameBox().Text() }); } void MainWindow::sayHiButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e)方法签名中，void表示该方法没有返回值。MainWindow::sayHiButton_Click属于MainWindow类，并且命名为sayHiButton_CLick，是与 UI 按钮点击事件关联的事件处理方法。 if (nameBox().Text().empty())代码检查nameBox()控件（TextBox）中的文本是否为空。Text()用于获取文本框中的文本。.empty()方法检查文本是否为空，如果文本为空，则条件为true。 showMessage(L"Enter your name!"); ：如果文本框文本为空，则调用showMessage方法，向用户显示提示消息"Enter your name!"，提醒用户输入名字。这个方法是异步的，因此会弹出对话框并等待用户操作。 return;：如果文本框为空，则跳出方法，不再执行下面的代码。 showMessage(hstring{ L"Hi, " + nameBox().Text() });：如果文本框不为空，则构建一个包含"Hi, "和文本框文本nameBox().Text()用+拼接在一起的字符串。拼接结果转换为hstring类型，符合showMessage输入参数的类型。在 IDL 文件中移除了默认应用中的Int32 MyProperty;行代码。 • 控件（Controls）-数据绑定该部分应用示例展示了通过按钮点击更新下拉框数据集的三种数据关联方式。当点击各按钮Add Item时，上方各自对应的下拉框会追加数据Item 1、Item 2等。虽然这三部分实现的功能一致，但是后端代码更新前端用户界面下拉框的数据方式不同，分别为手动列表管理（后端代码直接操作前端 UI 控件）、数据源绑定（后端代码绑定控件和数组变量）和数据绑定（前端 UI 绑定控件和数组变量（以获取器 getter 方式））的不同实现。图 10-9 控件——数据绑定文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp MainWindow.idl 代码 #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3X::implementation { struct MainWindow : MainWindowT { private: int32_t manualIndex = 0; int32_t sourceIndex = 0; int32_t boundIndex = 0; winrt::Windows::Foundation::Collections::IObservableVector sourceArray{ winrt::single_threaded_observable_vector() }; winrt::Windows::Foundation::Collections::IObservableVector boundArray{ winrt::single_threaded_observable_vector() }; public: MainWindow(); winrt::Windows::Foundation::Collections::IObservableVector collection(); void addManualItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void addSourceItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void addBoundItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); }; } namespace winrt::WinUI3X::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { MainWindow::MainWindow() { InitializeComponent(); sourceList().ItemsSource(sourceArray); } void MainWindow::addManualItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { manualIndex++; manualList().Items().Append(box_value(hstring{ L"Item " + to_hstring(manualIndex) })); if (manualList().SelectedItem() == nullptr) manualList().SelectedIndex(0); } void MainWindow::addSourceItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { sourceIndex++; sourceArray.Append(hstring{ L"Item " + to_hstring(sourceIndex) }); if (sourceList().SelectedItem() == nullptr) sourceList().SelectedIndex(0); } winrt::Windows::Foundation::Collections::IObservableVector MainWindow::collection() { return boundArray; } void MainWindow::addBoundItemButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { boundIndex++; boundArray.Append(hstring{ L"Item " + to_hstring(boundIndex) }); if (boundList().SelectedItem() == nullptr) boundList().SelectedIndex(0); } } namespace WinUI3X { [default_interface] runtimeclass MainWindow : Microsoft.UI.Xaml.Window { MainWindow(); Windows.Foundation.Collections.IObservableVector collection{ get; }; } } 🤖 代码解读这段 XAML 代码定义了一个窗口，其布局由一个外层横向排列的StackPanel，及其内部由StackPanel配置的三个垂直排列的功能区块组成。每个区块有一个下拉框和一个按钮，分别用于手动列表管理、数据源绑定和数据绑定的实现示例。每个区块中的下拉列表框（ComboBox）均包括属性x:Name"，用于在代码中访问此控件；Header，设置下拉框的标题；Width，指定下拉框的宽度。在数据绑定示例的第三个区块，ItemsSource="{x:Bind collection}"将boundList（ComboBox）绑定到collection对象集合。每个区块的按钮（Button）均包括属性x:Name，用于在代码中访问此控件；Content，设置按钮显示的文本；Click，将按钮的点击事件关联到后端代码的方法上；Margin，用于设置按钮的边距。私有成员变量： manualIndex、sourceIndex和boundIndex，定义了三个整型变量，分别初始化为0，用作下拉框中手动项、数据源项和绑定项的索引，用于跟踪当前添加的项目数量。 sourceArray和boundArray，定义了两个可观察的向量（数组），类型为IObservableVector，使用winrt::single_threaded_observable_vector初始化，支持数据变更通知，用于存储绑定到下拉框（ComBox）的动态数据集合。 winrt::Windows::Foundation::Collections::IObservableVector boundArray{ winrt::single_threaded_observable_vector() };代码行的详细解读： winrt::Windows::Foundation::Collections::IObservableVector中IObservableVector是一个接口，表示一个动态数组（或向量），支持集合更改通知，即动态数据集合，当集合发生更改时（例如添加、删除、替换元素等），可以通知绑定到它的 UI 控件自动更新，适用于数据绑定场景，如绑定到ComboBox或ListView控件上。模板参数表示该向量中存储的元素类型是hstring，即 WinRT 的字符串类型，是一个高效，不可变的 Unicode 字符串类型，在 WinRT 中用于字符串处理。 winrt::single_threaded_observable_vector()中winrt::single_threaded_observable_vector是一个函数，用于创建一个线程安全、支持集合更改通知的IObservableVector实现，即返回一个实现了IObservableVector接口的对象；并假定所有操作都发生在同一线程上，适用于 UI 线程上的操作场景。因为没有跨线程同步的开销，性能较高。初始化语法{ ... }，是使用大括号{}初始化boundArray，表示通过构造函数初始化，即winrt::single_threaded_observable_vector()的返回值被直接赋值给boundArray。 boundArray是一个IObservableVector类型的变量，底层实现由single_threaded_observable_vector提供，可存储字符串（hstring）元素，并在发生更改时触发通知。将其绑定到 UI 控件上，对应的 XAML 语句如。公有成员函数： MainWindow();：默认构造函数，用于初始化窗口对象。 collection()：返回类型为IObservableVector，表示一个可观察的字符串集合，示例中返回的是boundArray，用于与 XAML 中的数据绑定关联（ItemsSource="{x:Bind collection}）。 addManualItemButton_Click(...)、addSourceItemButton_Click(...)和addBoundItemButton_Click(...)分别为按钮点击事件处理函数，对应手动列表、数据源列表和绑定列表示例。文件顶部指令和命名空间同前文解释。 MainWindow构造函数 MainWindow::MainWindow()：MainWindow的构造函数，在窗口实例化时调用。 InitializeComponent()：初始化窗口组件，加载 XAML 文件中定义的 UI。 sourceList().ItemsSource(sourceArray);：设置sourceList（XAML 中定义的下拉框）的ItemsSource属性，绑定到sourceArray数据集合。这使得sourceArray的变化会自动更新到sourceList。 addManualItemButton_Click函数 manualIndex++;：每次触发按钮的Click事件，增加manualIndex的值，用于生成新项的编号。 manualList().Items().Append(...)：往manualList下拉框的项集合中添加新项。hstring{ L"Item " + to_hstring(manualIndex) }，将manualIndex转换为字符串并拼接成Item X的形式格式。box_value(...)，将hstring包装为IInspectable类型，这是 WinRT 控件的数据项类型。 if (manualList().SelectedItem() == nullptr)：检查manualList当前是否没有选中项。如果未选中任何项，执行manualList().SelectedIndex(0);，将第一项（索引为0）设为选中项。 addSourceItemButton_Click 函数 sourceIndex++;，每次触发按钮的Click事件，增加sourceIndex的值，用于生成新项的编号。 sourceArray.Append(...)，因为sourceArray在MainWindow构造函数中，通过sourceList().ItemsSource(sourceArray);绑定到了sourceList（ComboBox）上，因此向sourceArray添加一项，sourceList会自动更新。 collection函数返回boundArray，用于与绑定的下拉框boundList关联。 XAML 中的ItemsSource="{x:Bind collection}"会调用此函数。 addBoundItemButton_Click函数 boundIndex++;，每次触发按钮的Click事件，增加boundIndex的值，用于生成新项的编号。 boundArray.Append(...)，向boundArray添加新项，boundList会自动更新，在 XAML 前端代码中，其已绑定到boundArray。该部分代码主要定义了三个按钮的点击事件处理函数，通过直接（手动）操作、数据源绑定和{x:Bind}数据绑定的不同方式来更新 UI 中各自对应的下拉框集合。其中manualList，是直接操作Items集合，用manualList().Items().Append(...)方式更新；sourceList，是通过sourceList().ItemsSource(sourceArray);将sourceArray绑定到sourceList，从而通过操作数据sourceArray更新；boundList，是在 XAML 前端代码中用ItemsSource="{x:Bind collection}绑定collection函数，而collection函数返回boundArray，从而实现boundList（ComboBox）和boundArray数组的绑定。sourceArray和boundArray向量（数组）需要为IObservableVector类型的变量，以在向量发生更改时触发通知，更新绑定的 UI 控件对象。 Windows.Foundation.Collections.IObservableVector collection{ get; };：中Windows.Foundation.Collections.IObservableVector，定义了一个公开属性collection，类型为IObservableVector，是一个动态数组接口，支持观察者模式（通知绑定的控件数组变化），适用于绑定到 XAML 控件的ItemsSource上。collection{ get; };表明collection属性是只读的（get表示有获取器 getter，但没有设置器 setter）。当其它代码访问collection时，会调用实现类中的collection()函数。 10.3.3 页面和导航 link使用 WinUI3 创建一个包含多页面导航界面的应用程序。应用界面功能包括导航视图，为左侧垂直导航栏，提供主页面的导航入口，包括 Home（主页）、Other Page（其他页面）和 Settings（设置页面）。导航栏使用图标和文本直观展示页面导航选项，可折叠/展开；使用NavigationView控件，具有现代化的响应式设计，支持多种窗口大小调整。右侧内容区域根据导航选项动态加载相应的页面内容，示例性的显示各自对应的文本。每个页面独立实现，通过Frame控件加载，便于扩展和维护。位于左上角的后退按钮提供导航历史的回退功能，允许用户返回到前一个页面。如果用户在导航历史中没有可返回的页面则按钮禁用。图 10-10 页面和导航 MainPage、HomePage、OtherPage和SettingsPage四个页面的创建方式为Solution Explorer->WinUI3X(Desktop)->右键弹出菜单->Add->New Item->Blank Page(WinUI3)。其中页面的结构层次关系如图10.11，MainWindow为应用程序的主窗口，作为程序启动后加载的初始窗口，主要任务是承载MainPage。MainPage作为应用程序的主页面，其包含一个Frame（导航框架），用于显示和切换页面内容；NavigationView控件用于导航到其它功能页面（如HomePage、OtherPage和SettingsPage）。MainPage是通过MainWindow加载的。HomePage、OtherPage和SettingsPage分别为MainPage导航到的页面，为“主页”，“其他”功能页面和“设置“选项页面。项目结构中页面关系图的层级可以描述为MainWindow包含MainPage作为子页面；MainPage通过NavigationView和导航框架Frame加载HomePage、OtherPage和SettingsPage。图 10-11 文件结构 1-MainWindow 在MainWindow.xaml中，是一个自定义页面（或控件），其名字为MainPage。并使用了自闭和标签/，表示这是一个没有子元素的单独控件。local是在根节点中定义的一个命名空间前缀xmlns:local="using:WinUI3X"，指向当前项目的命名空间WinUI3X。作用是，所有前缀为local:的控件或元素，均被解析为WinUI3X命名空间内的类型。此处，local:MainPage指向WinUI3X.MainPage类。MainPage自定义页面同样包括与之关联的 XAML 文件（MainPage.xaml），描述其 UI 结构；一个后端代码文件（MainPage.xaml.cpp，及其头文件MainPage.xaml.h），描述行为逻辑；和 IDL 文件MainPage.idl。 MainWindow页面中，MainWindow.xaml.cpp、MainWindow.xaml.h和MainWindow.idl中均移除了自动生成的按钮myButton和属性变量MyProperty相关部分的内容，保持为一个空白的页面。在 WinUI 或类似框架中，将MainPage嵌套到MainWindow中是一种常见的设计模式，其目的是为了分离关注点和提升代码的可维护性，其优势有：模块化设计。MainWindow的职责是作为应用的主要窗口，是整个应用的容器，主要负责窗口级别的设置，例如窗口标题；窗口尺寸和布局；应用程序的生命周期事件（如启动、最小化和关闭等）等。MainWindow通常不直接承载复杂的 UI 内容，而是用来嵌套其他页面或控件。MainPage的职责专注于应用程序的主要 UI 和交互逻辑。作为窗口的内容部分，定义了具体的用户界面（如按钮、输入框和列表等）。这种设计让界面逻辑和窗口设置分离，便于管理。可扩展性。如果后续应用需要多页面导航（如从MainPage导航到SettingsPage或其他页面），可以包含一个Frame控件，用于托管不同的页面。这种设计使得应用具有更高的扩展性，而不是将所有内容直接嵌套到MainWindow中。简化代码结构。如果所有的 UI 和逻辑都写在MainWindow中，代码可能变得难以维护。将主要的 UI 放在MainPage中，可以使每个类保持简洁，单一负责。多窗口支持。可以在应用冲创建多个窗口，每个窗口可能有不同的内容，是独立的页面。设计和开发分离。可以在设计阶段单独对页面进行布局和调整。在开发阶段，MainWindow和MainPage以及其他页面的开发可以并行进行，提高效率。文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp MainWindow.idl 代码 #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3X::implementation { struct MainWindow : MainWindowT { MainWindow(){} }; } namespace winrt::WinUI3X::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { } namespace WinUI3X { [default_interface] runtimeclass MainWindow : Microsoft.UI.Xaml.Window { MainWindow(); } } 2-MainPage MainPage通过MainWindow加载，加载的代码为MainWindow.xaml文件下的。而MainPage通过NavigationView控件导航到其他功能页面（HomePage、OtherPage和SettingsPage）。文件 MainPage.xaml MainPage.xaml.h MainPage.xaml.cpp MainPage.idl 代码 #pragma once #include "MainPage.g.h" namespace winrt::WinUI3X::implementation { struct MainPage : MainPageT { private: void openHomePage(); void openOtherPage(); void openSettingPage(); public: MainPage(){} void Page_Loaded(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); void NavigationView_ItemInvoked(winrt::Microsoft::UI::Xaml::Controls::NavigationView const& sender, winrt::Microsoft::UI::Xaml::Controls::NavigationViewItemInvokedEventArgs const& args); void mainFrame_Navigated(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::Navigation::NavigationEventArgs const& e); void nav_BackRequested(winrt::Microsoft::UI::Xaml::Controls::NavigationView const& sender, winrt::Microsoft::UI::Xaml::Controls::NavigationViewBackRequestedEventArgs const& args); }; } namespace winrt::WinUI3X::factory_implementation { struct MainPage : MainPageT { }; } #include "pch.h" #include "MainPage.xaml.h" #if __has_include("MainPage.g.cpp") #include "MainPage.g.cpp" #endif #include "winrt/Windows.UI.Xaml.Interop.h" using namespace winrt; using namespace Microsoft::UI::Xaml; // To learn more about WinUI, the WinUI project structure, // and more about our project templates, see: http://aka.ms/winui-project-info. namespace winrt::WinUI3X::implementation { void MainPage::Page_Loaded(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { // Initialize your stuff here! } void MainPage::NavigationView_ItemInvoked(winrt::Microsoft::UI::Xaml::Controls::NavigationView const& sender, winrt::Microsoft::UI::Xaml::Controls::NavigationViewItemInvokedEventArgs const& args) { if (args.IsSettingsInvoked()) { openSettingPage(); } else { hstring tag = unbox_value(args.InvokedItemContainer().Tag()); if (tag == L"home") openHomePage(); else if (tag == L"other") openOtherPage(); } } void MainPage::openHomePage() { mainFrame().Navigate(xaml_typename()); } void MainPage::openOtherPage() { mainFrame().Navigate(xaml_typename()); } void MainPage::openSettingPage() { mainFrame().Navigate(xaml_typename()); } void MainPage::mainFrame_Navigated(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::Navigation::NavigationEventArgs const& e) { nav().IsBackEnabled(mainFrame().CanGoBack()); } void MainPage::nav_BackRequested(winrt::Microsoft::UI::Xaml::Controls::NavigationView const& sender, winrt::Microsoft::UI::Xaml::Controls::NavigationViewBackRequestedEventArgs const& args) { mainFrame().GoBack(); } } namespace WinUI3X { [default_interface] runtimeclass MainPage : Microsoft.UI.Xaml.Controls.Page { MainPage(); } } 🤖 代码解读根元素定义了一个页面（Page），通常表示一个应用程序的独立视图。Page是Microsoft.UI.Xaml.Controls.Page的实例。 x:Class="WinUI3X.MainPage"：指定此页面的后端代码为WinUI3X.MainPage，对应的 C++ 文件为MainPage.xaml.h和MainPage.xaml.cpp。 MainPage.xaml.cpp：指向项目命名空间WinUI3X，用于引用项目中的类或控件。 Loaded="Page_Loaded"：指定页面加载完成后触发的事件，关联后端代码中的Page_Loaded方法。页面内容—— ：用于实现现代应用中的导航菜单，提供导航视图结构，包括菜单项、导航内容区域等。 x:Name="nav"：为NavigationView控件命名为nav，便于在后台代码中引用。 IsSettingsVisible="True"：指定是否显示设置菜单项（通常以齿轮图标表示）。这里设置为True，默认显示。 ItemInvoked="NavigationView_ItemInvoked"：定义当用户点击导航菜单中的某项时触发的事件，关联后端代码NavigationView_ItemInvoked方法。 BackRequested="nav_BackRequested"：定义当用户点击返回按钮时触发的事件，关联后台代码的nav_BackRequested方法。子元素—— ：定义导航菜单的项（MenuItems），每个菜单项表示一个页面或功能。：定义导航菜单中的具体项。Content="Home"为菜单项显示的文本为"Home"；Icon="Home"为菜单项使用内置的Home图标；Tag="home"为此项指定标识符home，便于事件处理中识别。第二个菜单项other，基本同第一个菜单项home的解释。子元素—— ：定义NavigationView的主要内容区域，显示导航到的页面内容。：是一个容器控件，支持导航功能，可以加载其他页面。属性x:Name="mainFrame"命名为mainFrame，用于在后端代码中操作此控件。Navigated="mainFrame_Navigated"指定页面导航完成后触发的事件，关联后端代码的mainFrame_Navigated方法。该页面（MainPage）通过NavigationView构建了一个导航菜单，包含Home和Other Page两个菜单项，将Frame作为主要内容区域，动态加载导航目标页面。后端代码中的事件（如NavigationView_ItemInvoked，Page_Loaded）控制具体行为。私有方法 private: void openHomePage(); void openOtherPage(); void openSettingPage(); openHomePage、openOtherPage和openSettingPage定义了三个私有方法，用于打开不同页面或设置，在对应的.cpp文件中定义具体实现。公有方法和构造函数默认构造函数，MainPage()初始化MainPage对象。页面加载事件处理程序，void Page_Loaded(...);，处理页面加载完成的事件，在页面被初始化后触发，通常用于进行数据绑定、控件初始化等操作。导航视图点击事件处理程序，void NavigationView_ItemInvoked(...)，在用户点击导航视图中的某个菜单时触发。参数sender触发此事件的导航视图控件；args包含被点击项的信息，如Tag或Content等。主框架导航完成事件处理程序，void mainFrame_Navigated(...)，当主内容框架（Frame）完成导航到新页面时触发，可用于更新导航状态、标题或执行其它操作。返回按钮事件处理程序，void nav_BackRequested(...)，当用户点击返回按钮时触发，通常用于实现导航堆栈的后退功能。此文件定义了一个MainPage类，负责实现页面逻辑，包含有多个事件处理程序，用于处理导航、页面加载和返回等交互；其私有方法（如openHomePage）用于封装页面逻辑。文件头部 winrt/Windows.UI.Xaml.Interop.h：提供了辅助函数，如xaml_typename，用于在运行时动态加载页面。使用命名空间 using namespace winrt;：包含所有 C++/WinRT 的核心功能。 using namespace Microsoft::UI::Xaml;：用于访问 WinUI 控件和相关功能。页面加载事件处理程序：void Page_Loaded(...); void MainPage::Page_Loaded(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { // Initialize your stuff here! //openHomePage(); } 该部分空出。openHomePage为初始化时加载主页（被注释掉，可以按需启动），用于功能测试。导航视图点击事件处理程序：void NavigationView_ItemInvoked(...) if (args.IsSettingsInvoked()) { openSettingPage(); } 判断是否点击设置菜单。args.IsSettingsInvoked()用于检查用户是否点击了设置菜单，返回一个布尔值，如果点击了则调用函数openSettingPage打开设置页面。 hstring tag = unbox_value(args.InvokedItemContainer().Tag()); if (tag == L"home") openHomePage(); else if (tag == L"other") openOtherPage(); hstring tag = unbox_value(args.InvokedItemContainer().Tag());为获取用户点击导航项的Tag属性值，并将其转换为hstring类型。其中args.InvokedItemContainer()返回用户点击的具体导航容器项，Tag()为返回导航项的Tag属性值，通常是用于标识的字符串。unbox_value则将通用类型（如IInspectable）取消装箱为hstring类型。C++/WinRT 提供了winrt::box_value函数，采用标量或数组值，将装箱的值返回到IInspectable中；对于取消IInspectable装箱并返回到标量或数组值，则为winrt::unbox_value函数。 if (tag == L"home")检查tag的值是否为L"home"，如果是则执行openHomePage();导航到其链接的页面HomePage上。 else if (tag == L"other")检查tag是否为L"other"，如果是则执行openOtherPage();导航到其链接的页面OtherPage上。页面导航函数：void MainPage::openHomePage()、void MainPage::openOtherPage()和void MainPage::openSettingPage() void MainPage::openHomePage() { mainFrame().Navigate(xaml_typename()); } 以void MainPage::openHomePage()为例，定义MainPage类的一个成员函数openHomePage，用于导航到主页面HomePage。mainFrame()（控件Frame）是页面中管理导航历史的容器，负责加载和显示页面。.Navigate(xaml_typename())调用Frame的Navigate方法，用于加载指定类型的页面，导航到指定页面类型HomePage。xaml_typename()是一个模板函数，返回HomePage类型的TypeName对象，告诉Frame需要加载的目标页面类型。xaml_typename<>提供类型信息，支持 WinUI 运行时使用反射加载页面。HomePage通常在项目中定义，是目标页面的类名，由 XAML 文件和对应的 C++/WinRT 代码生成。该函数的功能就是使用主框架（mainFrame）作为导航容器；调用Navigate方法将导航目标设定为HomePage类型；加载HomePage并在主框架中显示其内容。主框架导航完成事件处理程序：void mainFrame_Navigated(...) nav().IsBackEnabled(mainFrame().CanGoBack());根据导航框架的返回状态动态更新导航视图的返回按钮状态。其中mainFrame().CanGoBack()返回一个布尔值，表示当前是否可以返回到前一个页面。如果导航历史中存在前一个页面，则返回true；否则返回false。nav().IsBackEnabled(bool)设置导航视图中返回按钮的启用状态，true为启用返回按钮；false为禁用返回按钮。返回按钮事件处理程序：void nav_BackRequested(...) mainFrame().GoBack();为调用主内容框架的返回功能，将当前页面导航到前一个页面。如果导航历史中没有前一个页面，此操作无效。 mainFrame_Navigated用于更新返回按钮的状态；nav_BackRequested处理返回按钮的点击操作，执行页面返回导航。结合了Frame和NavigationView的功能，实现了基本的导航控制。 3-HomePage、OtherPage和SettingsPage 这三个页面均为演示性页面，页面内容除了在各自的 .xaml 文件中通过TextBlock输出一段描述当前页的文本外，无其他功能，如。文件 .xaml .xaml.h .xaml.cpp .idl HomePage #pragma once #include "HomePage.g.h" namespace winrt::WinUI3X::implementation { struct HomePage : HomePageT { HomePage(){} }; } namespace winrt::WinUI3X::factory_implementation { struct HomePage : HomePageT { }; } #include "pch.h" #include "HomePage.xaml.h" #if __has_include("HomePage.g.cpp") #include "HomePage.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { } namespace WinUI3X { [default_interface] runtimeclass HomePage : Microsoft.UI.Xaml.Controls.Page { HomePage(); } } OtherPage #pragma once #include "OtherPage.g.h" namespace winrt::WinUI3X::implementation { struct OtherPage : OtherPageT { OtherPage(){} }; } namespace winrt::WinUI3X::factory_implementation { struct OtherPage : OtherPageT { }; } #include "pch.h" #include "OtherPage.xaml.h" #if __has_include("OtherPage.g.cpp") #include "OtherPage.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { } namespace WinUI3X { [default_interface] runtimeclass OtherPage : Microsoft.UI.Xaml.Controls.Page { OtherPage(); } } SettingsPage #pragma once #include "SettingsPage.g.h" namespace winrt::WinUI3X::implementation { struct SettingsPage : SettingsPageT { SettingsPage(){} }; } namespace winrt::WinUI3X::factory_implementation { struct SettingsPage : SettingsPageT { }; } #include "pch.h" #include "SettingsPage.xaml.h" #if __has_include("SettingsPage.g.cpp") #include "SettingsPage.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3X::implementation { } namespace WinUI3X { [default_interface] runtimeclass SettingsPage : Microsoft.UI.Xaml.Controls.Page { SettingsPage(); } } 10.3.4 文件选择器 link该示例实现了通过点击Open file按钮，打开文件浏览器，选择图片后，在窗口右侧显示该图片内容的功能。图 10-12 文件选择器（打开的内部图片由 AI 生成器生成，工具 shakker，https://www.shakker.ai/home） 1-App App.xaml主要用于设置应用程序的全局资源和主题，定义了 UI 控件的资源字典（包括系统默认样式、控制资源等），并指定了应用程序的外观主题。在App.xaml中，还可以设置应用启动时的一些行为，如启动窗口、全局样式等。这里增加了getMainWindow方法，提供了一个方式来获取主窗口的原生句柄，便于与传统的 Win32 API 进行交互。文件 App.xaml App.xaml.h App.xaml.cpp 代码 #pragma once #include "App.xaml.g.h" namespace winrt::WinUI3APP::implementation { struct App : AppT { App(); void OnLaunched(Microsoft::UI::Xaml::LaunchActivatedEventArgs const&); static HWND getMainWindow(); private: static winrt::Microsoft::UI::Xaml::Window window; }; } #include "pch.h" #include "App.xaml.h" #include "MainWindow.xaml.h" #include using namespace winrt; using namespace Microsoft::UI::Xaml; // To learn more about WinUI, the WinUI project structure, // and more about our project templates, see: http://aka.ms/winui-project-info. namespace winrt::WinUI3APP::implementation { winrt::Microsoft::UI::Xaml::Window App::window{ nullptr }; /// /// Initializes the singleton application object. This is the first line of authored code /// executed, and as such is the logical equivalent of main() or WinMain(). /// App::App() { // Xaml objects should not call InitializeComponent during construction. // See https://github.com/microsoft/cppwinrt/tree/master/nuget#initializecomponent #if defined _DEBUG && !defined DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION UnhandledException([](IInspectable const&, UnhandledExceptionEventArgs const& e) { if (IsDebuggerPresent()) { auto errorMessage = e.Message(); __debugbreak(); } }); #endif } /// /// Invoked when the application is launched. /// /// Details about the launch request and process. void App::OnLaunched([[maybe_unused]] LaunchActivatedEventArgs const& e) { window = make(); window.Activate(); } HWND App::getMainWindow() { auto windowNative{ App::window.try_as<::IWindowNative>() }; HWND hwnd{ 0 }; windowNative->get_WindowHandle(&hwnd); return hwnd; } } 🤖 代码解读声明 XML 文档头指定文档是 XML 格式，版本为 1.0，并使用 UTF-8 编码。 Application 元素：表示整个应用程序的根级别对象，管理应用程序生命周期。 x:Class="WinUI3APP.App"：绑定此 XAML 文件到应用程序的主类WinUI3APP.App，该类通常由 C++/WinRT 或 C# 编写，用于定义应用逻辑。 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"：定义 XAML 命名空间，用于引用核心控件和功能。 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"：引入x:命名空间，提供 XAML 中的附加功能（如类引用和类型转换）。 xmlns:local="using:WinUI3APP":：本地命名空间，引用当前项目中的代码（WinUI3APP命名空间）。 RequestedTheme="Light"：设置应用程序的默认主题为浅色主题。声明全局样式和控件资源：定义应用程序级别的资源（如样式、模板和资源字典），可以在整个应用程序中共享。 ResourceDictionary：封装应用程序资源，便于组织和管理。资源可以包括样式（Style）、数据模板（DataTemplate）和其他定义在 XAML 中的共享对象。 ResourceDictionary.MergedDictionaries：定义多个外部资源字典的合并，使得他们可以集中管理并应用于当前字典。：命名空间using:Microsoft.UI.Xaml.Controls引入 WinUI 提供的默认控件样式和资源，确保应用程序控件在不同主题（浅色、深色、高对比度）下正常显示。提示可以在此添加其他应用程序级别的资源，如自定义样式或模板。这段 XAML 是一个典型的 WinUI3 应用程序入口文件的模板，其定义了应用程序的根元素Application；指定应用的主题为Light；合并了默认的控件资源样式；为整个应用预留了资源定义的空间。如果需要进一步扩展，可以在ResourceDictionary中添加自定义资源，如全局样式定义，字体或配色方案，及自定义控件模板等。 #pragma once：确保头文件只会被编译一次，防止头文件被多次包含，避免重复定义问题。 #include "App.xaml.g.h"：包含由App.xaml生成的头文件App.xaml.g.h。该文件由编译器自动生成，包含了App.xaml定义的类和成员，实现 XAML 和后端代码的桥接。 namespace winrt::WinUI3APP::implementation：命名空间声明。winrt是 C++/WinRT 的顶级命名空间。WinUI3APP是当前项目的命名空间。implementation 是 C++/WinRT 的惯例，表示具体的实现部分，对应的接口类通常位于winrt::WinUI3APP命名空间中。 struct App : AppT：App类声明。AppT是一个模板类，App是模板参数。AppT是由 C++/WinRT 自动生成的模板基类，提供App类的基础功能。 App();：声明一个构造函数，用于初始化App类实例。 void OnLaunched(Microsoft::UI::Xaml::LaunchActivatedEventArgs const&);：处理应用程序的启动事件。参数Microsoft::UI::Xaml::LaunchActivatedEventArgs const&包含应用启动时的上下文信息（如启动参数）。用于定义应用程序启动后要执行的逻辑，通常包括：创建主窗口，加载页面和显示 UI 等。 static HWND getMainWindow();：静态方法getMainWindow返回主窗口的句柄（HWWND）,用于与 Win32 API 或其他原生窗口操作的交互，提供对主窗口的访问。 static winrt::Microsoft::UI::Xaml::Window window;：私有成员变量window是Microsoft::UI::Xaml::Window类型的静态变量，表示应用的主窗口实例。静态变量属于类而非某个对象，确保应用中只有一个主窗口实例。这段代码是 WinUI3 应用程序的主要入口类 App的声明部分，包含构造函数，用于初始化应用；OnLaunched方法，处理应用启动事件；静态方法getMainWindow，提供主窗口句柄；静态成员变量window，存储主窗口实例。在实现中，App类将结合 App.xaml文件提供的 XAML 定义，实现 WinUI3 应用程序的核心功能，包括窗口管理和事件处理。包含头文件 #include "pch.h"：引入预编译头文件，通常包含一些常用的标准库或项目头文件，以提高编译效率。 #include "App.xaml.h"：包含App.xaml自动生成的头文件，定义了应用程序的App类。 #include "MainWindow.xaml.h"：包含MainWindow.xaml自动生成的头文件，定义了应用程序的主窗口MainWindow。 #include ：包含用于与 XAML 窗口相关的 WinUI 头文件。使用命名空间 using namespace winrt;：引入 C++/WinRT 库的命名空间，是代码更简洁。 using namespace Microsoft::UI::Xaml;引入 WinUI 相关的 XAML 命名空间。 App类的静态成员变量初始化 winrt::Microsoft::UI::Xaml::Window App::window{ nullptr };：静态成员变量window，用于存储应用程序的主窗口实例。初始化为nullptr，表示没有窗口实例。winrt::Microsoft::UI::Xaml::Window是 WinUI 中表示窗口的类。 App构造函数注释部分提醒开发者不应在构造函数中调用InitializeComponent。InitializeComponent通常用于加载 XAML 定义的 UI 资源，在构造函数中被掉用可能会导致未定义行为。调式代码块#if defined _DEBUG && !defined DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION条件编译中_DEBUG是仅在调试模式下启用；并如果未定义DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION宏，则执行调式异常处理逻辑。未处理异常处理UnhandledException注册一个回调函数，用于处理应用程序中的未处理异常。异常发生时，该函数会被调用。回调函数的逻辑是使用IsDebuggerPresent()检查当前是否运行在调试模式下。如果是，调用e.Message()获取异常的详细信息（errorMessage）。errorMessage可能会用于日志记录或调试输出。并调用__debugbreak()，通知调试器中断程序运行，触发调试中断，便于检查问题。 #endif：结束调试模式代码块，仅在_DEBUG定义且未禁用异常中断时生效。 OnLaunched方法。 void App::OnLaunched([[maybe_unused]] LaunchActivatedEventArgs const& e)：void指定函数返回类型为void，表示这个函数没有返回值。App::OnLaunched是一个类App的成员函数，名为OnLaunched。在 Windows 应用中，OnLaunched是应用程序启动时被调用的事件处理函数，用于初始化和显示主窗口。[[maybe_unused]]是一个标准的 C++ 属性（attribute），提示编译器参数e可能未被使用，从而避免编译器发出未使用变量的警告。LaunchActivatedEventArgs是 WinUI 提供的一个类，表示与启动应用相关的信息，如启动参数。const&指定参数为常数引用类型，防止其在函数内被修改，同时避免拷贝对象以提升性能。 window = make();：window是一个成员变量，通常类型是winrt::Windows::UI::Xaml::Window或类似类型，表示应用的主窗口。make()中make是 WinRT 中的一个模板函数，用于创建由MainWindow定义的对象实例。MainWindow表示用户定义的主窗口类，通常继承自winrt::Windows::UI::Xaml::Window。尖括号<>用于为模板函数提供类型参数。这行代码实例化了一个MainWindow对象，并将其分配给window变量。 window.Activate();：Activate()调用窗口的Activate方法，将窗口设置为活动状态，使其在屏幕上可见。如果没有调用此方法，窗口可能不会显示。该函数通常还确保将窗口激活为用户的当前焦点窗口。 OnLaunched是应用启动时的入口点，主要用来初始化并激活主窗口。这段代码的作用是创建一个MainWindow实例并显示它，使得用户可以与之交互。其中，[[maybe_unused]]属性可以让编译器忽略未使用LaunchActivatedEventArgs参数的警告。 getMainWindow方法 HWND App::getMainWindow()：HWND是一个 Windows API 中的句柄类型，表示窗口的句柄（Window Handle），是用来标识窗口的唯一标识符。App::getMainWindow()是App类的成员函数，名为getMainWindow，作用是获取应用的主窗口句柄，并将其返回。 auto windowNative{ App::window.try_as<::IWindowNative>() };：App::window是App类中的一个（静态）成员变量，表示应用的主窗口对象，通常是winrt::Windows::UI::Xaml::Window对象。try_as是 WinRT 提供的一个方法，用于将对象转换为另一个接口类型。::IWindowNative是一个 COM 接口，提供与原生 Windows API 的桥接。IWindowNative的主要功能是获取窗口句柄（HWND）。这行代码将App::window转换为IWindowNative接口，如果转换成功，windowNative就是该窗口的一个实例。auto自动类型推断，windowNative的类型会根据try_as的返回值推断为winrt::com_ptr。 HWND hwnd{ 0 };：定义一个变量hwnd，用于存储窗口句柄。初始值设置为0，表示未初始化的句柄。句柄通过指针传递给IWindowNative::get_WindowHandle函数。 windowNative->get_WindowHandle(&hwnd);：get_WindowHandle是IWindowNative接口的一个方法，作用是获取与当前窗口相关联的原生窗口句柄。&hwnd通过指针将句柄传递给该函数，用于接收窗口句柄的值。调用后，hwnd将包含与窗口相关联的实际句柄值。如果windowNative有效（即转换成功），这行代码会将主窗口的句柄值存储到hwnd中。 return hwnd;：将存储在hwnd中的窗口句柄值返回给调用者。调用者可以使用这个句柄与Windows API进行交互，例如设置窗口属性、调整大小、发送消息等。这段代码实现了一个简单的 WinUI3 应用程序，其中App类是应用程序的核心，负责初始化和启动；在构造函数中，设置了未处理异常的调试断点；在OnLaunched方法中，创建并激活了主窗口MainWindow；getMainWindow方法提供了一个方式来获取主窗口的原生句柄，便于与传统的 Win32 API 进行交互。 2-MainWindow MainWindow页面中，MainWindow.xaml、MainWindow.xaml.cpp、MainWindow.xaml.h和MainWindow.idl中均移除了自动生成的按钮myButton和属性变量MyProperty相关部分的内容，保持为一个空白的页面。同页面和导航部分的MainWindow，仅在MainWindow.xaml中增加了一行代码，指向MainPage页面。 3-MainPage MainPage通过MainWindow加载，加载的代码为MainWindow.xaml文件下的。MainPage实现了用户点击按钮触发事件，加载图片文件到图片控件中显示的功能。文件 MainPage.xaml MainPage.xaml.h MainPage.xaml.cpp MainPage.idl 代码 #pragma once #include "MainPage.g.h" namespace winrt::WinUI3APP::implementation { struct MainPage : MainPageT { private: winrt::fire_and_forget openImageFile(); public: MainPage(){} void selectImageFileButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); }; } namespace winrt::WinUI3APP::factory_implementation { struct MainPage : MainPageT { }; } #include "pch.h" #include "MainPage.xaml.h" #if __has_include("MainPage.g.cpp") #include "MainPage.g.cpp" #endif #include "winrt/Windows.Storage.Pickers.h" #include "App.xaml.h" #include using namespace winrt; using namespace Microsoft::UI::Xaml; // To learn more about WinUI, the WinUI project structure, // and more about our project templates, see: http://aka.ms/winui-project-info. namespace winrt::WinUI3APP::implementation { void MainPage::selectImageFileButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { openImageFile(); } winrt::fire_and_forget MainPage::openImageFile() { Windows::Storage::Pickers::FileOpenPicker picker{}; HWND hwnd = App::getMainWindow(); picker.as()->Initialize(hwnd); picker.SuggestedStartLocation(Windows::Storage::Pickers::PickerLocationId::PicturesLibrary); picker.FileTypeFilter().Append(L".png"); Windows::Storage::StorageFile file = co_await picker.PickSingleFileAsync(); if (file != nullptr) { bmp().SetSource(co_await file.OpenAsync(Windows::Storage::FileAccessMode::Read)); } } } namespace WinUI3APP { [default_interface] runtimeclass MainPage : Microsoft.UI.Xaml.Controls.Page { MainPage(); } } 🤖 代码解读：定义一个网格布局容器，用于组织页面中的子元素。该示例中将控件分布在两个列中，第一列放置按钮，第二列放置图片。定义列定义网格的列。第一列为，宽度根据内容自适应，适合放置固定宽度的控件，如按钮；第二列，宽度占剩余空间，用于显示主要内容，如图片。按钮控件：定义一个按钮，用户点击后触发文件选择事件。x:Name="selectImageFileButton"定义按钮的标识符，供代码中引用。Content="Open file"按钮上显示的文本为 “Open file”。Click="selectImageFileButton_Click"指定按钮的点击事件处理程序selectImageFileButton_Click，在MainPage的 C++ 代码中定义。图片控件定义用于显示图像的控件。 x:Name="image"定义图片控件的标识符。Grid.Column="1"是将图片放置在网格的第2列（列索引从0开始）。Margin="20"设置控件的外边距（上下左右各20像素）。子元素定义图片的来源。定义一个BitmapImage对象，表示图片的来源，通过bmp标识符可以在代码中操作图片源。该部分 XAML 代码使用了网格布局将页面分为两列，一列置按钮；另一列置图片控件，显示用户选择的图像。当用户点击按钮触发事件，加载图片文件到图片控件中显示。 winrt::fire_and_forget openImageFile();：winrt::fire_and_forget表示该函数是一个协程，支持异步操作。函数执行完成后不返回任何值，也不会等待协程完成。openImageFile()声明一个私有的异步方法，用于打开图片文件。实际实现可能调用文件选择对话框，并将用户选择的图片加载到 UI 控件中。 MainPage(){}：定义一个默认的构造函数，当前没有执行任何初始化操作。 void selectImageFileButton_Click(...);：定义了按钮的点击事件处理程序。sender为事件的发起者；e为事件参数，包含触发事件的信息。头文件的引入 winrt/Windows.Storage.Pickers.h：包含文件选择器的支持（如FileOpenPicker）。 App.xaml.h：包含App类的头文件，用于调用全局方法（如getMainWindow()）。：包含 Window COM 接口的声明（如IInitializeWithWindow），用于与文件选择器交互。按钮点击事件处理程序 void MainPage::selectImageFileButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { openImageFile(); } 当按钮被点击时，调用openImageFile()方法，启动文件选择器。文件选择功能实现 winrt::fire_and_forget MainPage::openImageFile() { Windows::Storage::Pickers::FileOpenPicker picker{}; HWND hwnd = App::getMainWindow(); picker.as()->Initialize(hwnd); picker.SuggestedStartLocation(Windows::Storage::Pickers::PickerLocationId::PicturesLibrary); picker.FileTypeFilter().Append(L".png"); Windows::Storage::StorageFile file = co_await picker.PickSingleFileAsync(); if (file != nullptr) { bmp().SetSource(co_await file.OpenAsync(Windows::Storage::FileAccessMode::Read)); } } 方法声明与返回类型。winrt::fire_and_forget MainPage::openImageFile()中winrt::fire_and_forget是有个返回类型，表示该方法是一个异步操作，但不会返回任何值。fire_and_forget是 WinRT 中的一种特性，表示该函数将执行异步任务，但调用者不需要等待任务完成。MainPage::openImageFile()表示该方法属于MainPage类。创建文件选择器。Windows::Storage::Pickers::FileOpenPicker picker{};中FileOpenPicker是一个文件选择器，用于让用户选择一个文件。这里，被用来选择图片文件。picker{}使用初始化列表创建一个FileOpenPicker对象。获取窗口句柄并初始化选择器。HWND hwnd = App::getMainWindow();中App::getMainWindow()调用App类的静态方法获取当前主窗口的句柄（HWND），将用来初始化文件选择器，使其能够与窗口进行交互。picker.as()->Initialize(hwnd);将picker转换为IInitializeWithWindow接口，之后调用Initialize(hwnd)方法，将窗口句柄与文件选择器绑定。设置文件选择器的起始位置与文件类型过滤器。picker.SuggestedStartLocation(Windows::Storage::Pickers::PickerLocationId::PicturesLibrary);中SuggestedStartLocation设置文件选择器的起始目录为用户的图片库。这可以让用户从常用的图片目录开始选择文件。picker.FileTypeFilter().Append(L".png");中FileTypeFilter设置文件过滤器，限制用户只能选择.png格式的文件。通过Append方法将文件扩展名.png添加到过滤器中。异步选择文件。Windows::Storage::StorageFile file = co_await picker.PickSingleFileAsync();中PickSingleFileAsync()是一个异步方法，打开文件选择器并等待用户选择一个文件。通过co_await关键字等待PickSingleFileAsync()操作完成。这意味着程序会暂停在这一行，直到用户选择了文件或者取消操作。如果用户选择了文件，则返回一个StorageFile对象；若取消选择，则返回nullptr。处理文件并显示图片。if (file != nullptr)检查是否文件被选择。如果文件对象为空，表示用户取消了选择，代码会跳过后续操作。bmp().SetSource(co_await file.OpenAsync(Windows::Storage::FileAccessMode::Read));中file.OpenAsync(Windows::Storage::FileAccessMode::Read)为异步打开文件，并指定以读取模式（FileAccessMode::Read）打开。通过co_await等待文件打开完成。bmp().SetSource()将打开的文件内容设置为图片的来源。bmp()是 XAML 中绑定的BitmapImage控件。将文件内容通过SetSource方法设置为BitmapImage的源，从而显示在界面上。如果需要支持多种图片格式，可以修改文件类型过滤器，允许选择多种文件类型，如， picker.FileTypeFilter().Append(L".png"); picker.FileTypeFilter().Append(L".jpg"); picker.FileTypeFilter().Append(L".bmp"); 10.3.5 Sqlite 数据库和 ViewModel + UserControl link该部分示例包含用户信息数据录入、查看、编辑等功能，综合应用了 SQLite 数据库、ViewModel（视图模型）和 UserControl（用户控件）等技术。 *图 10-13 SQLite 读写数据库）该项目文件结构主要包括：应用程序核心部分（App）：包含主应用入口文件（App.xaml）及其逻辑处理文件（后端代码）（App.xaml.cpp 和 App.xaml.h），负责应用程序的初始化和 UI 资源管理。用户界面（UI）：MainPage.xaml 和 MainWindow.xaml 分别定义了主页面和主窗口的 UI 布局。与之对应的 C++ 逻辑处理文件（如 MainPage.xaml.cpp、MainWindow.xaml.cpp）实现了页面的事件处理和功能逻辑。用户控件（UserControl）：UpdateUserControl.xaml 用于特定功能（如更新用户信息）的 UI 组件。相关的 C++ 文件（UpdateUserControl.xaml.cpp 和 UpdateUserControl.xaml.h）处理控件的事件和逻辑。数据库支持（SQLite）：sqlite3.c 和 sqlite3.h 包含 SQLite 数据库库文件，用于数据库的操作和管理。视图模型（ViewModel）：UserViewModel.idl 定义用户数据和视图逻辑的接口。相关的 C++ 实现文件（UserViewModel.cpp 和 UserViewModel.h）将 UI 和数据模型连接起来。其他：Package.appxmanifest 配置应用程序的元数据，如权限、功能声明等。pch.cpp 和 pch.h 为预编译头文件，用于提高编译速度等。该项目的结构清晰的分离了应用程序的各个模块，确保了 UI、业务逻辑、数据操作和视图模型之间的独立性和可维护性。核心逻辑与 UI 布局分开，使得项目可以方便地扩展和管理。 *图 10-13 SQLite 项目文件结构） 1-SQLite[sqlite3]数据库 SQLite，是一个 C 语言实现的小型、快速、自包含（self-contained）、高可靠性、功能齐全的 SQL 数据库引擎。SQLite 被广泛使用，内置于电话和计算机中，并捆绑到无数人们日常使用的应用程序中。SQLite 文件格式稳定，跨平台且向后兼容，开发者承若在 2050 年之前都会保持这种状态。从 SQLite 官网下载sqlite-amalgamation-3480000.zip文件，解压后，复制sqlite3.c和sqlite3.h两个文件置于项目WinUI3App（Desktop）新建的文件夹db中（db 文件夹上右键->Add->Existing Item...->选择 sqlite3.c和sqlite3.h）。需要修改sqlite3.c文件，删除/************** Begin file sqlite3.h *****************************************/（第319行）到/************** End of sqlite3.h *********************************************/（第 13941行）之间的内容；并通过搜索sqlite3_version定位到下述代码， #ifndef SQLITE_AMALGAMATION /* IMPLEMENTATION-OF: R-46656-45156 The sqlite3_version[] string constant ** contains the text of SQLITE_VERSION macro. */ SQLITE_API const char sqlite3_version[] = SQLITE_VERSION; #endif 将其中#ifndef SQLITE_AMALGAMATION修改为#ifdef SQLITE_AMALGAMATION。同时修改该文件的两个属性，在sqlite3.c 文件上右键->Properties->C/C++->General->Warning Level属性值修改为Level3(/W3)；C/C++->Precompiled Headers->Precompiled Header属性值修改为Not Using Precompiled Headers。Warning Level是 Microsoft C/C++ 编译器提供的一个设置，用于指定编译器在发生潜在问题时报告警告的详细级别。警告级别越高，编译器输出的警告信息越详细。Level3过滤掉了不常见或影响较小的警告信息，避免开发者因过多的警告而忽略真正需要关心的问题，兼顾开发效率和代码质量。预编译头（Precompiled Header）是 C/C++ 编译优化的一种技术，用于加快项目的编译速度，是通过将一些不经常变化的头文件（如标准库、第三方库）预先编译成二进制文件，以便在后续的编译中直接使用，而无需每次都重新处理这些头文件（预编译头文件通常被命名为stdafx.h或pch.h）。而sqlite3.c是单一源文件，并且是一个自包含的实现，不依赖外部头文件，因此使用预编译没有意义，反而可能引入编译错误（如缺少pch.h）。而禁用预编译头可以简化编译过程，确保文件能够独立编译，并避免额外的配置和兼容性问题。 2-ViewModel[UserViewModel] 通过WinUI3App(Desktop)上右键->Add->New Item...->View Model(C++/WinRT)建立ViewModel（视图模型），命名为UserViewModel，会自动生成三个文件UserViewModel.idl、UserViewModel.h和UserViewModel.cpp。 ViewModel 是 MVVM （Model-View-ViewModle）设计模式中的一个重要概念，在软件开发中广泛应用，尤其开发带有图形用户界面的应用程序。ViewModel 充当了视图（View）与数据模型（Model）之间的桥梁，并且负责处理展示逻辑。MVVM 软件架构模式将应用程序分为三个主要部分： Model（模型）：代表应用程序的核心数据和业务逻辑，通常独立于用户界面（UI）,并负责数据存储、数据处理等操作。 View（视图）：代表用户界面部分，用于展示数据，通常是应用程序中的界面元素（如按钮、文本框、标签等）。 ViewModel（视图模型）：充当 Model 和 View 之间的中介，负责给管理显示数据并将其绑定到 View，同时处理用户交互，将数据从 Model 转换为适合 View 显示的格式。 ViewModel 使得视图和模型之间的依赖关系降到最低。视图无需直接操作数据模型，也不需要知道模型的具体实现。ViewModel负责将数据传递到视图，并根据需要更新模型。ViewModel 与 View 之间的绑定，数据绑定：视图（View）通过数据绑定将 ViewModel 的属性连接到 UI 控件（如文本框、标签、按钮等）。命令绑定：视图通过命令（如按钮点击）来触发 ViewModel 中的方法。 MVVM 的优点，清晰的分离职责：MVVM 模式将 UI 和应用程序逻辑分开，帮助实现代码的清晰分离，便于维护和扩展。可测试性：由于 ViewModel 是纯粹的逻辑层，与 UI 无关，因此容易进行单元测试。灵活的 UI 更新：ViewModel 可以独立于视图进行更新，且支持响应式数据绑定，UI 可以根据数据的变化自动更新。文件 UserViewModel.idl UserViewModel.h UserViewModel.cpp 代码 namespace WinUI3App { [bindable] [default_interface] runtimeclass UserViewModel { UserViewModel(); void SetUserData(Int32 id, String firstName, String lastName, String email); String FirstName{ get; }; String LastName{ get; }; String Email{ get; }; Int32 Id{ get; }; } } #pragma once #include "UserViewModel.g.h" namespace winrt::WinUI3App::implementation { struct UserViewModel : UserViewModelT { private: int32_t id; hstring firstName; hstring lastName; hstring email; public: UserViewModel() = default; void SetUserData(int32_t _id, hstring _firstName, hstring _lastName, hstring _email); hstring FirstName(); hstring LastName(); hstring Email(); int32_t Id(); }; } namespace winrt::WinUI3App::factory_implementation { struct UserViewModel : UserViewModelT { }; } #include "pch.h" #include "UserViewModel.h" #if __has_include("UserViewModel.g.cpp") #include "UserViewModel.g.cpp" #endif namespace winrt::WinUI3App::implementation { void UserViewModel::SetUserData(int32_t _id, hstring _firstName, hstring _lastName, hstring _email) { id = _id; firstName = _firstName; lastName = _lastName; email = _email; } hstring UserViewModel::FirstName() { return firstName; } hstring UserViewModel::LastName() { return lastName; } hstring UserViewModel::Email() { return email; } int32_t UserViewModel::Id() { return id; } } 🤖 代码解读命名空间声明 namespace WinUI3App：声明UserViewModel类属于WinUI3App命名空间，以防止命名冲突，同时便于逻辑模块化。属性特性 [bindable] [default_interface] [bindable]：表示此类可用于数据绑定，允许在 XAML 中绑定类的属性，例如绑定到TextBox、TextBlock等控件。数据绑定是 MVVM（Model-View-ViewModel）设计模式的重要组成部分。 [default_interface]：指定UserViewModel的默认接口是类自身定义的接口。在 C++/WinRT 中，这可以简化类实例的使用，是因为在大多数情况下，不需要显示转换为接口类型。类定义 runtimeclass UserViewModel：runtimeclass是 C++/WinRT 特有的关键字，表示一个可供 WinRT 环境使用的类，通常用于与 XAML 或其他 WinRT API 交互，自动生成必要的 COM 接口和元数据，以便在 WinRT 环境中正常工作。构造函数 UserViewModel();：是一个默认构造函数，用于初始化UserViewModel的实例；不接受参数，但可以在其实现中初始化成员变量或执行其他操作。方法（成员函数） void SetUserData(Int32 id, String firstName, String lastName, String email);：定义了一个方法，用于批量设置用户数据；接收的参数，id为Int32类型的用户 ID，firstName为用户的名字，lastName为用户的姓氏，email为用户的电子邮件地址。实现中通常会将这些参数值存储到私有字段或成员变量中，并可能触发属性的变更通知（用于数据绑定刷新）。只读属性 String FirstName{ get; }; String LastName{ get; }; String Email{ get; }; Int32 Id{ get; }; 定义了四个只读属性：FirstName、LastName、Email和Id。每个属性都有get访问器，但没有set访问器，因此是只读的。这些属性通过SetUserData方法或构造函数进行初始化。 UserViewModel是一个 MVVM 模式中典型的 ViewModel 类，负责管理用户数据：通过SetUserData方法接收用户数据并存储；提供数据绑定支持：允许 XAML 用户界面通过数据绑定直接访问FirstName、LastName等属性；封装业务逻辑：在实际项目中，可能会包含额外的验证逻辑或通知机制（如INotifyPropertyChanged支持），以实现动态数据更新。 #include "UserViewModel.g.h"引入由编译器自动生成的头文件，用于支持 XAML 的绑定功能，包含了与runtimeclass定义相关的元数据和模板代码。 namespace winrt::WinUI3App::implementation定义在implementation命名空间中，表示这是UserViewModel的具体实现部分。 struct UserViewModel : UserViewModelT中struct UserViewModel表示定义了一个名为UserViewModel的结构体（在 C++ 中与类无实质性区别）。UserViewModelT是模板基类，提供与 WinRT 和 XAML 绑定相关的基础功能。继承自UserViewModelT的模板，可以自动实现大部分 WinRT 的接口。对应 IDL 文件SetUserData()函数的输入参数和UserViewModel类属性，定义为私有成员变量id、firstName、lastName和email。 UserViewModel() = default;声明一个默认构造函数，不执行任何初始化的操作。 void SetUserData(int32_t _id, hstring _firstName, hstring _lastName, hstring _email);设置用户数据，将外部传入的值赋值给私有成员变量。定义属性访问器hstring FirstName();返回用户的名字；hstring LastName();返回用户的姓氏；hstring Email();返回用户的电子邮件地址；int32_t Id();返回用户的ID。这些方法的实现部分会直接返回私有成员变量的值，用于外部读取。通过私有成员变量存储用户数据为数据封装；通过公共方法提供对数据的访问和修改为接口暴露。 SetUserData函数负责设置用户数据，将传入的参数值赋值给私有成员变量。即将参数_id, _firstName, _lastName, _email的值赋值给对应的成员变量id, firstName, lastName, email。属性访问器，FirstName、LastName、Email和Id方法分别直接返回私有成员变量firstName、lastName、email和id的值。 3-Database[DbHelper] 用于封装 SQLite 数据库针对用户数据处理的常用操作，如打开、关闭数据库，检索、插入、更新和删除数据等。文件 DbHelper.h DbHelper.cpp 代码 #pragma once #include "db/sqlite3.h" #include "UserViewModel.h" namespace winrt::WinUI3App::implementation { class DbHelper { private: sqlite3* db; bool doesTableExist(std::string tableName); bool doesRecordExist(const char* sql); bool executeStatement(const char* sql); int getNextId(); hstring convertToHString(const unsigned char*); public: void openDataBase(const char* path); void closeDatabase(); void getAllUsers(Windows::Foundation::Collections::IObservableVector& array); bool updateUser(int id, hstring firstName, hstring lastName, hstring email); bool deleteUser(int id); }; } #include "pch.h" #include "DbHelper.h" namespace winrt::WinUI3App::implementation { void DbHelper::openDataBase(const char* path) { int result = sqlite3_open(path, &db); if (result == SQLITE_OK) { OutputDebugString(L"Amazing!. It actually worked!\r\n"); if (!doesTableExist("users")) { executeStatement(std::string{ "create table users (id int primary key, first_name text, last_name text, email text);" }.c_str()); OutputDebugString(L"Tabel 'users' created!\r\n"); } } else { OutputDebugString(L"ERROR: Cannot open db~"); } } bool DbHelper::doesTableExist(std::string tableName) { return doesRecordExist(std::string{ "select 1 from sqlite_master where type='table' and name='" + tableName + "'" }.c_str()); } bool DbHelper::doesRecordExist(const char* sql) { bool exists = false; sqlite3_stmt* st; if (sqlite3_prepare_v2(db, sql, -1, &st, NULL) == SQLITE_OK) { exists = sqlite3_step(st) == SQLITE_ROW; } sqlite3_finalize(st); return exists; } bool DbHelper::executeStatement(const char* sql) { return sqlite3_exec(db, sql, NULL, NULL, NULL) == SQLITE_OK; } void DbHelper::closeDatabase() { sqlite3_close(db); } int DbHelper::getNextId() { int nextId = 0; sqlite3_stmt* st; if (sqlite3_prepare_v2(db, "select max(id) from users", -1, &st, NULL) == SQLITE_OK) { if (sqlite3_step(st) == SQLITE_ROW) nextId = sqlite3_column_int(st, 0); } sqlite3_finalize(st); return ++nextId; } void DbHelper::getAllUsers(Windows::Foundation::Collections::IObservableVector& array) { sqlite3_stmt* st; if (sqlite3_prepare_v2(db, "select id, first_name, last_name, email from users order by first_name", -1, &st, NULL) == SQLITE_OK) { while (sqlite3_step(st) == SQLITE_ROW) { WinUI3App::UserViewModel u = winrt::make(); u.SetUserData(sqlite3_column_int(st, 0), convertToHString(sqlite3_column_text(st, 1)), convertToHString(sqlite3_column_text(st, 2)), convertToHString(sqlite3_column_text(st, 3))); array.Append(u); } } sqlite3_finalize(st); } bool DbHelper::updateUser(int id, hstring firstName, hstring lastName, hstring email) { bool updated = false; int finalId = id == 0 ? getNextId() : id; const char* sql; /* Notice we left the field "id" at the end, so both INSERT and UPDATE have the same "bind" field order*/ if (id == 0) { sql = "insert into users (first_name, last_name, email, id) values (?, ?, ?, ?);"; } else { sql = "update users set first_name=?, last_name=?, email=? where id=?;"; } sqlite3_stmt* st; if (sqlite3_prepare_v2(db, sql, -1, &st, NULL) == SQLITE_OK) { sqlite3_bind_text(st, 1, winrt::to_string(firstName).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_text(st, 2, winrt::to_string(lastName).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_text(st, 3, winrt::to_string(email).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_int(st, 4, finalId); updated = sqlite3_step(st) == SQLITE_DONE; } sqlite3_finalize(st); return updated; } bool DbHelper::deleteUser(int id) { bool deleted = false; sqlite3_stmt* st; if (sqlite3_prepare_v2(db, "delete from users where id=?", -1, &st, NULL) == SQLITE_OK) { sqlite3_bind_int(st, 1, id); deleted = sqlite3_step(st) == SQLITE_DONE; } sqlite3_finalize(st); return deleted; } hstring DbHelper::convertToHString(const unsigned char* value) { return winrt::to_hstring(std::string{ reinterpret_cast(value) }); } } 🤖 代码解读这段代码定义了DbHelper类，封装了对 SQLite 数据库常见操作，特别是用于管理用户数据的功能。头文件的引入 #include "db/sqlite3.h"：用于访问 SQLite 数据库的 C 库头文件（该文件的配置见前文）。 #include "UserViewModel.h"：包含用户数据模型的定义，UserViewModel类封装了用户的相关信息。 DbHelper 类的定义私有成员中sqlite3* db为 SQLite 数据库的指针，用于执行数据库操作。私有方法有doesTableExist(std::string tableName)，检查指定名称的表是否存在；doesRecordExist(const char* sql)根据给定的 SQL 查询检查是否有记录符合条件；executeStatement(const char* sql)执行给定的 SQL 语句（例如INSERT、UPDATE、DELETE等）；getNextId()获取下一个可用的 ID (可能用于生成自增的 ID)；convertToHString(const unsigned char*)将 SQLite 返回的 unsigned char*转换为hstring，便于在 WinUI 中使用。公有成员中openDataBase(const char* path)用于打开数据库文件，接受数据库路径作为参数；closeDatabase()用于关闭数据库连接；getAllUsers(Windows::Foundation::Collections::IObservableVector& array);查询所有用户并将其存入传入的IObservableVector集合（向量/数组）中。IObservableVector是一个支持数据绑定的集合类型，常用于 UI 更新；updateUser(int id, hstring firstName, hstring lastName, hstring email)根据用户 ID 更新用户数据。返回布尔值表示是否成功执行；deleteUser(int id)删除指定 ID 的用户记录。返回布尔值表示操作是否成功。 DbHelper类的主要目的是封装 SQLite 数据库的操作，提供一系列方法来处理用户数据，包括打开和关闭数据库连接；执行 SQL 语句来插入、更新和删除数据；获取所有用户数据并填充到IObservableVector中，以便在 WinUI 中显示；检查表或记录是否存在等。这段代码是DbHelper类的实现，用于与 SQLite 数据库进行交互，提供了与数据库的连接、表格检查、数据插入、更新、删除及查询用户数据等功能。打开数据库文件：void DbHelper::openDataBase(const char* path) openDataBase成员函数接受一个参数path，表示数据库文件的路径（const char*类型）。 int result = sqlite3_open(path, &db);调用 SQLite 库中的sqlite3_open函数来打开数据库，path是数据库文件的路径，&db是一个指向sqlite3*类型的指针，用于接收数据库连接。如果打开数据库成功，result会被设置为SQLITE_OK，否则会返回一个错误码。 if (result == SQLITE_OK)，如果sqlite3_open返回的result等于SQLITE_OK，表示数据库成功打开，进入if语句块。 OutputDebugString(L"Amazing!. It actually worked!\r\n");，调用OutputDebugString函数将调试信息输出到调试器。如果成功打开数据库，将输出"Amazing!. It actually worked!"。 if (!doesTableExist("users")) ，调用一个名为doesTableExist的函数，传入"users"作为参数，检查数据库中是否存在名为users的表。如果返回false，表示该表不存在，进入if语句块。 executeStatement(std::string{ "create table users (id int primary key, first_name text, last_name text, email text);" }.c_str());，使用executeStatement函数执行一条 SQL 语句，创建一个名为users的表。该表包括四个字段：id（整数类型，主键），first_name（文本类型），last_name（文本类型），email（文本类型）。std::string{ ... }.c_str()将 C++ 字符串转换为 C 风格字符串（const char*）。 OutputDebugString(L"Tabel 'users' created!\r\n");，如果成功执行创建表的 SQL 语句，将输出调试信息"Table 'users' created!"。 OutputDebugString(L"ERROR: Cannot open db~");，如果sqlite3_open返回的结果不为SQLITE_OK（即数据库无法打开），进入else语句块，输出错误信息"ERROR: Cannot open db~"。该函数尝试打开一个 SQLite 数据库。如果打开成功，检查是否存在名为users的表。如果该表不存在，则创建一个新的users表。如果数据库无法打开，会输出错误提示信息。检查指定名称的表是否存在：bool DbHelper::doesTableExist(std::string tableName) doesTableExist成员函数接受一个std::string类型的参数tableName，表示要检查的表的名称。函数返回一个布尔值（bool），表示表是否存在。 return doesRecordExist(std::string{ "select 1 from sqlite_master where type='table' and name='" + tableName + "'" }.c_str());，这一行调用了doesRecordExist函数，并将一条 SQL 查询语句作为参数传递给它。SQL 查询的目的是检查数据库中是否存在指定名称的表。sqlite_master是 SQLite 内部使用的一个特殊表，存储数据库中所有对象的信息、包括表、索引和视图等。查询条件type='table'用来限定只查找类型为表的对象。name='tableName'检查表名是否匹配传入的tableName。"select 1 from sqlite_master where type='table' and name='" + tableName + "'"动态生成一个 SQL 查询语句，将tableName插入到查询字符中，构建查询检查表是否存在。std::string{ ... }通过字符串拼接创建查询字符串，+ tableName将函数参数tableName插入到 SQL 语句的name部分。最终通过c_str()将生成的 C++ 字符串转换为 C 风格字符串（const char*），并传递给doesRecordExist函数。根据给定的 SQL 查询检查是否有记录符合条件：bool DbHelper::doesRecordExist(const char* sql) doesRecordExist成员函数接受一个const char*类型的参数sql，表示要执行的 SQL 查询。函数返回一个布尔值（bool），表示是否存在符合查询条件的记录。 bool exists = false;，变量exists初始化为false，用于存储查询结果。如果查询到记录，exists将被设置为true。 sqlite3_stmt* st;，声明一个指向sqlite3_stmt类型的指针st，表示 SQL 语句的预处理句柄。sqlite3_stmt是 SQLite 的核心数据结构之一，用于表示已编译的 SQL 语句。编译 SQL 语句是指将文本形式的 SQL 语句转换为 SQLite 内部能够理解的二进制格式。这个二进制格式由sqlite3_stmt对象表示，用来执行动态的 SQL 查询或命令，并可以多次绑定参数和重新执行。sqlite3_stmt*是一个指针，用于操作sqlite3_stmt对象，由 SQLite API 函数返回（如sqlite3_prepare_v2()），开发者需要通过该指针控制 SQL 语句的执行。sqlite3_stmt*通常用于以下场景： -编译 SQL 语句。使用sqlite3_prepare_v2()函数将 SQL 语句编译成sqlite3_stmt对象。 sqlite3_stmt* st; const char* sql = "SELECT * FROM users WHERE id = ?"; sqlite3_prepare_v2(db, sql, -1, &st, nullptr); -绑定参数。使用sqlite3_bind_* 系列函数将值绑定到预处理语句中的参数（?占位符）。 sqlite3_bind_int(st, 1, user_id); -执行语句。使用sqlite3_step()执行预处理的语句，逐步获取查询结果。 while (sqlite3_step(st) == SQLITE_ROW) { const unsigned char* name = sqlite3_column_text(st, 0); printf("User Name: %s\n", name); } -是否资源。使用sqlite3_finalize()释放sqlite3_stmt对象占用的资源。 sqlite3_finalize(st); sqlite3_stmt*是动态分配的，需要手动管理其生命周期。当完成对sqlite3_stmt*的使用后，必须调用sqlite3_finalize()来释放内存，否则会造成内存泄漏。每个sqlite3_stmt对象只能与一个数据库连接绑定，且在同一时间只能由一个线程使用。在绑定参数或读取结果时，应确保数据类型匹配，否则可能会导致运行时错误。 if (sqlite3_prepare_v2(db, sql, -1, &st, NULL) == SQLITE_OK) ，sqlite3_prepare_v2是 SQLite 提供的一个 API，用于将文本形式的 SQL 语句编译成二进制的 SQLite 内部格式（sqlite3_stmt对象），是执行 SQL 查询或命令的第一步，之后可以使用返回的sqlite3_stmt对象进行操作。参数sqlite3* db为已打开的数据库连接句柄，通过sqlite3_open()或sqlite3_open_v2()获得，表示将在此数据库上执行编译和查询操作。const char* zSql为待编译的 SQL 语句，必须是 UTF-8 编码。可以包含多个 SQL 命令（如SELECT、INSERT），但函数只编译第一个命令。int nByte指定 SQL 语句的字节长度，如果为 -1则编译直到遇到字符串结束符\0。如果提供了具体的字节数，只会编译该长度范围内的 SQL。sqlite3_stmt** ppStmt为输出参数，用于接收已编译的 SQL 语句对象。成功时，ppStmt指向一个sqlite3_stmt对象，该对象用于绑定参数和执行查询。const char** pzTail为输出参数，用于返回zSql中未编译部分的起始位置。如果为NULL，则忽略未编译部分。如果sqlite3_prepare_v2返回SQLITE_OK，表示编译成功；SQLITE_ERROR，表示 SQL 语法错误；SQLITE_NOMEM表示内存不足；SQLITE_BUSY表示数据库忙。 exists = sqlite3_step(st) == SQLITE_ROW;，如果预处理成功（返回值为SQLITE_OK），则进入if语句块。sqlite3_step执行查询语句，返回查询结果的状态，SQLITE_ROW表示查询成功并返回至少一行数据；SQLITE_DONE表示查询没有返回数据。如果sqlite3_step返回SQLITE_ROW，表示查询到了符合条件的记录，将exists设置为true。 sqlite3_finalize(st);用于释放预处理语句句柄st，清理资源，防止内存泄漏。 return exists;，返回exists，如果查询到至少一行数据，exists为true，否则为false。 doesRecordExist函数执行给定的 SQL 查询，并检查是否有符合条件的记录。通过sqlite3_prepare_v2预处理 SQL 查询，使用sqlite3_step执行查询，并根据返回值判断是否存在符合条件的记录。最后，调用sqlite3_finalize清理预处理句柄，并返回查询结果（布尔值）。执行给定的 SQL 语句：bool DbHelper::executeStatement(const char* sql) sqlite3_exec(db, sql, NULL, NULL, NULL) == SQLITE_OK;，被调用来执行sql中的语句，并通过返回值检查是否成功。参数sqlite3* db为已打开的数据库连接句柄，通过sqlite3_open()或sqlite3_open_v2()获得。表示在此数据库上执行sql语句。const char* sql为要执行的 SQL 查询或命令字符串。可以包含多条 SQL 命令（用分号;分隔），sqlite3_exec会逐一执行。int (*callback)(void*, int, char**, char**)为执行SELECT查询时的回调函数，用于处理结果集的每一行。回调函数的参数第1个void*类型，表示用户提供的附加数据（通过arg传入）；第2个参数是查询结果的列数；第3个参数是包含每列值的数组；第4个参数是包含每列名称的数组。如果设置为NULL，表示不需要处理回调，通常用于非查询语句。void* arg传递个回调函数的第1个参数，可用于传递上下文数据。如果不需要，可设置为NULL。char** errmsg指向字符串指针，用于返回执行失败时的错误消息。成功时，指针不会改变；失败时，指针指向动态分配的字符串，需调用sqlite3_free()释放内存。sqlite3_exec返回一个整数，用于指示操作是否成功。返回SQLITE_OK(0)为执行成功，其他值为执行失败，如SQLITE_ERROR表示 SQL 语法错误；SQLITE_BUSY为数据库忙；SQLITE_MISUSE为 API 使用错误。该语句调用sqlite3_exec执行sql中的 SQL 命令。将回调函数和上下文数据设置为NULL，意味着不需要处理查询结果或传递附加数据（一般用于INSERT、UPDATE、DELETE或非查询操作）。将错误消息参数设置为NULL，表示不需要返回错误信息。比较返回值是否为SQLITE_OK，以判断是否执行成功。关闭数据库连接：void DbHelper::closeDatabase() sqlite3_close(db);，使用sqlite3_close函数关闭由sqlite3_open打开的数据库连接。参数sqlite3* db为数据库连接句柄。成功关闭数据库返回SQLITE_OK；关闭失败则为其他错误代码。sqlite3_close会释放与数据库连接相关的所有资源，避免资源泄漏，提升应用的稳定性。如果存在未释放的语句句柄（例如未调用sqlite3_finalize），关闭操作可能会失败。为确保数据库始终能被正确关闭，可以在异常或程序结束时调用closeDatabase，添加错误检测和连接状态检查，进一步增强其可靠性。如， void DbHelper::closeDatabase() { if (db != nullptr) { if (sqlite3_close(db) == SQLITE_OK) { db = nullptr; // 确保指针不再指向释放的资源 } else { OutputDebugString(L"Failed to close the database.\n"); } } } 获取下一个可用的 ID：int DbHelper::getNextId() getNextId是一个用于获取数据库表中主键字段id的下一个可用值的函数。是通过查询users表中id的最大值来推断下一个主键值。返回的值通常用于插入新记录，确保主键的唯一性。 int nextId = 0;定义并初始化变量nextId为0，用于存储查询结果，为表中当前最大id的值。 sqlite3_stmt* st;声明一个类型为sqlite3_stmt*的指针变量st，用于存储 SQL 语句的预处理句柄。 if (sqlite3_prepare_v2(db, "select max(id) from users", -1, &st, NULL) == SQLITE_OK)调用 SQLite 的sqlite3_prepare_v2函数对 SQL 查询进行预处理，目的是从users表中查询最大id值。"select max(id) from users"为 SQL 查询语句，获取users表中id列的最大值。执行查询并获取结果。if (sqlite3_step(st) == SQLITE_ROW)是使用sqlite3_step执行预处理后的 SQL 查询。如果返回SQLITE_ROW，表示查询返回了一行数据；如为其他值，表示查询没有返回数据或出错。当返回值为SQLITE_ROW，执行nextId = sqlite3_column_int(st, 0);，获取查询结果第一列的值（max(id)的结果），并赋值给变量nextId。 sqlite3_finalize(st);调用sqlite3_finalize函数释放预处理语句句柄st。 return ++nextId;，返回nextId之前，将其递增1，表示下一条记录的id是当前最大id加1。该函数的功能是从users表中查询当前最大id，将其加1并返回。但存在潜在的问题，如并发问题：如果多个线程或进行同时插入数据，可能导致nextId冲突；性能影响：每次获取新 ID 都需要查询整个表，随着数据量的增大，可能影响性能；表为空时的情况：当表为空时，查询max(id)返回NULL，当前逻辑通过初始化nextId = 0处理了此情况。对当前函数的改进可以检查sqlite3_prepare_v2和sqlite3_step的返回值，处理失败情况（异常处理），如， int DbHelper::getNextId() { int nextId = 0; sqlite3_stmt* st; if (sqlite3_prepare_v2(db, "select max(id) from users", -1, &st, NULL) != SQLITE_OK) { OutputDebugString(L"Failed to prepare SQL statement.\n"); return -1; // 返回错误值 } if (sqlite3_step(st) == SQLITE_ROW) { nextId = sqlite3_column_int(st, 0); } else { OutputDebugString(L"Failed to retrieve the maximum ID.\n"); } sqlite3_finalize(st); return ++nextId; } 使用数据库自增功能替代手动管理 ID，避免冲突（并发控制），如， create table users ( id integer primary key autoincrement, first_name text, last_name text, email text ); 如果手动管理 ID，考虑在程序内维护一个计数器变量，减少频繁的查询（优化性能），如， int lastId = getNextId(); // 初始化时获取最大 ID // 插入新记录时： int newId = ++lastId; 当前实现逻辑简单可靠，适合小型应用和低并发场景。如果需要处理高并发或大数据场景，推荐改用 SQLite 的AUTOINCREMENT功能，简化逻辑并提高效率。检索所有用户记录并存入容器中：void DbHelper::getAllUsers(Windows::Foundation::Collections::IObservableVector& array) getAllUsers函数从数据库中的users表中检索所有用户记录，并将这些记录填充到提供的IObservableVector类型的容器中，每条记录对应一个UserViewModel实例。 void DbHelper::getAllUsers(Windows::Foundation::Collections::IObservableVector& array)是DbHelper类的一个成员函数，名为getAllUsers，其作用是从 SQLite 数据库中的users表中获取所有用户数据。array是传入的参数，是一个IObservableVector类型的引用，表示一个可观察的动态数组。函数通过该数组返回用户数据。 sqlite3_stmt* st;，声明一个指向sqlite3_stmt类型的指针st，用于存储 SQL 语句的预处理句柄。 if (sqlite3_prepare_v2(db, "select id, first_name, last_name, email from users order by first_name", -1, &st, NULL) == SQLITE_OK)，调用sqlite3_prepare_v2函数对 SQL 查询进行预处理。该查询从users表中选择id，first_name，last_name，和email字段，并按first_name字段排序。如果预处理成功（返回值为SQLITE_OK），则进入if语句块。 while (sqlite3_step(st) == SQLITE_ROW)，使用sqlite3_step执行查询语句。每次调用sqlite3_step返回的值表示查询的状态，sqlite3_step表示查询成功并返回一行数据；SQLITE_DONE表示查询已完成，没有更多数据。如果返回值为SQLITE_ROW，表示查询到了一行数据，进入while循环。 WinUI3App::UserViewModel u = winrt::make();为创建用户视图模型并设置数据。使用winrt::make创建一个UserViewModel类型的对象u，用于存储每个用户的数据。 u.SetUserData( sqlite3_column_int(st, 0), convertToHString(sqlite3_column_text(st, 1)), convertToHString(sqlite3_column_text(st, 2)), convertToHString(sqlite3_column_text(st, 3)) ); 调用UserViewModel类中的SetUserData方法，设置用户的数据。该方法接受四个参数，sqlite3_column_int(st, 0)：获取当前行的第0列（id），并将其作为整数传递；convertToHString(sqlite3_column_text(st, 1))：获取当前行的第1列（first_name），然后通过convertToHString函数将其转换为HString类型；convertToHString(sqlite3_column_text(st, 2))和convertToHString(sqlite3_column_text(st, 3))则分别对应第2、3列，为last_name和email，并分别转换为HString。convertToHString是一个辅助函数，用于将const char*类型的 C 字符串转换为 HString类型。sqlite3_column_*是 SQLite 提供的一组函数，用于根据列的索引或列名，从查询结果中提取特定的值。不同类型的数据列有不同的函数，格式如下，sqlite3_column_text()获取文本列的值；sqlite3_column_int()获取整数列的值；sqlite3_column_double()获取浮点（Real）列的值；sqlite3_column_blob()获取二进制数据列的值；sqlite3_column_bytes()获取列的数据长度（字节数）；sqlite3_column_type()获取列的数据类型。 array.Append(u);将用户数据添加到数组array中。 sqlite3_finalize(st);调用sqlite3_finalize函数，释放预处理语句句柄st，清理资源。该函数从数据库中查询所有用户数据，并将每个用户的数据存储到array数组中。array是一个IObservableVector类型的数组。其执行流程为，使用sqlite3_prepare_v2准备 SQL 查询语句，查询users表中的id、first_name、last_name和email字段；使用sqlite3_step循环遍历查询结果；对于每一行数据，创建一个UserViewModel对象并填充数据；将UserViewModel对象添加到array中；释放 SQL 语句句柄，清理资源。根据用户 ID 更新用户数据：bool DbHelper::updateUser(int id, hstring firstName, hstring lastName, hstring email) updateUser用于更新或插入用户数据到数据库的users表，是根据id来决定执行插入（INSERT）还是更新（UPDATE）操作。函数定义。 bool DbHelper::updateUser(int id, hstring firstName, hstring lastName, hstring email)，参数id为用的id，如果为0，则表示插入操作；firstName用户的名；lastName用户的姓；email用户的电子邮件。返回值是布尔值updated，如果操作成功返回true；否则返回false。初始化变量。 bool updated = false;定义初始化变量updated为false。这个变量用于表示操作是否成功，如果成功执行插入或更新操作，并将该变量设置为true。 int finalId = id == 0 ? getNextId() : id;用于确定插入或更新操作的id。如果id==0，表示需要插入新的用户记录，因此调用getNextId()获取下一个可用的id；如果id不为0，使用传入的id来执行更新操作。 SQL 查询语句选择。 const char* sql; if (id == 0) { sql = "insert into users (first_name, last_name, email, id) values (?, ?, ?, ?);"; } else { sql = "update users set first_name=?, last_name=?, email=? where id=?;"; } 根据id的值，选择要执行的 SQL 查询语句：插入操作（INSERT）：如果id==0，选择插入查询语句，插入新的first_name、last_name、email和id到users表。更新操作（UPDATE）：如果id != 0，选择更新查询语句，更新已有用户记录的first_name、last_name和email，条件是id匹配。预处理 SQL 查询。 sqlite3_stmt* st; if (sqlite3_prepare_v2(db, sql, -1, &st, NULL) == SQLITE_OK) 调用sqlite3_prepare_v2函数对 SQL 查询进行预处理。如果处理成功返回SQLITE_OK，进入if语句块。绑定 SQL 参数。 sqlite3_bind_text(st, 1, winrt::to_string(firstName).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_text(st, 2, winrt::to_string(lastName).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_text(st, 3, winrt::to_string(email).c_str(), -1, SQLITE_TRANSIENT); sqlite3_bind_int(st, 4, finalId); 将firstName、lastName、email和finalId的值绑定到 SQL 查询语句中的参数： sqlite3_bind_text：将firstName、lastName和email转换为std::string（使用winrt::to_string），然后绑定到查询语句中的相应位置。SQLITE_TRANSIENT表示数据绑定时使用临时内存。 sqlite3_bind_int：将finalId（用户的id）绑定到查询语句中的第4个参数位置。执行查询。 updated = sqlite3_step(st) == SQLITE_DONE;：调用sqlite3_step执行预处理的 SQL 查询，并返回执行状态。如果为SQLITE_DONE，表示 SQL 语句成功执行（插入或更新成功）；其他返回值表示执行失败。如果执行成功且返回SQLITE_DONE，则将updated设置为true，表示操作成功。结束 SQL 语句。 sqlite3_finalize(st);：调用sqlite3_finalize函数释放预处理语句句柄st，清理资源，防止内存泄漏。返回结果。 return updated;：返回updated，表示操作是否成功。如果操作成功（插入或更新），返回true；否则返回false。该函数用于更新或插入用户数据到数据库的users表。如果id为0，则执行插入操作；如果id不为0，则执行更新操作。其执行流程为，确定最终的id（如果id为0，则调用getNextId()获取下一个可用的id）；根据id的值选择相应的 SQL查询（插入或更新）；预处理 SQL 查询语句；将firstName、lastName、email和id绑定到 SQL 查询中；执行查询，并检查操作是否成功；清理资源，释放预处理语句句柄；返回操作是否成功额结果。删除指定 ID 的用户记录：bool DbHelper::deleteUser(int id) bool DbHelper::deleteUser(int id)根据传入的id删除对应的用户记录。返回值是布尔值deleted，如果删除操作成功则返回true；否则返回false。 bool deleted = false;，定义并初始化变量deleted为false。该变量用于表示删除操作是否成功。如果成功则返回true。 sqlite3_stmt* st;为 SQL 语句的预处理句柄。 if (sqlite3_prepare_v2(db, "delete from users where id=?", -1, &st, NULL) == SQLITE_OK)，调用sqlite3_prepare_v2函数对 SQL 查询语句进行预处理。如果预处理成功，则进入if语句块。 sqlite3_bind_int(st, 1, id);调用sqlite3_bind_int函数将id参数绑定到 SQL 查询语句中的第一个参数（?），用于指定要删除的用户id。 deleted = sqlite3_step(st) == SQLITE_DONE;调用sqlite3_step执行预处理的 SQL 查询。SQLITE_DONE表示 SQL 语句成功执行（删除操作成功）。如果执行成功且返回SQLITE_DONE，则将deleted设置为true，表示删除操作成功。 sqlite3_finalize(st);调用sqlite3_finalize函数释放预处理语句句柄st，清理资源。 return deleted;返回deleted，表示删除操作是否成功。如果成功返回ture；否则返回false。该函数用于删除users表中指定id的用户数据。其执行流程为，定义deleted变量，用于标识删除操作是否成功；使用sqlite3_prepare_v2函数预处理删除 SQL 查询；使用sqlite3_bind_int函数绑定要删除的用户id；执行 SQL 查询，检查删除操作是否成功；释放 SQL 语句句柄，清理资源；返回删除操作是否成功的结果。将unsigned char*类型的值转换为hstring类型：hstring DbHelper::convertToHString(const unsigned char* value) convertToHString用于将unsigned char*类型的value转换为hstring类型。参数value是一个指向unsigned char类型数据的指针（通常是来自数据库查询的字符串值），需要被转换为hstring。返回值是一个hstring类型的对象，表示转换后的字符串。 return winrt::to_hstring(std::string{ reinterpret_cast(value) });，首先将unsigned char*类型的value转换为std::string类型，再将其转换为hstring类型并返回。reinterpret_cast(value)将unsigned char*转换为const char*。reinterpret_cast是一种类型转换，允许强制将一个类型转换为其他类型。因为std::string构造函数需要一个const char*类型的参数初始化，因此这里将unsigned char*转换为const char*。std::string{ ... }将转换后的const char*类型指针传给std::string构造函数，生成一个std::string对象。此处std::string构造函数会处理原始字节数据，生成一个正常的 C++ 字符串。winrt::to_hstring(...)将std::string对象转换为hstring类型。winrt::to_hstring是 WinRT（Windows Runtime）提供的一个函数，用于将 C++ 标准字符串类型（如std::string）转换为hstring类型，后者是 WinUI 中的字符串类型。这个转换函数在处理从数据库查询返回的字节数据（如文本数据）是非常有用，尤其是在需要将这些数据转换为 Windows 应用程序能够理解和处理的字符串类型时。 4-App 该示例中，App包含DbHelper类的定义文件，并声明和定义了DbHelper类的静态成员变量db，作为应用程序的全局数据库工具。文件 App.xaml App.xaml.h App.xaml.cpp 代码 #pragma once #include "App.xaml.g.h" #include "DbHelper.h" namespace winrt::WinUI3App::implementation { struct App : AppT { App(); void OnLaunched(Microsoft::UI::Xaml::LaunchActivatedEventArgs const&); static DbHelper db; private: winrt::Microsoft::UI::Xaml::Window window{ nullptr }; }; } #include "pch.h" #include "App.xaml.h" #include "MainWindow.xaml.h" using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3App::implementation { DbHelper App::db{}; App::App() { #if defined _DEBUG && !defined DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION UnhandledException([](IInspectable const&, UnhandledExceptionEventArgs const& e) { if (IsDebuggerPresent()) { auto errorMessage = e.Message(); __debugbreak(); } }); #endif } void App::OnLaunched([[maybe_unused]] LaunchActivatedEventArgs const& e) { window = make(); window.Activate(); } } 🤖 代码解读 RequestedTheme="Light"设置应用程序的全局主题，指定为浅色模式。 #include "DbHelper.h"为包含DbHelper类的定义文件，允许当前项目使用自定义的数据库处理类。 static DbHelper db;声明了一个静态成员变量db，类型为DbHelper。static表示db是一个全局共享的静态变量，所有App实例共享一个DbHelper实例。 DbHelper App::db{};定义了DbHelper类的静态成员变量db。使用{}调用默认构造函数初始化，创建DbHelper实例。作为应用程序的全局数据库工具，用于处理数据库连接和操作。 5-MainWindow 在MainWindow中嵌入MainPage页面，主要目的是为了实现职责分离和模块化设计，从而提高代码的可读性、可扩展性和可维护性。文件 MainWindow.xaml MainWindow.xaml.h MainWindow.xaml.cpp MainWindow.idl 代码 #pragma once #include "MainWindow.g.h" namespace winrt::WinUI3App::implementation { struct MainWindow : MainWindowT { MainWindow(){} }; } namespace winrt::WinUI3App::factory_implementation { struct MainWindow : MainWindowT { }; } #include "pch.h" #include "MainWindow.xaml.h" #if __has_include("MainWindow.g.cpp") #include "MainWindow.g.cpp" #endif using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3App::implementation { } namespace WinUI3App { [default_interface] runtimeclass MainWindow : Microsoft.UI.Xaml.Window { MainWindow(); } } 🤖 代码解读引用本地命名空间的MainPage页面，并将其嵌入到Window中。MainPage是另一个 XAML 文件，定义了用户界面的具体内容。 6-UserControl[UpdateUserControl] 通过WinUI3App(Desktop)上右键->Add->New Item...->User Control(WinUI3)建立UserControl（用户控件），命名为UpdateUserControl，会自动生成4个文件UpdateUserControl.xaml、UpdateUserControl.idl、UpdateUserControl.h和UpdateUserControl.cpp。UserControl允许开发者将多个控件和功能组合在一起，形成一个新的复合控件，方便在项目中重复使用和维护。文件 UpdateUserControl.xaml UpdateUserControl.xaml.h UpdateUserControl.xaml.cpp UpdateUserControl.idl 代码 #pragma once #include "UpdateUserControl.g.h" namespace winrt::WinUI3App::implementation { struct UpdateUserControl : UpdateUserControlT { private: int32_t id; winrt::event < Windows::Foundation::EventHandler> userUpdatedEvent; // The actual event object used internally public: UpdateUserControl(){} void LoadUserData(int32_t _id, hstring firstName, hstring lastName, hstring email); winrt::event_token UserUpdated(const Windows::Foundation::EventHandler& handler); // Add an event handler and returns token void UserUpdated(const winrt::event_token& token); // Use the token to remove event handler void saveButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e); }; } namespace winrt::WinUI3App::factory_implementation { struct UpdateUserControl : UpdateUserControlT { }; } #include "pch.h" #include "UpdateUserControl.xaml.h" #if __has_include("UpdateUserControl.g.cpp") #include "UpdateUserControl.g.cpp" #endif #include "App.xaml.h" using namespace winrt; using namespace Microsoft::UI::Xaml; namespace winrt::WinUI3App::implementation { void UpdateUserControl::LoadUserData(int32_t _id, hstring firstName, hstring lastName, hstring email) { id = _id; firstNameBox().Text(firstName); lastNameBox().Text(lastName); emailBox().Text(email); } winrt::event_token UpdateUserControl::UserUpdated(const Windows::Foundation::EventHandler& handler) { // Add a new event handler (or listner) return userUpdatedEvent.add(handler); } void UpdateUserControl::UserUpdated(const winrt::event_token& token) { // Remove the event handler (or listner) userUpdatedEvent.remove(token); } void UpdateUserControl::saveButton_Click(winrt::Windows::Foundation::IInspectable const& sender, winrt::Microsoft::UI::Xaml::RoutedEventArgs const& e) { if (firstNameBox().Text().empty()) { firstNameBox().Focus(Microsoft::UI::Xaml::FocusState::Keyboard); return; } if (lastNameBox().Text().empty()) { lastNameBox().Focus(Microsoft::UI::Xaml::FocusState::Keyboard); return; } if (emailBox().Text().empty()) { emailBox().Focus(Microsoft::UI::Xaml::FocusState::Keyboard); return; } bool saved = App::db.updateUser(id, firstNameBox().Text(), lastNameBox().Text(), emailBox().Text()); if (saved) { OutputDebugString(L"Saved!"); firstNameBox().Text(L""); lastNameBox().Text(L""); emailBox().Text(L""); firstNameBox().Focus(Microsoft::UI::Xaml::FocusState::Keyboard); } userUpdatedEvent(*this, 0); } } namespace WinUI3App { [default_interface] runtimeclass UpdateUserControl : Microsoft.UI.Xaml.Controls.UserControl { UpdateUserControl(); void LoadUserData(Int32 id, String firstName, String lastName, String email); event Windows.Foundation.EventHandler UserUpdated; } } 🤖 代码解读这个 XAML 文件定义了一个名为UpdateUserControl的用户控件（UserControl），用于实现用户信息的更新界面。 x:Class="WinUI3App.UpdateUserControl"，表示这个 XAML 文件对应的后端代码所属类名。通过x:Class将前端（UI）和后端（逻辑）关联，即在前端定义 UI，在后端编写逻辑，处理用户交互，来提升代码的清晰度和模块化，支持复用和扩展性。为控件内部通过StackPanel布局，按垂直方向排列子控件。输入框TextBox用于定义用户输入字段，包括名字firstNameBox、姓氏lastNameBox和邮箱emailBox，其中InputScope="NameOrPhoneNumber"设置输入范围，提示软键盘优化为适合输入姓名或电话号码；InputScope="EmailNameOrAddress"设置数据范围，提示软键盘优化为适合输入电子邮件地址。定义按钮Button，设置点击事件关联到后端代码saveButton_Click事件处理函数。 struct UpdateUserControl : UpdateUserControlT：定义了一个名为UpdateUserControl的结构体。UpdateUserControlT是一个模板类，通常由 XAML 编译器生成，作为自定义控件的基类。UpdateUserControlT提供了 XAML 与 C++ 后端代码的绑定机制，使得控件能够在 XAML 中被使用并自动与 C++ 后端逻辑进行交互。 int32_t id;：用来存储用户的唯一标识（ID）。可以用来加载或更新特定用户的数据。 winrt::event

组件	说明	示例	示例代码下载
Panel Font	配置 Panel 面板的字体类型、大小及 Panel 的颜色		⇩moths_GUI_PanelFont.gh下载
配置画布网格颜色	变换 GH 画布（canvas）颜色（及分割线）的工具		⇩moths_GUI_GridColor.gh下载

3.8 GUI（GH 界面）

GUI（GH 界面） link

GUI（GH 界面）