也就前周,.Net MAUI正式版出来了 ,一个支持跨平台的UI框架,Linux支持情况官网也没说,按理来说应该也是支持的,刚好,我最近也在研究GUI的基本原理,微软出品还是值得深入研究一下的,就先来个样例,瞅瞅。
MAUI 安装
首先得是 Visual Studio 2022,然后,版本更新到最新,版本为 17.3.0
![null 057de1b49ab0a0ebe458d570a5e0f85e.png](https://i-blog.csdnimg.cn/blog_migrate/50c4967b4e188673264c49e7185c503e.png)
打开 Visual Studio Installer 进行安装版本,即可,建议直接安装最新,省事儿。
![null bb7951813a1af644f65da2d44f929297.png](https://i-blog.csdnimg.cn/blog_migrate/36489d77d3089f874470defd55860434.png)
安装的时候,一定要选择MAUI工作负荷,要不然,升级了最新版本,可能还没有这个模板。
![null 367be90d00523966f706c8fb7e08657c.png](https://i-blog.csdnimg.cn/blog_migrate/64bad0a23ebed39d48dec65f7ad7a5f8.png)
MAUI 新建项目
其实新建的时候,有三个可选,但是,实际上有两个项目,一个是.Net MAUI Blazor应用,一个是.NET MAUI 应用。
从这个趋势上来看,Blazor应用,微软还是很看好的。
新建一个 .NET MAUI应用。
![null 1a1c84756b1b24738a08e83f359eb0a9.png](https://i-blog.csdnimg.cn/blog_migrate/f20b8d9db16f73fd6b0e826a76c0f914.png)
默认项目,打开跟WPF 很像,文件后缀也是Xaml
![null 67636987edf154099f9bf31e6092dfd2.png](https://i-blog.csdnimg.cn/blog_migrate/3151a340057569ad3b628e2959e8c08d.png)
但是在这个平台部分,支持了多个平台基本,安卓,苹果微软的都支持了。
![null b1f4315608ce44dc05e8fe5cafa6c51f.png](https://i-blog.csdnimg.cn/blog_migrate/c595858cdfa587b4d1525536a6694b9c.png)
那么,就达到了下图的目的了,真正实现了跨平台的UI。
![null cf28bbede5de29d2e727002c67943f29.png](https://i-blog.csdnimg.cn/blog_migrate/307d3c10b29f00bc49db41c3a8638f8b.png)
MAUI 框架简单分析
有一个神奇的发现啊,首先 Visual Studio 2022 的IDE的窗体竟然是WPF写的,这个666。可见微软对自己家产品的支持力度。
![null 52be1b9d6ea65effe1b33e84081b954f.png](https://i-blog.csdnimg.cn/blog_migrate/d5373f9c65398b215b43346e9ffd8e91.png)
另外,MAUI 项目运行后,打开是这个样子,还可以点击一下,算是官方提供的最简单的案例了。
![null 461be60bccc910a7965352072f1c034b.png](https://i-blog.csdnimg.cn/blog_migrate/b7b58fd94931cdb9f038f45559d9d38a.png)
经过分析,它是基于WIN32的,也验证了我的猜想,要想设计一个GUI,必须得从系统的本地UI入手,才是最合适的。
![null 6c35a4dc4f4902878de52ab5730aa07b.png](https://i-blog.csdnimg.cn/blog_migrate/e4166fe91d8ce2814cfcdc21a2c6bc35.png)
所以,它是基于windwos系统本地的窗口的API,经过自己的GUI技术进行渲染的。
从官方源码里看到
![null 4d1184cb905a40c17874602f73f32104.png](https://i-blog.csdnimg.cn/blog_migrate/a3ca68544fde2ba387a4b9521a1702a9.png)
也是支持Skia渲染支持的,可见现在UI的跨平台渲染技术开始有聚合之势。
从官方文档里也透漏Xamarin.Forms 可以直接平移到 .NET MAUI上,可见,也可以把它当做 Xamarin.Forms的升级版。
.NET MAUI 的工作原理
.NET MAUI 将 Android、iOS、macOS 和 Windows API 统一到单个 API 中,该 API 允许在任意位置运行一次的开发人员体验,同时提供对每个本机平台的各个方面的深入访问。
.NET 6 提供了一系列特定于平台的框架来创建应用:适用于 Android 的 .NET、适用于 iOS 的 .NET、适用于 macOS 的 .NET 和 Windows UI 3 (WinUI 3) 库。这些框架都有权访问同一个 .NET 6 基类库 (BCL) 。此库将基础平台的详细信息从代码中抽象化。BCL 依赖于 .NET 运行时,为代码提供执行环境。对于 Android、iOS 和 macOS,环境由 Mono 实现,这是 .NET 运行时的实现。在 Windows 上,.NET CoreCLR 提供执行环境。
虽然 BCL 使在不同平台上运行的应用能够共享常见的业务逻辑,但各种平台具有为应用定义用户界面的不同方式,并且它们提供了不同的模型,用于指定用户界面元素的通信和互操作方式。可以使用适用于 Android、适用于 iOS 的 .NET for iOS、适用于 macOS 的 .NET 或 WinUI 3) 的相应平台特定框架 (.NET 单独为每个平台创建 UI,但此方法要求你为每个单独的设备系列维护代码库。
.NET MAUI 提供了一个框架,用于为移动和桌面应用构建 UI。下图显示了 .NET MAUI 应用的体系结构的高级视图:
![null 12c35bf896cf00d2dc0007a4ae454e2d.png](https://i-blog.csdnimg.cn/blog_migrate/0dcd51bcaa594714c44c3a6c49fa8dd8.png)
在 .NET MAUI 应用中,编写主要与 .NET MAUI API (1) 交互的代码。然后,.NET MAUI 直接使用本机平台 API (3) 。此外,应用代码还可以根据需要直接切换平台 API (2) 。
.NET MAUI 应用可以在电脑或 Mac 上编写,并编译为本机应用包:
1. 使用 .NET MAUI 编译的 Android 应用从 C# 编译为中间语言 (IL) ,然后在应用启动时 (JIT) 编译为本机程序集。
2. 使用 .NET MAUI 生成的 iOS 应用完全提前 (AOT) 从 C# 编译为本机 ARM 程序集代码。
3. 使用 .NET MAUI 构建的 macOS 应用使用 Mac Catalyst,这是 Apple 提供的一种解决方案,可将使用 UIKit 生成的 iOS 应用引入桌面,并根据需要使用其他 AppKit 和平台 API 进行扩充。
4. 使用 .NET MAUI 生成的 Windows 应用使用 Windows UI 3 (WinUI 3) 库来创建面向 Windows 桌面的本机应用。
所以,实际上windows上编译的应该是 Windows UI3 技术了。UI技术果真复杂。。。
.NET MAUI Windows
这个跟之前的WPF和WinForm完全不一样,双击Debug下的Exe不可以运行(暂时查到这些信息),但是,这个项目是当成了WINUI3项目来实现的,所以,针对于系统来讲就是下边的应用的概念。
默认项目运行就会添加应用到系统,也可以通过项目 右键 部署 实现部署到本机。
![null 9d2793ec131b9d13d6e5efd26dfa0d6a.png](https://i-blog.csdnimg.cn/blog_migrate/84138fc4d6b76494ba4dceddfcf5c0c7.png)
可以在应用里查看应用的信息。
![null 12ef5b7b56491ee5c559fa093969921c.png](https://i-blog.csdnimg.cn/blog_migrate/8ee689c1ee6585ee2674a67049911490.png)
在系统的应用管理里就有它的信息了。
项目分发暂时只能通过发布功能发布成包
创建 .NET MAUI Windows 分发包
第一步,创建
![null 5f4228489900c21740e13656c9acd2a6.png](https://i-blog.csdnimg.cn/blog_migrate/76078ea3a1aa7d4ca5ef4ed9281863ae.png)
![null 0f908be70eea632bd0ec0474324b5a27.png](https://i-blog.csdnimg.cn/blog_migrate/50457bade89eb4ade5ce289666197e07.png)
第二步创建证书
![null 19311c91b5640ce294fd1313b15403aa.png](https://i-blog.csdnimg.cn/blog_migrate/e81d006115e561b2caaad4431024f658.png)
如果公司有直接用,否则,就自己创建一个私人的。
账号密码记住。
第三步创建版本
自己看着填写。
![null 646978f0f1d23bfe35f59b6efc90332e.png](https://i-blog.csdnimg.cn/blog_migrate/8089615beaade493040d739f7e732759.png)
.NET MAUI Windows 分发包安装指南
安装完成后,点击地址
![null d48deed41f9895aa21534e716643e54f.png](https://i-blog.csdnimg.cn/blog_migrate/15f3dd004fc0c2df1f4f9444f97fe5d4.png)
打开文件夹,有以下包文件(主要是 MauiApp1_1.0.3.0_x86_Debug.cer 和 MauiApp1_1.0.3.0_x86_Debug.msix)
![null 3553ec4ac958b694a3125ce3b6c9526a.png](https://i-blog.csdnimg.cn/blog_migrate/a054d8c2c2936598c14a86bcc46df455.png)
复制包到另外一台机器上,如果没有安装 证书,会有以下提示。
![null 16affce397e9bf6a11b697432673336c.png](https://i-blog.csdnimg.cn/blog_migrate/f9ac63cf0436fc2097c00f3c6575cbc9.png)
这个时候,我们双击安装证书 MauiApp1_1.0.3.0_x86_Debug.cer ,选项一定要选对,要不然,提示还会有问题。
![null 4cbceab56681767a5bc5683a3c457928.png](https://i-blog.csdnimg.cn/blog_migrate/a4455f4ed58aa76f0fb41323e5d5d935.png)
证书安装完之后,双击 MauiApp1_1.0.3.0_x86_Debug.msix ,就发现已经可以安装了。
![null b69f72b603b798f0fe05250141df4587.png](https://i-blog.csdnimg.cn/blog_migrate/f7bc1c3eb90a58949d94661523a69f4e.png)
安装完之后,系统已经有了此应用,另外安装还是有点慢,毕竟我这个是官方示例。
![null 98a738e1597cfa1e06855636e9efb72f.png](https://i-blog.csdnimg.cn/blog_migrate/004c36485e5e298e8d02d64befb48aa6.png)
.NET MAUI Android
我这边是手机直连调试(关于手机-版本号 点击6下-开发者模式-打开USB调试-连接USB到电脑即可),当然,也可以用它的虚拟机,都是通过Android ADB 通信方式来实现的。
直接选择,真机调试
![null 74e3706b49183e156af3522481c00bd2.png](https://i-blog.csdnimg.cn/blog_migrate/9f4c564672c4dd195969b7956402b1be.png)
这个时候,手机就展现了当前的应用,手机桌面也会安装此APP。
![null 287baccf6a0524a48d93296d0b2a03e7.jpeg](https://i-blog.csdnimg.cn/blog_migrate/d63f40bc47aff642a500c9e2fea9ac92.jpeg)
在Debug目录是能看到此 安装包的(com.companyname.mauiapp1.apk)
![null 125ac7b27df8c84863ea808b1abc6903.png](https://i-blog.csdnimg.cn/blog_migrate/1a18671d59fb98503e0dd89ee798fc44.png)
总结
MAUI不论咋说都是微软官方出品,还是值得深入研究一下的,另外现在基本都是跨平台的节奏,还是要紧跟一下时代。
整体流畅度我个人感觉比 Flutter 好点,可能是因为,微软的缘故吧,安装很方便,不用考虑太多。
参考文档
https://docs.microsoft.com/zh-cn/dotnet/maui/
阅
一键三连呦!,感谢大佬的支持,您的支持就是我的动力!
版权
蓝创精英团队(公众号同名,CSDN 同名,CNBlogs 同名)