Cosa fare e cosa fare adattivi

Le app adattive supportano schermi di tutte le dimensioni: l'intero schermo del dispositivo, finestre ridimensionabili in modalità multi-finestra, orientamenti verticale e orizzontale, schermi aperti e chiusi dei dispositivi pieghevoli.

Un breve elenco di impostazioni di configurazione e API ti consente di creare app adattive. Tuttavia, alcune API e impostazioni obsolete non sono compatibili con le app adattive e devono essere evitate.

Ridimensionabilità

Le app adattabili supportano il ridimensionamento e la modalità multi-finestra.

L'attributo resizeableActivity degli elementi manifest <activity> e <application> attiva o disattiva la modalità multi-finestra su Android 11 (livello API 30) e versioni precedenti. Su Android 12 (livello API 31) e versioni superiori, gli schermi di grandi dimensioni supportano la modalità multi-finestra indipendentemente dall'attributo. Per ulteriori informazioni, consulta la sezione Supportare la modalità multi-finestra.

✓ Azioni consigliate

Consenti alla tua app di partecipare a scenari multitasking in multi-finestra per migliorare la produttività e la soddisfazione degli utenti.

Imposta resizeableActivity="true" se la tua app ha come target livelli API inferiori a 24; altrimenti, non preoccuparti: è true per impostazione predefinita su Android 7.0 (livello API 24) e versioni successive.

✗ Non

Non impostare resizeableActivity="false" per nessun livello API. Non escludere la tua app dai casi d'uso che prevedono la modalità multi-finestra.

Orientamento

Le app adattabili supportano l'orientamento verticale e orizzontale indipendentemente dalle dimensioni del display o dalla modalità di visualizzazione.

L'impostazione del manifest screenOrientation limita l'orientamento dell'attività.

✓ Azioni consigliate

Elimina l'impostazione screenOrientation dal file manifest dell'app.

Il blocco dell'orientamento delle app non impedisce la modifica delle dimensioni della finestra. Le app vengono ridimensionate quando entrano in modalità multi-finestra, quando un dispositivo è chiuso o aperto o quando viene modificato il ridimensionamento di una finestra di tipo desktop. L'app deve supportare le modifiche alle dimensioni della finestra indipendentemente dall'impostazione dell'attributo screenOrientation.

✗ Non

Non limitare l'orientamento dell'attività. Le app che bloccano l'orientamento sono in letterbox su dispositivi con schermi grandi e dimensioni delle finestre incompatibili.

Le app con letterbox sono soggette a una minore rilevabilità su Google Play per tablet, dispositivi pieghevoli e ChromeOS.

Proporzioni

Poiché le dimensioni dello schermo e della finestra variano, cambiano anche le proporzioni: da alte e strette a quadrate, da corte e larghe.

Le impostazioni manifest minAspectRatio e maxAspectRatio limitano le proporzioni della tua app a valori hardcoded.

✓ Azioni consigliate

Adatta l'app in modo che si adatti al display indipendentemente dalle dimensioni relative.

Elimina le impostazioni minAspectRatio e maxAspectRatio dal file manifest dell'app. In alternativa, assicurati che la tua app sia ridimensionabile e le proporzioni verranno regolate automaticamente (vedi la sezione Ridimensionabilità).

✗ Non

Non tentare di controllare le dimensioni relative dell'app. Se l'app viene eseguita su una schermata o in una finestra con proporzioni incompatibili con quelle dell'app, viene applicata la modalità letterbox.

Su Android 14 (livello API 34) e versioni successive, gli utenti possono ignorare le proporzioni dell'app per espandere le app con letterbox in modo da riempire l'area di visualizzazione disponibile. Consulta la modalità di compatibilità del dispositivo.

Dimensioni finestra

L'ottimizzazione dei layout per dimensioni diverse del display è la premessa fondamentale del design adattivo. Le app adattive si concentrano sulle dimensioni della finestra dell'app anziché sulle dimensioni dello schermo del dispositivo. Quando l'app è a schermo intero, la finestra dell'app è lo schermo del dispositivo.

Le classi di dimensioni della finestra forniscono un modo sistematico per determinare e classificare le dimensioni della finestra dell'app. Adatta l'app modificando i layout man mano che cambia la classe della dimensione della finestra dell'app.

✓ Azioni consigliate

Valuta le dimensioni della finestra dell'app in base alle classi di dimensioni della finestra.

Per determinare la classe di dimensioni della finestra, utilizza la funzione di primo livello currentWindowAdaptiveInfo() della libreria Compose Material 3 Adaptive. Per ulteriori informazioni, consulta Creare app adattabili.

✗ Non

Non ignorare l'utilità delle definizioni di classi delle dimensioni della finestra e delle API predefinite. Non utilizzare API ritirate per calcolare le dimensioni della finestra.

API deprecate

Le API di piattaforma precedenti non misurano correttamente la finestra dell'app; alcune misurano lo schermo del dispositivo, altre escludono la decorazione di sistema.

✓ Azioni consigliate

Utilizza WindowManager#getCurrentWindowMetrics() e WindowMetrics#getBounds() per ottenere le dimensioni della finestra dell'app. Utilizza WindowMetrics#getDensity() per ottenere la compattezza del display.

✗ Non

Non utilizzare le seguenti API Display ritirate per determinare le dimensioni della finestra:

Scrivi

Jetpack Compose è progettato per lo sviluppo di UI adattabili. Nessun file XML, layout o qualificatori delle risorse. Solo composabili senza stato basati su Kotlin come Column, Row e Box che descrivono l'interfaccia utente e modificatori come offset, padding e size che aggiungono comportamento agli elementi dell'interfaccia utente.

✓ Azioni consigliate

Crea con Compose. Non perderti le ultime funzionalità e release.

✗ Non

Non fare affidamento su tecnologie obsolete. Non lasciare che la tua app diventi obsoleta.

Componi la raccolta Material 3 Adaptive

La libreria Compose Material 3 Adaptive fornisce componenti e API che facilitano lo sviluppo di app adattive.

✓ Azioni consigliate

Utilizza le seguenti API per rendere adattabile la tua app:

  • NavigationSuiteScaffold: passa dalla barra di navigazione alla barra di scorrimento a seconda della classe delle dimensioni della finestra dell'app.
  • ListDetailPaneScaffold: implementa il layout canonico elenco-dettaglio. Adatta il layout alle dimensioni della finestra dell'app.
  • SupportingPaneScaffold: implementa il layout canonico del riquadro di supporto.
✗ Non

Non c'è bisogno di reinventare la ruota. Non perdere i vantaggi in termini di produttività degli sviluppatori offerti da tutte le librerie Jetpack Compose.

Layout

Gli utenti si aspettano che le app utilizzino al meglio lo spazio di visualizzazione disponibile con contenuti aggiuntivi o controlli avanzati.

Le app adattabili ottimizzano i layout in base alle modifiche del display, in particolare alle modifiche delle dimensioni della finestra dell'app o della posizione del dispositivo.

✓ Azioni consigliate

Modifica i componenti dell'interfaccia utente man mano che le dimensioni della finestra cambiano per sfruttare al meglio lo spazio di visualizzazione disponibile. Ad esempio, puoi sostituire la barra di navigazione inferiore utilizzata per le dimensioni delle finestre compatte con una barra di navigazione verticale nelle finestre medie ed espanse. Riposizionamento delle finestre di dialogo in modo che siano raggiungibili su tutti i display.

Organizza i contenuti in riquadri per attivare layout con più riquadri, come dettagli della lista e riquadro di supporto per la visualizzazione di contenuti dinamici.

✓ Da fare: elenca e descrivi le attività organizzate in un layout a due riquadri.
✗ Non

Se non utilizzi i riquadri dei contenuti, non allungare semplicemente gli elementi dell'interfaccia utente per riempire lo spazio di visualizzazione disponibile. Le righe di testo lunghe sono difficili da leggere. I pulsanti allungati sembrano progettati male. Se utilizzi Modifier.fillMaxWidth, non assumere che sia il comportamento corretto per tutte le dimensioni dei display.

✗ Non:il layout viene allungato per riempire la finestra espandibile.

Dispositivi di immissione

Gli utenti non utilizzano solo i touchscreen per interagire con le app.

Le app adattive supportano tastiere, mouse e stili esterni per offrire un'esperienza utente migliorata e aiutare gli utenti a essere più produttivi su fattori di forma di tutti i tipi.

✓ Azioni consigliate

Sfrutta le funzionalità integrate del framework Android per la navigazione con i tasti Tab della tastiera e i clic, la selezione e lo scorrimento del mouse o del trackpad. Pubblica le scorciatoie da tastiera della tua app nella Guida scorciatoie da tastiera.

Utilizza la libreria Material 3 di Jetpack per consentire agli utenti di scrivere in qualsiasi componente TextField utilizzando uno stilo.

✗ Non

Non rendere impossibili metodi di immissione alternativi. Non introdurre problemi di accessibilità.

Riepilogo

  • Creare l'app con Compose e la libreria Material 3 Adaptive
  • Basare i layout sulle classi di dimensioni delle finestre
  • Creare layout con più riquadri
  • Rendere l'app ridimensionabile
  • Non bloccare mai l'orientamento dell'attività
  • Non limitare le proporzioni
  • Supportare input diversi dal tocco
  • Evitare le API deprecate

✓ Fai ciò che si aspettano gli utenti: ottimizza la tua app per la diversità dei dispositivi che le persone utilizzano ogni giorno.

✗ Non aspettare. Inizia subito.