Layout per le app Tablet e Desktop

Xamarin.Forms supporta tutti i tipi di dispositivo disponibili nelle piattaforme supportate, quindi oltre ai telefoni, le app possono essere eseguite anche in:

  • Ipad
  • Tablet Android,
  • Tablet Windows e computer desktop (che eseguono Windows 10).

Questa pagina illustra brevemente:

Tipi di dispositivo

I dispositivi con schermo più grande sono disponibili per tutte le piattaforme supportate da Xamarin.Forms.

iPad (iOS)

Il Xamarin.Forms modello include automaticamente il supporto iPad configurando l'impostazione Info.plist > Devices su Universal (il che significa che sono supportati sia i Telefono che iPad).

Per offrire un'esperienza di avvio piacevole e assicurarsi che la risoluzione a schermo intero venga usata in tutti i dispositivi, è necessario assicurarsi che venga fornita una schermata di avvio specifica dell'iPad (usando uno storyboard). Ciò garantisce che il rendering dell'app venga eseguito correttamente nei dispositivi iPad mini, iPad e iPad Pro.

Prima di iOS 9 tutte le app occupavano lo schermo intero nel dispositivo, ma alcuni iPad ora possono eseguire il multitasking a schermo diviso. Ciò significa che l'app potrebbe occupare solo una colonna sottile sul lato dello schermo, il 50% della larghezza dello schermo o l'intero schermo.

iPad Split Screen Example

La funzionalità dello schermo diviso significa che devi progettare l'app in modo che funzioni bene con una larghezza di 320 pixel o una larghezza di 1366 pixel.

Tablet Android

L'ecosistema Android ha una miriade di dimensioni dello schermo supportate, da telefoni piccoli fino a tablet di grandi dimensioni. Xamarin.Forms può supportare tutte le dimensioni dello schermo, ma come con le altre piattaforme che è possibile modificare l'interfaccia utente per dispositivi di dimensioni maggiori.

Quando si supportano molte risoluzioni dello schermo diverse, è possibile fornire le risorse dell'immagine nativa in dimensioni diverse per ottimizzare l'esperienza utente. Per altre informazioni su come strutturare le cartelle e i nomi file nel progetto di app Android, vedere la documentazione delle risorse Android (e in particolare la creazione di risorse per dimensioni dello schermo variabili) per includere risorse di immagine ottimizzate nell'app.

Tablet e desktop Windows

Per supportare tablet e computer desktop che eseguono Windows, dovrai usare il supporto UWP di Windows, che compila app universali eseguite in Windows 10.

Le app in esecuzione su tablet e desktop Windows possono essere ridimensionate in dimensioni arbitrarie oltre all'esecuzione a schermo intero.

Windows Split Screen Example

Ottimizza per tablet e desktop

È possibile modificare l'interfaccia Xamarin.Forms utente a seconda che venga usato un telefono o un tablet o un dispositivo desktop. Ciò significa che è possibile ottimizzare l'esperienza utente per dispositivi di grandi dimensioni, ad esempio tablet e computer desktop.

Device.Idiom

Puoi usare la Device classe per modificare il comportamento dell'app o dell'interfaccia utente. Uso dell'enumerazione Device.Idiom che è possibile

if (Device.Idiom == TargetIdiom.Phone)
{
    HeroImage.Source = ImageSource.FromFile("hero.jpg");
} else {
    HeroImage.Source = ImageSource.FromFile("herotablet.jpg");
}

Questo approccio può essere espanso per apportare modifiche significative ai singoli layout di pagina o anche per eseguire il rendering di pagine completamente diverse su schermi più grandi.

Sfruttare FlyoutPage

È FlyoutPage ideale per schermi più grandi, soprattutto nell'iPad in cui usa per UISplitViewController offrire un'esperienza iOS nativa.

Esaminare questo post di blog di Xamarin per vedere come adattare l'interfaccia utente in modo che i telefoni usino un layout e schermi più grandi possano usare un altro (con ).FlyoutPage