
WinUI 3 上手指南5 步让你的 Windows 应用拥有 Win11 原生质感【免费下载链接】microsoft-ui-xamlWinUI: a modern UI framework with a rich set of controls and styles to build dynamic and high-performing Windows applications.项目地址: https://gitcode.com/GitHub_Trending/mi/microsoft-ui-xaml你维护 Win32 应用多年消息循环写到手酸看到 Win11 的毛玻璃和 Mica 材质GDI 只能画个手绘圆角将就。WinUI 3项目名 microsoft-ui-xaml是微软开源的现代化 UI 框架XAML 声明式写界面渲染走 GPU 加速合成Fluent Design 语言开箱即用这就是它和传统 Windows 应用的分水岭。 30 秒速览和传统 Win32 差在哪关注点传统 Win32/GDIWinUI 3渲染路径CPU 光栅化大面积重绘就卡GPU 加速合成只重绘变化区域写码方式手写消息循环、窗口管理、绘制声明式 XAML改属性即刷界面视觉样式全靠手搓明暗两套主题各做一遍Fluent Design 内置Mica、Acrylic 材质一个属性开启控件库固定一整套 Win32 控件ColorPicker、NavigationView、TabView 等更丰富的现代化控件分发单 exe打包应用与非打包应用都支持这些不是口号。下面的 ColorPicker 就是框架自带的真实控件色盘、透明度滑杆、十六进制输入全部内置你一行业务代码都不用写。 动手跑通三条命令拿到第一个窗口环境准备克隆仓库并跑初始化脚本最稳的路径是跑通仓库自带的示例应用。先克隆代码git clone https://gitcode.com/GitHub_Trending/mi/microsoft-ui-xaml然后按 构建入门文档 的顺序来根目录执行OneTimeSetup.cmd -Install MSBuild装好构建工具链再用init.cmd初始化环境接着.\scripts\buildSample.cmd WinUICsDesktopSampleApp把 C# 桌面示例编译出来。示例的构建方式在 示例应用构建说明 里有更细的分支讲法。第一个控件和第一个自定义属性跑起来之后试着在页面上加两行 XAMLStackPanel Padding24 Spacing12 ColorPicker IsColorPageVisibleFalse ShowAlphaSliderTrue / Button Content保存 Style{StaticResource AccentButtonStyle} / /StackPanel这行加完按钮就带上了系统主题色和悬停、按压动画不用再手写事件。想给自己的控件加业务属性用依赖属性Dependency Property可以理解为控件上可被绑定的属性public sealed partial class SaveButton : Button { public static readonly DependencyProperty SaveCountProperty DependencyProperty.Register(nameof(SaveCount), typeof(int), typeof(SaveButton), new PropertyMetadata(0)); public int SaveCount { get (int)GetValue(SaveCountProperty); set SetValue(SaveCountProperty, value); } }写完之后SaveButton在 XAML 里就和别的控件一样用SaveCount还能直接参与数据绑定。 拆三个机制状态机、虚拟化和窗户后面的那层玻璃VisualStateManager控件动画为什么不用你写事件。它解决的问题状态和动画散落在事件处理器里越写越乱。它的做法控件外观被拆成若干状态组VisualStateGroup运行时根据条件切到对应状态挂在状态上的 Storyboard 负责过渡动画。你的用法在 ControlTemplate 里加一个PointerOver状态悬停动画就有了一行代码都不用碰。虚拟化ListView 为什么塞几万行也不卡。它解决的问题可视区域外的内容根本不该存在于屏幕上。它的做法只为可视区按需创建容器滚出屏幕的容器被回收复用。你的用法绑定ItemsSource就白拿虚拟化想更细地控制布局再看 ItemsRepeater 一族。顺带一提下面这个 AnnotatedScrollBar 也是框架自带的真控件给滚动条加上了带注释的定位玻璃窗口Win11 毛玻璃到底从哪来。它解决的问题手绘半透明是假毛玻璃糊一层高斯模糊而已。它的做法顶层窗口背后有一层独立的玻璃窗见下图系统实时合成窗口下方的材质。你的用法在AppWindow上启用系统背景材质并定制标题栏Mica 质感直接到手设计细节可参考 自定义标题栏设计笔记。️ 仓库地图卡住时去哪翻构建入门源码级构建的权威说明控件开发指南自己写控件的模板与流程设计笔记各控件的设计动机设计规范正式 API 规范初始化脚本init.cmd背后的逻辑控件源码在controls/dev/下按控件分目录每个目录都带实现、资源和测试 踩坑记录最容易翻车的 4 处⚠️SDK 版本要对齐。非打包应用的自包含运行时版本必须和Microsoft.WindowsAppSDKNuGet 包一致报无法加载 DLL先查这里。两条构建路别混。想研究框架源码走 GettingStarted.md 的源码构建只想做应用直接在 Visual Studio 里用 Windows App SDK 模板建项目不必自己编译框架。本地化别硬编码。控件内置文案是controls/dev/各目录下的.resw资源文件按语言加资源文件即可界面代码一行不动。⏱️性能不对劲先上 WPA。按 性能分析指南 抓 ETW先看渲染线程 CPU 和 GPU 时间别急着上 Composition API 微调用。回看开头那两句手写消息循环、手绘圆角。现在一个有 Win11 质感的窗口就是几行 XAML 的事。去克隆仓库改那个 Button 试试——第一次看到悬停动画生效时你就懂了这套框架想省掉的是什么。【免费下载链接】microsoft-ui-xamlWinUI: a modern UI framework with a rich set of controls and styles to build dynamic and high-performing Windows applications.项目地址: https://gitcode.com/GitHub_Trending/mi/microsoft-ui-xaml创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考