Nozioni di base sul layout

Illustrazione delle nozioni di base del layout hero

Il layout definisce la struttura visiva con cui un utente interagisce con la tua app, ad esempio in un elemento componibile. Android fornisce una gamma di librerie, punti di partenza canonici e tecniche per visualizzare e posizionare i contenuti.

Inizia

Inizia a progettare i layout Android imparando l'anatomia delle app e poi come strutturare i contenuti dell'app.

Concetti principali

Orientamento del layout

Considera le diverse proporzioni, classi di dimensioni e risoluzioni che gli utenti potrebbero incontrare. Verifica che la tua app offra una buona esperienza utente nell'orientamento sia orizzontale sia verticale, nonché su diverse dimensioni dello schermo e fattori di forma.

Per ulteriori informazioni, consulta le indicazioni su come adattare il layout e sui layout canonici.

Aree sicure del dispositivo

Rispetta le aree sicure del dispositivo, che includono parti della UI come ritagli del display, inset edge-to-edge, schermi curvi ai bordi, tastiere software e barre di sistema. Fornisci un layout flessibile per consentire agli utenti di interagire con la tastiera.

Concentrati sugli input dell'utente. Se la tastiera è presente, sposta l'input in uno stato attivo o valuta la possibilità di collegare l'input di testo alla tastiera.
Nascondi gli input. Anche su schermi più piccoli, l'utente potrebbe non sapere o non essere in grado di scorrere lo schermo.
Ergonomia delle interazioni

Mantieni le interazioni essenziali, come la navigazione principale, in un'area dello schermo raggiungibile. I Floating Action Button (FAB) forniscono un punto di interazione ben visibile e raggiungibile.

Gruppi di contenimento

Utilizza il contenimento per raggruppare i contenuti correlati al fine di guidare l'utente attraverso i contenuti e le azioni. Usa schede che utilizzano il contenimento esplicito per raggruppare i contenuti con le azioni correlate.

Allineamento

Fornisci un allineamento coerente tra contenuti ed elementi UI simili.

Stabilisci una spaziatura coerente tra elementi simili.
Non compromettere la leggibilità disponendo in modo incoerente elementi simili, cosa che può far apparire il design disordinato.
Interazioni essenziali

Non sovraccaricare l'utente con troppe azioni per schermata.

Annotare le specifiche del layout

Quando crei layout personalizzati, annota come i contenuti devono posizionarsi all'interno del layout usando allineamento, vincoli o proprietà di gravity. Specifica anche come le immagini devono adattarsi al contenitore per essere visualizzate correttamente.