Exibir origem

Visão Geral

O Xamarin.Forms geralmente é usado para desenvolver aplicativos multiplataforma nativos. Basicamente, o Xamarin.Forms é uma camada de abstração que permite a interação do código compartilhado com o código da plataforma subjacente do Android, iOS e Windows.

Usando o Xamarin.Forms, um desenvolvedor de aplicativo móvel multiplataforma pode economizar tempo de desenvolvimento escrevendo toda a lógica de negócios em um único idioma. Quase 90% do código necessário para desenvolver um aplicativo é compartilhado entre plataformas, permitindo que você obtenha desempenho nativo e a mesma aparência em cada uma delas.

Como você sabe, a interface do usuário do aplicativo multiplataforma .NET é popularmente conhecida como .NET MAUI. Ele é usado para criar aplicativos multiplataforma nativos com .NET para Android, iOS, macOS e Windows. O .NET MAUI é construído sobre o Xamarin.Forms, evoluindo a plataforma para o próximo nível.

Com o .NET MAUI, a Microsoft inicia uma jornada para criar uma plataforma .NET unificada como uma única classe base para .NET Core e Mono/Xamarin juntos.

Como o .NET MAUI é uma evolução do Xamarin.Forms, eles têm a maioria de seus recursos em comum. É possível obter quase tudo que o Xamarin possui no .NET MAUI, como controles, layouts, Shell, gestures, templates e APIs multiplataforma para recursos de dispositivo.

Não é necessário reescrever os aplicativos Xamarin.Forms para migra-los para o .NET MAUI. No entanto, será preciso fazer algumas alterações de código em cada aplicativo. Da mesma forma, é possível utilizar os recursos de projeto único sem mesclar todos os projetos do Xamarin.Forms em um projeto. Para iniciar a migração, siga os seguintes passos:

Passo 1
Passo 2
Passo 3
Passo 4

Migrando XAML e Códigos Existentes

O primeiro passo é trazer o XAML e o código-fonte do aplicativo existente no Xamarin.Forms. Abaixo está uma lista de todos os arquivos e pastas que foram migrados.

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-20_15-39-54.png

Seria uma boa ideia adicionar o projeto MAUI a um provedor de controle de versão e verificar regularmente as alterações ao longo da migração.

Isso facilitará a reversão para alterações anteriores ou a execução de algumas tentativas e erros.

Usando o explorador de arquivos, arraste e solte o conteúdo necessário do projeto existente para a pasta raiz do seu novo projeto MAUI. O conteúdo ficará semelhante à figura abaixo.

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-20_15-41-11.png

Etapas Principais de Migração de Código do Xamarin.Forms

Substitua as seguintes informações do Xamarin.Forms pelo equivalente Microsoft MAUI:

Valor Antigo	Valor Novo
xmlns="http://xamarin.com/schemas/2014/forms"	xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
using Xamarin.Forms	using Microsoft.Maui / using Microsoft.Maui.Controls
using Xamarin.Forms.Xaml	using Microsoft.Maui.Controls.Xaml
Rg.Plugins.Popup	Mopups
Plugin.*	Microsoft.Maui.Devices.*
Xamarin.Forms.Device.RuntimePlatform	Microsoft.Maui.Devices.DeviceInfo.Platform
Xamarin.Forms.Device.Platform	Microsoft.Maui.Devices.DevicePlatform
CarouselView.FormsPlugin.Abstractions	Microsoft.Maui.Controls.CarouselView
MasterDetailPage	FlayoutPage
Device.BeginInvokeOnMainThread()	Dispatcher.Dispatch()
Xamarin.Forms.Color	Microsoft.Maui.Graphics.Colors
new Rectangle	new Rect
Grid.Children.Add(view, 0, 0)	Grid.SetRow((IView)view, 0) Grid.SetColumn((IView)view, 0)

Exclua ou comente o conteúdo do arquivo AssemblyInfo.cs. As propriedades poderão ser reativadas quando o aplicativo compilar e executar sem erros. A maioria dessas propriedades foram incorporadas como parte do novo .NET MAUI csproj, portanto, verifique quais realmente são necessárias.

Em MauiProgram.cs, atualize o objeto builder para configurar efeitos (linha 11):

using CommunityToolkit.Maui;

namespace MinhaQualidade;

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

Etapas de Migração do Xamarin Community Toolkit

Adicione o pacote Maui Community Toolkit no nuget:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-20_16-38-21.png

Substitua as seguintes informações do Xamarin Community Toolkit pelo equivalente ao MAUI Community Toolkit:

Valor Antigo	Valor Novo
`xmlns:xct="http://xamarin.com/schemas/2020/toolkit"`	`xmlns:mct="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"`
`xct:`	`mct:`
`using Xamarin.CommunityToolkit.UI.Views;`	`using CommunityToolkit.Maui.Views;`
`using Xamarin.CommunityToolkit.Extensions;`	Substituir por uma string vazia
`Navigation.ShowPopup`	`this.ShowPopup`
`xct:IsNullOrEmptyConverter`	`mct:IsStringNullOrEmptyConverter`
`xct:ListIsNullOrEmptyConverter`	`mct:IsListNullOrEmptyConverter`
`xct:ListIsNotNullOrEmptyConverter`	`mct:IsListNotNullOrEmptyConverter`

Em MauiProgram.cs, atualize seu construtor para usar o Maui Community Toolkit (linha 15).

using CommunityToolkit.Maui;

namespace MinhaQualidade;

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

Adicionando o Pacote do SQLite

Adicione o pacote sqlite-net-pcl e suas dependências:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-20_18-25-57.png

Lista de pacotes após inseridos:

<PackageReference Include="sqlite-net-pcl" Version="1.8.116" />
<PackageReference Include="SQLitePCLRaw.bundle_green" Version="2.1.2" />
<PackageReference Include="SQLitePCLRaw.core" Version="2.1.2" />
<PackageReference Include="SQLitePCLRaw.provider.dynamic_cdecl" Version="2.1.2" />
<PackageReference Include="SQLitePCLRaw.provider.sqlite3" Version="2.1.2" />

No iOS é necessário definir o provedor do SQLite no arquivo AppDelegate.cs:

protected override MauiApp CreateMauiApp()
{
    raw.SetProvider(new SQLite3Provider_sqlite3());
    return MauiProgram.CreateMauiApp();
}

Adicionando o Pacote do Firebase

Adicione o pacote Plugin.Firebase ( >= 1.2.0) no nuget. Depois os arquivos GoogleService-Info.plist e google-services.json à pasta raiz do projeto e inclua-os no arquivo .csproj dessa forma:

<ItemGroup Condition="'$(TargetFramework)' == 'net6.0-android'">
    <GoogleServicesJson Include="google-services.json" />
</ItemGroup>

<ItemGroup Condition="'$(TargetFramework)' == 'net6.0-ios'">
    <BundleResource Include="GoogleService-Info.plist" />
</ItemGroup>

Coloque a chamada de inicialização no arquivo MauiProgram.cs (linha 15):

#if IOS
using Plugin.Firebase.iOS;
#else
using Plugin.Firebase.Android;
#endif

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        return MauiApp
            .CreateBuilder()
            .UseMauiApp<App>()
            ...
            .RegisterFirebaseServices()
            .Build();
    }
    
    private static MauiAppBuilder RegisterFirebaseServices(this MauiAppBuilder builder)
    {
        builder.ConfigureLifecycleEvents(events => {
#if IOS
            events.AddiOS(iOS => iOS.FinishedLaunching((app, launchOptions) => {
                CrossFirebase.Initialize(app, launchOptions, CreateCrossFirebaseSettings());
                return false;
            }));
#else
            events.AddAndroid(android => android.OnCreate((activity, state) =>
                CrossFirebase.Initialize(activity, state, CreateCrossFirebaseSettings())));
#endif
        });
        
        builder.Services.AddSingleton(_ => CrossFirebaseAuth.Current);
        return builder;
    }
    
    private static CrossFirebaseSettings CreateCrossFirebaseSettings()
    {
        return new CrossFirebaseSettings(isAuthEnabled: true);
    }
}

Adicione o seguinte ItemGroup ao arquivo .csproj para evitar erros de compilação:

<ItemGroup Condition="'$(TargetFramework)' == 'net6.0-android'">
  <PackageReference Include="Xamarin.Kotlin.StdLib.Jdk7" Version="1.7.10" ExcludeAssets="build;buildTransitive" />
  <PackageReference Include="Xamarin.Kotlin.StdLib.Jdk8" Version="1.7.10" ExcludeAssets="build;buildTransitive" />
</ItemGroup>

Migrando Arquivos de Fonte

O registro de fontes foi simplificado no Microsoft MAUI.

Copie as fontes do aplicativo Xamarin.Forms existente para a pasta Resources\Fonts em seu projeto MAUI.

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-21_14-35-17.png

Certifique-se de que a propriedade "Build Action" esteja definida como MauiFont:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-21_14-38-16.png

Atualize o arquivo MauiProgram.cs para incluir as fontes migradas:

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

            fonts.AddFont("NunitoSans-Bold.ttf", "NunitoSansBold");
            fonts.AddFont("NunitoSans-ExtraLight.ttf", "NunitoSansExtraLight");
            fonts.AddFont("NunitoSans-Regular.ttf", "NunitoSansRegular");
            fonts.AddFont("Nunito-SemiBold.ttf", "NunitoSemiBold");
        })
        .UseMauiCommunityToolkit();
        return builder.Build();
    }
}

Migrando Imagens

O registro de fontes foi simplificado no Microsoft MAUI.

Copie as fontes do aplicativo Xamarin.Forms existente para a pasta Resources\Images em seu projeto MAUI.

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-21_14-59-49.png

Certifique-se de que a propriedade "Build Action" esteja definida como MauiImage:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-21_14-56-53.png

Controles Personalizados

O .NET MAUI Entry é um controle de entrada de texto, que implementa a interface IEntry. No iOS, o EntryHandler mapeia o Entry para o controle nativo UITextField. No Android, o Entry é mapeado para um AppCompatEditText, e no Windows o Entry é mapeado para um TextBox, como é mostrado na figura abaixo:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-21_15-22-5.png

O mapeador de propriedades do Entry, na classe EntryHandler, mapeia as propriedades de controle multiplataforma para a API de visualização nativa. Isso garante que, quando uma propriedade for definida em um Entry, a exibição nativa seja atualizada conforme necessário.

void ModifyEntry()
    {
        Microsoft.Maui.Handlers.EntryHandler.Mapper.AppendToMapping("MyCustomization", (handler, view) =>
        {
#if ANDROID
            handler.PlatformView.SetBackgroundColor(Colors.Transparent.ToPlatform());
#elif IOS
            handler.PlatformView.BorderStyle = UIKit.UITextBorderStyle.None;
#elif WINDOWS
            handler.PlatformView.FontWeight = Microsoft.UI.Text.FontWeights.Thin;
#endif
        });
    }

Reutilizando um Controle Customizado do Xamarin.Forms

Crie um arquivo correspondente ao controle na pasta de sua plataforma:

Linha RM > Migrando do Xamarin.Forms para .NET MAUI > image2022-9-28_15-1-29.png

Altere os namesapces correspondentes e remova o assembly ExportRenderer:

using Android.Content;
using Microsoft.Maui.Controls.Compatibility.Platform.Android;
using Microsoft.Maui.Controls.Platform;

//[assembly: ExportRenderer(typeof(RMSCustomEntry), typeof(RMSCustomEntryRenderer))]
namespace RMLib.Android.Renderers
{
    public class RMSCustomEntryRenderer : EntryRenderer
    {
        public RMSCustomEntryRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
        {
            base.OnElementChanged(e);
            Control?.SetBackgroundColor(global::Android.Graphics.Color.Transparent);
        }
    }
}

Inclua o trecho de código a seguir no arquivo MauiProgram.cs (linha 13-19):

using CommunityToolkit.Maui;
using Microsoft.Maui.Controls.Compatibility.Hosting;
using RMLib.Android.Renderers;
using RMLib.Custom;

namespace MinhaQualidade;
public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder.UseMauiApp<App>()
        .UseMauiCompatibility()
        .ConfigureMauiHandlers(handlers =>
        {
#if ANDROID
            handlers.AddCompatibilityRenderer(typeof(RMSCustomEntry), typeof(RMSCustomEntryRenderer));
#endif
        })
        .ConfigureEffects(effects =>
        {

        })
        .ConfigureFonts(fonts =>
        {
            fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
            fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

            fonts.AddFont("NunitoSans-Bold.ttf", "NunitoSansBold");
            fonts.AddFont("NunitoSans-ExtraLight.ttf", "NunitoSansExtraLight");
            fonts.AddFont("NunitoSans-Regular.ttf", "NunitoSansRegular");
            fonts.AddFont("Nunito-SemiBold.ttf", "NunitoSemiBold");
        })
        .UseMauiCommunityToolkit();
        return builder.Build();
    }
}