MAUI基本项目认识

2022-08-25 10:44 Thursday16974min
CC BY 4.0(除特别声明和转载)

项目经典架构

MVVM架构在移动客户端的设计中大行其道,MAUI也以此为经典架构。
项目文件为后缀为csproj。在VS的解决方案视图下显示为一个可扩展层级,其下包含子文件夹,在架构层面有

  1. Models,数据模型,抽象实体
  2. Views,视图,UI,进行数据绑定,代码隐藏中完成UI逻辑
  3. ViewModels,视图模型,承担Models与Views中数据的双向流动:向Views提供Models中的数据记录,向Models提供Views对数据的修改。
  4. Services ,外部服务如网络、数据库等,可使用依赖注入以使用

为实现跨平台而采取的资源管理办法

MAUI使资源文件可以存储在统一位置上,让不同系统平台使用。包括字体、图像、应用程序图标、启动动画和 Raw assets。

[!attention] 重点
每个图像资源文件都用作源图像,在创建时为每个平台生成所需要图像的分辨率。

资源文件应放置在应用项目的 Resources 文件夹或 Resources 文件夹的子文件夹中,并且必须正确设置其 Build Action。下表显示了每种资源文件类型的 Build Action:

资源类型Build Action 设置
App iconMauiIcon
FontsMauiFont
ImagesMauiImage
Splash screenMauiSplashScreen
Raw assetsMauiAsset

将资源文件添加到 .NET MAUI 应用项目时,会在项目文件中创建资源的相应条目。
可以通过编辑应用程序的项目文件(.csproj)来为每种资源类型指定:

<ItemGroup>
    <!-- Images -->
    <MauiImage Include="Resources\Images\*" />

    <!-- Fonts -->
    <MauiFont Include="Resources\Fonts\*" />

    <!-- Raw Assets (also remove the "Resources\Raw" prefix) -->
    <MauiAsset Include="Resources\Raw\**" LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />
    
    <!--examples-->
    <MauiIcon Include="Resources\Images\appicon.png" />
    <MauiImage Include="Resources\Images\logo.jpg" />
    <MauiFont Include="Resources\Fonts\OpenSans-Regular.ttf" />
    <MauiSplashScreen Include="Resources\Images\splashscreen.svg" />
    <MauiAsset Include="Resources\Assets\index.html" />
    <WebView Source="index.html" />
</ItemGroup>

通配符 (*) 表示文件夹中的所有文件都将被视为指定资源类型。 此外,还可以包含子文件夹中的所有文件:

<ItemGroup>
    <!-- Images -->
    <MauiImage Include="Resources\Images\**\*" />
</ItemGroup>

在此示例中,双通配符 (**) 指定 Images 文件夹可以包含子文件夹。 因此,<MauiImage Include="Resources\Images\**\*" /> 指定 Resources\Images 文件夹中的任何文件或 Images 文件夹的任何子文件夹将用作源图像, 为每个平台生成所需的分辨率。

特定于平台的资源将覆盖其共享资源对应项。 例如,如果您有一个位于Platforms\Android\Resources\drawable-xhdpi\logo.png的 Android 特定图像,并且您还提供了一个共享的 Resources\Images\logo.svg 图像,则 SVG 文件将用于生成所需的 Android 图像,但 XHDPI 图像已作为特定于平台的图像存在。

应用程序启动

启动引导

NET MAUI 应用程序使用 .NET 通用主机模型进行引导。 这使应用程序能够从单个位置初始化,并提供配置字体、服务和第三方库的能力。

每个平台入口点调用静态MauiProgram类的CreateMauiApp方法,该方法创建并返回一个“MauiApp”,即应用程序的入口点。

MauiProgram 类必须至少提供一个应用程序才能运行:

namespace MyMauiApp;

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>();

        return builder.Build();
    }
}

App类派生自 Application类:

namespace MyMauiApp;

public class App : Application
{
    public App()
    {
        InitializeComponent();

        MainPage = new AppShell();
    }
}

注册字体

字体可以添加到您的应用程序并通过文件名或别名引用。 这是通过在 MauiAppBuilder对象上调用 ConfigureFonts方法来完成的。 然后,在 IFontCollection 对象上,调用 AddFont方法来添加所需的字体:

namespace MyMauiApp;

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
            });

        return builder.Build();
    }
}

在上面的例子中,AddFont方法的第一个参数是字体文件名,而第二个参数代表一个可选的别名,在使用字体时可以通过该别名引用它。

应用使用的任何自定义字体都必须包含在您的 .csproj 文件中。 这可以通过引用它们的文件名或使用通配符来完成:

<ItemGroup>
   <MauiFont Include="Resources\Fonts\*" />
</ItemGroup>

[!attention] 注意
通过 Visual Studio 中的解决方案资源管理器(Solution Explorer)添加到项目的字体将自动包含在 .csproj 文件中。

然后可以通过引用其名称来使用该字体,而无需文件扩展名:

<!-- Use font name -->

<Label Text="Hello .NET MAUI"  
       FontFamily="OpenSans-Regular" />

或者,可以通过引用其别名来使用它:

<!-- Use font alias -->
<Label Text="Hello .NET MAUI"
       FontFamily="OpenSansRegular" />

包管理工具

MAUI使用NuGet。NuGet 是免费、开源的包管理开发工具,专注于在 .NET 应用开发过程中,简单地合并第三方的组件库。

当需要分享开发的工具或是库,需要建立一个Nuget package,然后把这个package放到Nuget的站点。如果想要使用别人已经开发好的工具或是库,只需要从站点获得这个package,并且安装到自己的Visual Studio项目或是解决方案里。

NuGet能更方便地把一些dll和文件(如jquery)添加到项目中,而不需要从文件中复制拷贝。
右键单击Solution 并选择 Restore NuGet packages可以还原项目中原有的包。

BuyMeACola