.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

也就前周,.Net MAUI正式版出来了 ,一个支持跨平台的UI框架,Linux支持情况官网也没说,按理来说应该也是支持的,刚好,我最近也在研究GUI的基本原理,微软出品还是值得深入研究一下的,就先来个样例,瞅瞅。.

MAUI 安装

首先得是 Visual Studio 2022,然后,版本更新到最新,版本为 17.3.0

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

打开 Visual Studio Installer 进行安装版本,即可,建议直接安装最新,省事儿。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

安装的时候,一定要选择MAUI工作负荷,要不然,升级了最新版本,可能还没有这个模板。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

MAUI 新建项目

其实新建的时候,有三个可选,但是,实际上有两个项目,一个是.Net MAUI Blazor应用,一个是.NET MAUI 应用。

从这个趋势上来看,Blazor应用,微软还是很看好的。

新建一个 .NET MAUI应用。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

默认项目,打开跟WPF 很像,文件后缀也是Xaml

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

但是在这个平台部分,支持了多个平台基本,安卓,苹果微软的都支持了。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

那么,就达到了下图的目的了,真正实现了跨平台的UI。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

MAUI 框架简单分析

有一个神奇的发现啊,首先 Visual Studio 2022 的IDE的窗体竟然是WPF写的,这个666。可见微软对自己家产品的支持力度。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

另外,MAUI 项目运行后,打开是这个样子,还可以点击一下,算是官方提供的最简单的案例了。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

经过分析,它是基于WIN32的,也验证了我的猜想,要想设计一个GUI,必须得从系统的本地UI入手,才是最合适的。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

所以,它是基于windwos系统本地的窗口的API,经过自己的GUI技术进行渲染的。

从官方源码里看到

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

也是支持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 应用的体系结构的高级视图:

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

在 .NET MAUI 应用中,编写主要与 .NET MAUI API (1) 交互的代码。然后,.NET MAUI 直接使用本机平台 API (3) 。此外,应用代码还可以根据需要直接切换平台 API (2) 。

.NET MAUI 应用可以在电脑或 Mac 上编写,并编译为本机应用包:

  1. 1. 使用 .NET MAUI 编译的 Android 应用从 C# 编译为中间语言 (IL) ,然后在应用启动时 (JIT) 编译为本机程序集。

  2. 2. 使用 .NET MAUI 生成的 iOS 应用完全提前 (AOT) 从 C# 编译为本机 ARM 程序集代码。

  3. 3. 使用 .NET MAUI 构建的 macOS 应用使用 Mac Catalyst,这是 Apple 提供的一种解决方案,可将使用 UIKit 生成的 iOS 应用引入桌面,并根据需要使用其他 AppKit 和平台 API 进行扩充。

  4. 4. 使用 .NET MAUI 生成的 Windows 应用使用 Windows UI 3 (WinUI 3) 库来创建面向 Windows 桌面的本机应用。

所以,实际上windows上编译的应该是 Windows UI3 技术了。UI技术果真复杂。。。

.NET MAUI Windows

这个跟之前的WPF和WinForm完全不一样,双击Debug下的Exe不可以运行(暂时查到这些信息),但是,这个项目是当成了WINUI3项目来实现的,所以,针对于系统来讲就是下边的应用的概念。

默认项目运行就会添加应用到系统,也可以通过项目 右键 部署 实现部署到本机。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

可以在应用里查看应用的信息。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

在系统的应用管理里就有它的信息了。

项目分发暂时只能通过发布功能发布成包

创建 .NET MAUI Windows 分发包

第一步,创建

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例
.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

第二步创建证书

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

如果公司有直接用,否则,就自己创建一个私人的。

账号密码记住。

第三步创建版本

自己看着填写。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

.NET MAUI Windows 分发包安装指南

安装完成后,点击地址

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

打开文件夹,有以下包文件(主要是 MauiApp1_1.0.3.0_x86_Debug.cer 和 MauiApp1_1.0.3.0_x86_Debug.msix)

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

复制包到另外一台机器上,如果没有安装 证书,会有以下提示。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

这个时候,我们双击安装证书 MauiApp1_1.0.3.0_x86_Debug.cer ,选项一定要选对,要不然,提示还会有问题。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

证书安装完之后,双击 MauiApp1_1.0.3.0_x86_Debug.msix ,就发现已经可以安装了。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

安装完之后,系统已经有了此应用,另外安装还是有点慢,毕竟我这个是官方示例。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

.NET MAUI Android

我这边是手机直连调试(关于手机-版本号 点击6下-开发者模式-打开USB调试-连接USB到电脑即可),当然,也可以用它的虚拟机,都是通过Android ADB 通信方式来实现的。

直接选择,真机调试

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

这个时候,手机就展现了当前的应用,手机桌面也会安装此APP。

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

在Debug目录是能看到此 安装包的(com.companyname.mauiapp1.apk)

.NET MAUI 跨平台应用程序(Windows App 和 Android)示例

总结

MAUI不论咋说都是微软官方出品,还是值得深入研究一下的,另外现在基本都是跨平台的节奏,还是要紧跟一下时代。

整体流畅度我个人感觉比 Flutter 好点,可能是因为,微软的缘故吧,安装很方便,不用考虑太多。

参考文档

https://docs.microsoft.com/zh-cn/dotnet/maui/