Creare layout consistenti grazie al Visual Material in Xamarin Forms

di Morgan Pizzini, in Windows 10,

Con il rilascio di Xamarin.Forms 4.3, oltre ai numerosi nuovi componenti come CarouselView e CollectionView, abbiamo a disposizione, una nuova funzionalità che ci consentirà di mantenere un layout consistente e visivamente identico sia in Android che in iOS: il Visual.Material.

La possibilità di avere lo stesso tema per entrambe le piattaforme ci consente di velocizzare lo sviluppo, consentendoci di sviluppare utilizzando solo un'architettura ed effettuare controlli sul posizionamento dei componenti, verso l'altra piattaforma, molto più dilazionati nel tempo, avendo la quasi certezza che, nel peggior dei casi, si debbano fare solo piccoli aggiustamenti grafici.

Per attivare questa funzionalità, una volta installata la libreria nei progetti Android e iOS, procediamo ad informare sistema di questa opzione tematica.

In Android, procediamo all'interno della MainActivity e in particolare nel metodo OnCreate, a seguito dell'inizializzazione di Xamarin.Forms:

global::Xamarin.Forms.Forms.Init(this, savedInstanceState);

// abilitazione Visual.Material
global::Xamarin.Forms.FormsMaterial.Init(this, savedInstanceState);

// caricamento applicazione
LoadApplication(new App());

In iOS, invece, andremo a modificare la classe AppDelegate, facendo l'override del metodo FinishedLaunching:

global::Xamarin.Forms.Forms.Init();

// abilitazione Visual.Material
global::Xamarin.Forms.FormsMaterial.Init();

// caricamento applicazione
LoadApplication(new App());

Le piattaforme sono ora pronte a visualizzare gli elementi rispettando le stesse linee tematiche. Per attivare il nuovo layout occorrerà aggiungere l'attributo Visual="Material" ai componenti delle nostre view.

<!-- Material layout abilitato solo sul bottone -->
<Button Text="Click Me!" Visual="Material"></Button>

<!-- oppure... -->

<ContentPage Visual="Material">
<!-- tutti i componenti avranno il layout Material -->
</ContentPage>

L'opzione è disponibile su tutti i principali componenti come ActivityIndicator, Button, CheckBox, DatePicker, Entry ecc...

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi