.NET MAUI 基础知识

文章目录

    • 什么是 .NET MAUI?
      • MAUI的核心特点
      • 与Xamarin.Forms的区别
    • 开发环境搭建
      • 安装Visual Studio 2022
      • 安装必要组件
      • 配置Android开发环境
      • 配置iOS开发环境
      • 验证安装
    • 创建第一个MAUI应用
      • 创建新项目
      • MAUI项目结构解析
      • 理解关键文件
      • 运行应用程序
      • 简单修改示例
      • 使用热重载
    • MAUI应用生命周期
      • 应用程序生命周期
      • 页面生命周期
    • 常见控件和布局
      • 常用控件
      • 布局容器
      • 布局示例
    • 小结与后续学习路径
    • 学习资源

什么是 .NET MAUI?

.NET Multi-platform App UI (.NET MAUI) 是微软推出的新一代跨平台UI框架,是Xamarin.Forms的继任者。它允许开发者使用单一的代码库和项目结构,创建可在Android、iOS、macOS和Windows上运行的本地应用程序。.NET MAUI采用C#和XAML作为开发语言,为开发者提供了统一的编程模型和API,简化了跨平台应用开发流程。

MAUI的核心特点

.NET MAUI
单一项目结构
统一控件
平台特定API集成
现代化架构
原生性能
  1. 单一项目结构:不同于Xamarin.Forms的多项目解决方案,MAUI采用单一项目结构,简化了开发和维护过程。
  2. 统一控件:提供一套统一的控件库,这些控件在不同平台上保持一致的行为和外观。
  3. 平台特定API集成:允许直接从共享代码中访问平台特定API,无需编写自定义渲染器。
  4. 现代化架构:基于.NET 6及更高版本构建,支持最新的C#特性。
  5. 原生性能:应用程序编译为平台原生代码,提供接近原生的性能体验。

在这里插入图片描述

上图出自微软官方学习路线

与Xamarin.Forms的区别

演变
XamarinForms
+多项目结构
+旧版渲染系统
+传统依赖注入
+平台特定代码分离
MAUI
+单一项目结构
+处理程序架构
+现代依赖注入
+直接平台集成

主要改进点包括:

  1. 项目结构:从多项目结构简化为单一项目结构
  2. 渲染系统:从渲染器架构升级为更灵活的处理程序架构
  3. 构建系统:整合到.NET统一构建系统中
  4. 依赖注入:内置现代依赖注入框架
  5. 生命周期管理:改进的应用和页面生命周期管理
  6. 热重载:增强的XAML热重载支持

开发环境搭建

要开始.NET MAUI开发,需要设置适当的开发环境。以下是详细的步骤:

安装Visual Studio 2022

Visual Studio 2022是开发MAUI应用的首选IDE,它提供了完整的工具集和集成支持。

  1. 下载并安装Visual Studio 2022(推荐使用Community或更高版本)

安装Visual Studio 2022可以参考博文对于C#初学者在学习前的准备

  1. 在安装过程中,选择".NET Multi-platform App UI开发"工作负载
下载Visual Studio 2022
运行安装程序
选择工作负载
勾选.NET Multi-platform App UI开发
安装完成

安装必要组件

在Visual Studio安装程序中,确保以下组件被选中:

  1. .NET MAUI(必选)
  2. Android SDK设置(适用于Android开发)
  3. iOS和MacOS开发工具(适用于iOS/MacOS开发)
  4. 通用Windows平台开发(适用于Windows开发)

配置Android开发环境

要开发Android应用,需要完成以下设置:

  1. 安装Android SDK:默认情况下,Visual Studio会安装必要的Android SDK
  2. 配置Android模拟器
    • 打开Visual Studio中的"Android设备管理器"
    • 创建新的设备映像(推荐API 30或更高版本)
    • 配置模拟器性能选项
      在这里插入图片描述
      打开样式如下
      在这里插入图片描述

当我们存在项目时调试时就可以直接运行
在这里插入图片描述

无法创建模拟器时参考如何使用Android模拟器(Hyper-V和AEHD)启用硬件加速
如果模拟器无法使用可以尝试使用真机调试(在手机中打开开发者模式)

  1. 配置真机调试(可选):
    • 在Android设备上启用"开发者选项"和"USB调试"
    • 安装适当的USB驱动程序
    • 通过USB连接设备并允许调试

调试时可以打开xaml实时预览窗口进行查看
在这里插入图片描述

配置iOS开发环境

iOS开发需要一台Mac计算机和以下组件:

  1. 安装最新版Xcode:从Mac App Store下载并安装
  2. 设置远程配对
    • 在Mac上安装Apple的远程工具
    • 在Visual Studio中配置Mac连接

如果您使用Mac开发,则可以直接在Mac上安装Visual Studio for Mac并进行MAUI开发。

验证安装

完成安装后,可以通过以下步骤验证环境:

// 在命令行运行以下命令以检查.NET MAUI工作负载是否正确安装
dotnet workload list
// 应该能看到maui工作负载已安装的信息

在这里插入图片描述

创建第一个MAUI应用

让我们创建一个简单的Hello World应用来理解MAUI项目结构和基本概念。

创建新项目

  1. 打开Visual Studio 2022
  2. 选择"创建新项目"
  3. 在搜索框中输入"MAUI"
  4. 选择".NET MAUI应用"模板
  5. 点击"下一步"
  6. 输入项目名称(例如"MauiHelloWorld")

注意创建MAUI项目目录时不要包含中文

  1. 选择保存位置
  2. 点击"创建"

MAUI项目结构解析

创建的MAUI项目有以下主要文件和文件夹:
在这里插入图片描述

MauiHelloWorld/
│
├── Platforms/            # 平台特定代码
│   ├── Android/         # Android特定代码
│   ├── iOS/             # iOS特定代码
│   ├── MacCatalyst/     # MacOS特定代码
│   └── Windows/         # Windows特定代码
│
├── Resources/            # 应用资源
│   ├── AppIcon/         # 应用图标
│   ├── Fonts/           # 字体文件
│   ├── Images/          # 图像资源
│   ├── Raw/             # 其他资源
│   └── Styles/          # 样式定义
│
├── App.xaml              # 应用定义文件
├── App.xaml.cs           # 应用代码
├── AppShell.xaml         # Shell UI定义
├── AppShell.xaml.cs      # Shell UI代码
├── MainPage.xaml         # 主页面UI定义
├── MainPage.xaml.cs      # 主页面代码
└── MauiProgram.cs        # 应用配置和启动

理解关键文件

  1. MauiProgram.cs:应用程序的入口点,配置服务和应用生命周期
public static class MauiProgram
{public static MauiApp CreateMauiApp(){// 创建MauiApp构建器var builder = MauiApp.CreateBuilder();// 配置应用程序builder.UseMauiApp<App>() // 使用App类作为主应用程序类.ConfigureFonts(fonts =>{// 配置应用程序字体fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");});// 在这里注册服务(依赖注入)// builder.Services.AddSingleton<IMyService, MyService>();// 构建并返回MauiApp实例return builder.Build();}
}
  1. App.xaml/App.xaml.cs:定义应用程序资源和应用程序级行为
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"xmlns:local="clr-namespace:MauiHelloWorld"x:Class="MauiHelloWorld.App"><Application.Resources><ResourceDictionary><!-- 应用级资源和样式 --><ResourceDictionary.MergedDictionaries><ResourceDictionary Source="Resources/Styles/Colors.xaml" /><ResourceDictionary Source="Resources/Styles/Styles.xaml" /></ResourceDictionary.MergedDictionaries></ResourceDictionary></Application.Resources>
</Application>
public partial class App : Application
{public App(){InitializeComponent();// 设置应用程序的主页面MainPage = new AppShell();}// 应用程序生命周期方法protected override void OnStart(){// 当应用启动时调用base.OnStart();}protected override void OnSleep(){// 当应用进入后台时调用base.OnSleep();}protected override void OnResume(){// 当应用从后台恢复时调用base.OnResume();}
}
  1. AppShell.xaml/AppShell.xaml.cs:定义应用程序的Shell架构(导航结构)
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"xmlns:local="clr-namespace:MauiHelloWorld"x:Class="MauiHelloWorld.AppShell"Title="MauiHelloWorld"><!-- 定义应用程序的Shell结构,这里是一个简单的单页面应用 --><ShellContent Title="Home"ContentTemplate="{DataTemplate local:MainPage}"Route="MainPage" />
</Shell>
  1. MainPage.xaml/MainPage.xaml.cs:应用程序的主页面
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"x:Class="MauiHelloWorld.MainPage"><ScrollView><VerticalStackLayout Spacing="25" Padding="30"><Image Source="dotnet_bot.png"HeightRequest="185"SemanticProperties.Description="The .NET Bot mascot" /><Label Text="Hello, World!"FontSize="32"HorizontalOptions="Center" /><Label Text="Welcome to .NET MAUI!"FontSize="18"HorizontalOptions="Center" /><Button x:Name="CounterButton"Text="Click me"Clicked="OnCounterClicked"HorizontalOptions="Center" /></VerticalStackLayout></ScrollView>
</ContentPage>
public partial class MainPage : ContentPage
{// 计数器变量private int _count = 0;public MainPage(){InitializeComponent();}// 按钮点击事件处理方法private void OnCounterClicked(object sender, EventArgs e){// 增加计数器值_count++;// 根据计数值更新按钮文本if (_count == 1)CounterButton.Text = $"Clicked {_count} time";elseCounterButton.Text = $"Clicked {_count} times";// 屏幕阅读器宣布文本变化(辅助功能支持)SemanticScreenReader.Announce(CounterButton.Text);}
}

运行应用程序

创建项目后,可以选择目标平台并运行应用程序:

  1. 在Visual Studio顶部工具栏中,从调试目标下拉列表选择平台:

    • Windows Machine(Windows)
    • Android Emulator(Android)
    • Local Device(iOS,需要Mac连接)
  2. 点击绿色的"运行"按钮或按F5启动应用程序

  3. 应用程序将在所选平台上编译和运行

简单修改示例

让我们对默认应用程序做一些简单的修改,以了解MAUI开发流程:

  1. 添加自定义UI元素
<!-- 在VerticalStackLayout中添加一个滑块控件 -->
<Slider x:Name="OpacitySlider" Minimum="0" Maximum="1" Value="1"ValueChanged="OnOpacityChanged"Margin="0,20,0,0" /><Label Text="调整透明度"HorizontalOptions="Center" />
  1. 添加相应的代码逻辑
// 在MainPage.xaml.cs中添加滑块值变化处理方法
private void OnOpacityChanged(object sender, ValueChangedEventArgs e)
{// 获取滑块当前值(0到1之间)double newValue = e.NewValue;// 将滑块值应用到图像的透明度if (sender is Slider slider){// 查找Image控件并设置其Opacity属性var image = this.FindByName<Image>("dotnet_bot");if (image != null){image.Opacity = newValue;}}
}

使用热重载

.NET MAUI支持热重载功能,允许在应用运行时实时查看XAML更改:

  1. 运行应用程序
  2. 在XAML文件中修改UI(例如更改文本、颜色或布局)
  3. 保存文件,更改将立即反映在运行的应用程序中

MAUI应用生命周期

了解MAUI应用的生命周期对于正确管理资源和用户体验至关重要。

应用程序生命周期

MAUI应用生命周期由以下关键事件定义:

操作系统 MAUI应用 启动应用(OnCreate) 初始化(Constructor) 应用可见(OnStart) 应用在前台运行 进入后台(OnSleep) 应用在后台 返回前台(OnResume) 应用在前台运行 终止应用 操作系统 MAUI应用
  1. OnCreate/构造函数:应用程序初始化时调用
  2. OnStart:应用程序变为活动状态时调用
  3. OnSleep:应用程序进入后台时调用
  4. OnResume:应用程序从后台恢复时调用

页面生命周期

每个页面也有自己的生命周期事件:

  1. OnAppearing:页面即将显示时调用
  2. OnDisappearing:页面即将隐藏时调用
public partial class MyPage : ContentPage
{public MyPage(){InitializeComponent();}// 页面即将显示时调用protected override void OnAppearing(){base.OnAppearing();Console.WriteLine("页面正在显示");// 可以在此处加载数据或初始化UILoadData();}// 页面即将隐藏时调用protected override void OnDisappearing(){base.OnDisappearing();Console.WriteLine("页面正在隐藏");// 可以在此处保存数据或清理资源SaveData();}private void LoadData(){// 加载数据的逻辑}private void SaveData(){// 保存数据的逻辑}
}

常见控件和布局

MAUI提供了丰富的控件和布局系统,以下是一些常用的UI元素:

常用控件

基础控件
Label
Button
Entry
Editor
Image
Switch
Slider
...
列表控件
ListView
CollectionView
CarouselView
...
表单控件
Picker
DatePicker
TimePicker
SearchBar
...
指示器控件
ActivityIndicator
ProgressBar
..

布局容器

MAUI提供了多种布局容器,用于组织UI元素:

  1. StackLayout:垂直或水平排列元素
  2. Grid:在行和列中排列元素
  3. FlexLayout:灵活排列元素,类似CSS Flexbox
  4. AbsoluteLayout:使用绝对坐标定位元素
  5. RelativeLayout:相对于其他元素或父容器定位元素

布局示例

以下是使用Grid布局的示例:

<Grid RowDefinitions="Auto,*,Auto"ColumnDefinitions="*,*"><!-- 占据第一行,跨越两列 --><Label Text="标题文本" Grid.Row="0" Grid.ColumnSpan="2"HorizontalOptions="Center"FontSize="24"Margin="0,20,0,0" /><!-- 第二行第一列 --><Image Source="image1.png"Grid.Row="1"Grid.Column="0"Aspect="AspectFit"Margin="20" /><!-- 第二行第二列 --><Image Source="image2.png"Grid.Row="1"Grid.Column="1"Aspect="AspectFit"Margin="20" /><!-- 第三行,跨越两列 --><Button Text="确认"Grid.Row="2"Grid.ColumnSpan="2"Margin="20"HorizontalOptions="Center" />
</Grid>

小结与后续学习路径

本文介绍了.NET MAUI的基础知识,包括:

  • MAUI的定义与特点
  • 与Xamarin.Forms的区别与改进
  • 开发环境搭建
  • 创建和运行第一个MAUI应用
  • 项目结构和关键文件
  • 应用和页面生命周期
  • 常见控件和布局

这些知识为开始MAUI开发提供了坚实的基础。要成为熟练的MAUI开发者,还需要:

  1. 深入XAML:掌握XAML语法、样式和资源系统
  2. 数据绑定与MVVM:学习数据绑定和MVVM架构模式
  3. 导航与Shell:掌握页面导航和Shell框架
  4. 本地数据存储:学习使用SQLite等技术存储数据
  5. Web服务集成:掌握HTTP请求和REST API调用
  6. 平台特定功能:学习如何访问设备功能和平台特定API

学习资源

以下是一些有用的.NET MAUI学习资源:

  1. .NET MAUI官方文档
  2. Microsoft Learn MAUI课程
  3. .NET MAUI GitHub仓库
  4. MAUI社区工具包
  5. MAUI示例应用

通过这些资源和实践,您将能够掌握.NET MAUI并创建出色的跨平台应用程序。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/81006.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

卷积神经网络全连接层详解:特征汇总、FCN替代与性能影响分析

【内容摘要】 本文聚焦卷积神经网络&#xff08;CNN&#xff09;的全连接层&#xff0c;详细介绍其将二维特征图转化为一维向量的过程&#xff0c;阐述全卷积网络&#xff08;FCN&#xff09;如何通过转置卷积替代全连接层以实现像素级分类&#xff0c;并分析全连接层对图像分类…

在C++中进行套接字编程时,主要使用以下头文件

目录 一.基本套接字头文件<sys/socket.h><netinet/in.h><arpa/inet.h><unistd.h><netdb.h> 二. 完整示例头文件包含三. 注意事项 在C中进行套接字编程时&#xff0c;主要使用以下头文件&#xff1a; 一.基本套接字头文件 <sys/socket.h>…

【Linux网络】HTTP

应用层协议 HTTP 前置知识 我们上网的所有行为都是在做IO&#xff0c;&#xff08;我的数据给别人&#xff0c;别人的数据给我&#xff09;图片。视频&#xff0c;音频&#xff0c;文本等等&#xff0c;都是资源答复前需要先确认我要的资源在哪台服务器上&#xff08;网络IP&…

JAVA异常体系

在 Java 里&#xff0c;异常体系是其错误处理机制的核心内容&#xff0c;它能够帮助开发者有效应对程序运行时出现的各种意外状况。 异常体系的基本架构 它主要包含两个重要分支&#xff1a; Error&#xff08;错误&#xff09;&#xff1a;这类异常是程序自身无法处理的严重…

vue 去掉右边table的下拉条与下面的白色边框并补充满

::v-deep table {width: 100% !important; } ::v-deep .el-table::after, .el-table::before {display: none !important; }/* 隐藏滚动条但保留滚动功能 */ ::v-deep .el-table__body-wrapper::-webkit-scrollbar {width: 0 !important;height: 0 !important; }::v-deep .el-t…

uniapp+vue3+uview来开发我们的项目

前言&#xff1a; 就像我们vue的web的框架element、iview等一样&#xff0c;我们的uni-app开发也有适合的他的框架&#xff0c;除了他本身的扩展组件以外&#xff0c;第三方好用的就是就是uview了。 实现效果&#xff1a; 官网信息&#xff1a; vue2版本&#xff1a;uview-ui …

数据仓库:企业数据管理的核心引擎

一、数据仓库的由来 数据仓库&#xff08;Data Warehouse, DW&#xff09;概念的诞生源于企业对数据价值的深度挖掘需求。在1980年代&#xff0c;随着OLTP&#xff08;联机事务处理&#xff09;系统在企业中的普及&#xff0c;传统关系型数据库在处理海量数据分析时显露出明显瓶…

YOLOv12模型部署(保姆级)

一、下载YOLOv12源码 1.通过网盘分享的文件&#xff1a;YOLOv12 链接: https://pan.baidu.com/s/12-DEbWx1Gu7dC-ehIIaKtQ 提取码: sgqy &#xff08;网盘下载&#xff09; 2.进入github克隆YOLOv12源码包 二、安装Anaconda/pycharm 点击获取官网链接(anaconda) 点击获取…

一篇解决Redis:持久化机制

目录 认识持久化 持久化方案 RDB&#xff08;Redis DataBase&#xff09; 手动触发 自动触发 小结 AOF(Append-Only File) AOF缓冲区刷新机制 AOF重写机制 AOF重写流程 ​编辑 混合持久化 认识持久化 我们都知道Mysql有四大特征&#xff0c;原子性&#xff0c;持久…

从 Vue3 回望 Vue2:事件总线的前世今生

从 Vue3 回望 Vue2&#xff1a;事件总线的前世今生 以 Vue3 开发者视角回顾 Vue2 中事件总线机制 的文章。文章将围绕事件总线的缘起、用法、局限与演进展开&#xff0c;帮助 Vue3 开发者理解 Vue2 通信方式的历史意义及现代替代方案。 一、前言&#xff1a;Vue3 时代&#xff…

CSS结构性伪类、UI伪类与动态伪类全解析:从文档结构到交互状态的精准选择

一、结构性伪类选择器&#xff1a;文档树中的位置导航器 结构性伪类选择器是CSS中基于元素在HTML文档树中的层级关系、位置索引或结构特征进行匹配的一类选择器。它们无需依赖具体的类名或ID&#xff0c;仅通过文档结构即可精准定位元素&#xff0c;是实现响应式布局和复杂文档…

【SSL证书系列】SSL证书工作原理解读

SSL&#xff08;Secure Sockets Layer&#xff09;及其继任者TLS&#xff08;Transport Layer Security&#xff09;是用于保护网络通信安全的加密协议。SSL证书是实现HTTPS协议的核心&#xff0c;其工作原理涉及加密技术、身份验证和信任机制。以下是其工作原理的详细分步解析…

第二十四天打卡

import os os.getcwd() os.listdir() path_a r"C:\Users\renshuaicheng\Documents" path_b "MyProjectData" file "results.csv" file_path os.path.join(path_a,path_b,file) file_path import osstart_directory os.getcwd() # 假设这个目…

【CUDA】Sgemm单精度矩阵乘法(下)

目录 前言1. 优化技巧5&#xff1a;使用register模拟二级缓存&#xff08;内积转外积&#xff09;2. 优化技巧6&#xff1a;使用register模拟二级缓存 float43. 优化技巧7&#xff1a;global memory转置再存放shared memory4. 优化技巧8&#xff1a;使用double buffer加速矩阵…

【1000以内具有12个以上因子的整数并输出它的因子】2021-12-27

缘由c语言输入1000以内具有12个以上因子的整数 并输出它的因子-编程语言-CSDN问答 int 求因子个数(int 数, int* 因子 { 0 }) {//缘由https://bbs.csdn.net/topics/399168406int 和 0, 求 1, 商 0, 含 0;//因子不含1和数本身while (求 < (商 数 / 求))if (!(数 % 求)…

C#中的dynamic与var:看似相似却迥然不同

在C#编程的世界里&#xff0c;var和dynamic这两个关键字常常让初学者感到困惑。它们看起来都在定义变量时省略了显式类型声明&#xff0c;但实际上它们的工作方式和应用场景有着天壤之别。今天&#xff0c;让我们一起揭开这两个关键字的神秘面纱。 var&#xff1a;编译时的类型…

流速仪数据处理及流量断面线绘制

1 需求描述 在实际航道测量项目中&#xff0c;有测量断面线流量流速的需求&#xff0c;得使用流速仪在现场进行测量&#xff0c;相关操作在之前已经写了记录。本次手册记录后期数据处理与流量线绘制&#xff0c;以该区域为例。 流速仪设备操作说明 2 规范要求 3 流量断面表格…

购物车构件示例

通用购物车构件设计 注:代码仅用于演示原理,不可用于生产环境。 一、设计目标 设计一个高度可复用的购物车构件,具备以下特点: 与具体业务系统解耦支持多种应用场景(商城、积分系统等)提供标准化接口易于集成和扩展二、核心架构设计 1. 分层架构 ┌─────────…

数据结构·字典树

字典树trie 顾名思义&#xff0c;在一个字符串的集合里查询某个字符串是否存在树形结构。 树存储方式上用的是结构体数组&#xff0c;类似满二叉树的形式。 模板 定义结构体和trie 结构体必须的内容&#xff1a;当前结点的字符&#xff0c;孩子数组可选&#xff1a;end用于查…

ES面试题系列「一」

1、Elasticsearch 是什么&#xff1f;它与传统数据库有什么区别&#xff1f; 答案&#xff1a;Elasticsearch 是一个基于 Lucene 的分布式、开源的搜索和分析引擎&#xff0c;主要用于处理大量的文本数据&#xff0c;提供快速的搜索和分析功能。与传统数据库相比&#xff0c;E…