Mobilutvikling og overgang fra Xamarin til MAUI

MAUI er arvtageren etter Xamarin.Forms og ble lansert våren 2022.

Med introduksjonen av MAUI ble mobil-utvikling mye enklere. Microsoft har løst flere av utfordringene og "smertene" som utviklere ofte møtte med Xamarin. 

Det må også nevnes at Microsoft har lagt til støtte for Blazor. Det betyr at utvikler nå kan benytte HTML og CSS istedenfor XAML – som mange har hatt et turbulent forhold til. Om du ønsker å fortsette å bruke XAML, kan du i MAUI også inkludere f. eks CSS-filer. En fordel er f. eks dersom kunden allerede har en nettside med mye stilsetting som vi ønsker å gjenbruke i appen. 

I denne artikkelen skriver vi om noen av utfordringene som har blitt løst: 

1. Bildehåndtering 
2. Splashscreen 
3. Prosjektfiler 
4. Universell utforming 
5. Ytelse 

1. Bilder 

I Xamarin.Forms måtte man lage ulike bildestørrelser for ulike operativsystemer og skjermstørrelser. Det var alltid tidkrevende. Med MAUI kan man nå bare laste opp en SVG-fil for hvert bilde så vil MAUI automatisk generere de nødvendige PNG-filene under kompilering.  

Siden bildene blir kompilert fra SVG til PNG-filer så må man benytte png i henvisningene i C# og XAML.  

<Image Source="xlent_logo.png" />

2. Splashscreen 

I MAUI har det nærmest blitt lekende lett med splash-screen. Istedenfor at man må lage en egen klasse, så kan man nå enkelt i prosjekt-filen sette opp en tag som håndterer alt.  

<ItemGroup>

   <MauiSplashScreen Include="Resources\Splash\xlent_splash.svg" />

</ItemGroup> 

Taggen kan ta imot flere attributter, color, resize, baseSize og tintColor.  

3. Prosjektfiler 

I Xamarin sies det ofte at man har én kodebase, men man har likevel et prosjekt pr plattform og ender ofte opp med flere unntak. Eksempelvis med custom rendereres.  

I MAUI så har man ett prosjekt og plattformspesifikke unntak ligger i en egen folder. Pluss at rammeverket har blitt såpass sterkt at det er sjelden man har behov for å røre det. Dette gjør at det blir færre filer og mye enklere for utvikler å holde oversikt.  

4. Universell utforming 

Xamarin har lenge hatt muligheten til å tilføye ekstra informasjon for å gi støtte til universell utforming. Automation properties har vært løsningen for det.  

I MAUI så har vi fått noe som heter Semantic properties. Dette gjør det enda enklere og raskere å legge til rette for universell utforming. Label og Button med Text-attributtet er universelt utformet out-of-the-box, men ved for eksempel bilder må man legge på noe ekstra info.  

<Image Source="xlent.png" SemanticProperties.Description="Flinke utviklere som smiler!" />  

På denne måten blir det en naturlig del av koden.  

5. Forbedret ytelse i markup-filer 

For å gjenbruke kode og for å holde designet til en app konsistent, er det vanlig å samle stil-kode på et sted. I Xamarin og MAUI vil dette typisk være en global .xaml fil. Ulempen med å samle koden slik i Xamarin er at hele .xaml filen med styling blir inkludert når du bruker den, selv om du kanskje kun bruker stylingen for et enkelt element. Det gjør innlastningen unødvendig treg. Har du mye stil-kode samlet globalt, kan det potensielt gjøre hele appens brukeropplevelse veldig treg og dårlig - helt unødvendig. 

MAUI har løst utfordringen. Nå kan du inkludere globale .xaml filer, aksessere deler av innholdet og da er det kun det innholdet du aksesserer som faktisk lastes inn. Resten blir ignorert og resultatet er mye raskere innlasting av sidene. 

Skrevet av: Kari Skjold og Håkon Nordli