Livello 2: ottimizzato in modo adattivo

Le app ottimizzate supportano completamente tutti i tipi di schermi e gli stati dei dispositivi, incluse le transizioni di stato.

Linee guida

Crea la tua app in modo che si adatti a tutte le dimensioni dello schermo e a tutti gli stati dei dispositivi.

Interfaccia utente

ID linea guida	ID test	Descrizione
Responsive_adaptive_layouts	T-Layout_Flow	L'app ha layout adattabili e reattivi progettati per schermi di tutte le dimensioni. Tutti i layout sono reattivi (vedi Eseguire la migrazione dell'interfaccia utente a layout reattivi). L'implementazione dei layout adattabili è determinata dalle classi di dimensioni delle finestre. L'interfaccia utente dell'app può includere: Barre di navigazione all'avanguardia che si espandono in pannelli di navigazione completi su finestre di dimensioni maggiori Layout a griglia che scalano il numero di colonne per adattarsi alle modifiche delle dimensioni delle finestre Colonne di testo su schermi di grandi dimensioni Pannelli sul bordo finale che sono aperti per impostazione predefinita sulle dimensioni dello schermo del computer e chiusi sugli schermi più piccoli Crea layout a più riquadri (se appropriato) per sfruttare lo spazio degli schermi di grandi dimensioni. Vedi Layout canonici. Per le app Jetpack Compose, utilizza layout adattabili (ad esempio ListDetailPaneScaffold) per creare UI a più riquadri. Per le app legacy basate sull'attività, l'incorporamento delle attività consente layout a più riquadri visualizzando le attività una accanto all'altra.
UI_Secondary_Elements	T-Layout_Flow	Finestre modali, menu contestuali e altri elementi secondari sono formattati correttamente su tutti i tipi di schermi e stati dei dispositivi, ad esempio: Le schede inferiori non sono a larghezza intera sugli schermi di grandi dimensioni. (Applica una larghezza massima per evitare l'allungamento.) Vedi Comportamento in Fogli: in basso. I pulsanti non sono a larghezza intera sugli schermi di grandi dimensioni. Vedi Comportamento in pulsanti. I campi e le caselle di testo non si estendono a larghezza intera sugli schermi di grandi dimensioni. Vedi Comportamento nei campi di testo. I menu o le finestre modali di modifica di piccole dimensioni non coprono l'intero schermo e mantengono il più possibile il contesto per l'utente. Vedi Menu. I menu contestuali vengono visualizzati accanto all'elemento selezionato dall'utente. Vedi l'argomento "Menu contestuali" in Menu. Le barre di navigazione vengono sostituite dalle barre di navigazione per una migliore ergonomia sugli schermi di grandi dimensioni. Vedi Barra di navigazione. I riquadri di navigazione vengono aggiornati alle barre di navigazione espanse. Vedi riquadro di navigazione a scomparsa. Le finestre di dialogo vengono aggiornate all'ultimo componente Material. Vedi Finestre di dialogo. Le immagini vengono visualizzate con una risoluzione adeguata e non vengono allungate o ritagliate.
Touch_Targets	T-Touch_Targets	I touch target sono di almeno 48 dp. Vedi le linee guida per il layout e la tipografia di Material Design.
Drawable_Focus	T-Drawable_Focus	Viene creato uno stato attivo per gli elementi disegnabili personalizzati interattivi. Una risorsa drawable personalizzata è qualsiasi elemento UI visivo non fornito dal framework Android. Se gli utenti possono interagire con una risorsa drawable personalizzata, questa deve essere selezionabile quando il dispositivo non è in modalità tocco e deve essere visibile un'indicazione visiva dello stato attivo.

Tastiera, mouse e trackpad

ID linea guida	ID test	Descrizione
Keyboard_Navigation	T-Keyboard_Navigation	I flussi di attività principali dell'app supportano la navigazione da tastiera, inclusa la navigazione con i tasti Tab e freccia. Vedi Creare app più accessibili.
Keyboard_Shortcuts	T-Keyboard_Shortcuts	L'app supporta le scorciatoie da tastiera per le azioni di uso comune, come selezionare, tagliare, copiare, incollare, annullare e ripetere. Vedi Tastiera, mouse e trackpad.
Keyboard_Media_Playback	T-Keyboard_Media_Playback	La tastiera può essere utilizzata per controllare la riproduzione dei contenuti multimediali; ad esempio, la barra spaziatrice riproduce e mette in pausa i contenuti multimediali.
Keyboard_Send	T-Keyboard_Send	Il tasto Invio della tastiera esegue una funzione di invio nelle app di comunicazione.
Keyboard_Exit	T-Keyboard_Exit	Il tasto Esc della tastiera esegue una funzione di uscita che termina o annulla un'azione, ad esempio: Chiude finestre modali, finestre di dialogo, popup e menu Cancella il testo di ricerca o rimuove lo stato attivo della ricerca Annulla la selezione della tastiera Esce da video a schermo intero, PiP, modalità a schermo intero o presentazioni Chiude i controlli sullo schermo, come barre di avanzamento o menu Annulla i timer di Prossimi / riproduzione automatica Deseleziona tutti gli elementi selezionati Interrompe la ridenominazione/modifica senza salvare Esce dagli strumenti di ritaglio/trasformazione e ignora le modifiche
Context_Menus	T-Context_Menus	I menu contestuali sono accessibili tramite il tipico comportamento di clic con il tasto destro del mouse e del trackpad (tasto secondario del mouse o tocco secondario).
Content_Zoom	T-Content_Zoom	È possibile aumentare lo zoom dei contenuti dell'app utilizzando la rotellina del mouse (insieme al tasto Control o Ctrl) e i gesti di pizzicamento del trackpad.
Hover_States	T-Hover_States	Gli elementi UI utilizzabili hanno stati di passaggio del mouse (se appropriato) per indicare agli utenti di mouse e trackpad che gli elementi sono interattivi.

Test

Per assicurarti che la tua app sia ottimizzata e reattiva a tutte le configurazioni dello schermo, esegui i seguenti test.

Interfaccia utente

ID test	ID linee guida	Descrizione
T-Layout_Flow	Responsive_adaptive_layouts, UI_Secondary_Elements	Esegui l'app su dispositivi con un'ampia varietà di dimensioni dello schermo, inclusi smartphone, smartphone pieghevoli, tablet piccoli e grandi e dispositivi desktop. Esegui l'app in modalità multi-finestra sui dispositivi. Verifica che il layout dell'app risponda e si adatti a diverse dimensioni dello schermo e della finestra. Controlla se l'app espande e contrae le barre di navigazione, scala il numero di colonne nei layout a griglia, inserisce il testo nelle colonne e così via. Verifica se gli elementi UI sono formattati sia per l'estetica sia per la funzionalità. Per le app legacy che utilizzano l'incorporamento delle attività, verifica se le attività vengono visualizzate una accanto all'altra sugli schermi di grandi dimensioni e impilate sugli schermi piccoli.
T-Touch_Targets	Touch_Targets	Verifica che i touch target mantengano una dimensione e una posizione coerenti e accessibili e che non siano nascosti o oscurati da altri elementi UI per tutte le dimensioni e configurazioni dello schermo. Per informazioni sull'accessibilità, vedi Accessibility Scanner.
T-Drawable_Focus	Drawable_Focus	Su ogni schermata dell'app che contiene un elemento disegnabile personalizzato interattivo, verifica che l'elemento disegnabile possa essere attivato utilizzando una tastiera esterna, un D-pad o un altro dispositivo che consenta di attivare gli elementi UI. Verifica che sia visibile un'indicazione visiva dello stato attivo. Per informazioni correlate, vedi la documentazione relativa allo stato attivo di Compose.

Tastiera, mouse e trackpad

ID test	ID linee guida	Descrizione
T-Keyboard_Navigation	T-Keyboard_Navigation	Sposta lo stato attivo tra i componenti attivabili dell'app utilizzando i tasti Tab e freccia di una tastiera esterna.
T-Keyboard_Shortcuts	Keyboard_Shortcuts	Utilizza le scorciatoie da tastiera su una tastiera esterna per eseguire le azioni di selezione, taglio, copia, incolla, annullamento e ripetizione.
T-Keyboard_Media_Playback	Keyboard_Media_Playback	Utilizza una tastiera esterna per avviare, interrompere, mettere in pausa, riavvolgere e mandare avanti la riproduzione dei contenuti multimediali.
T-Keyboard_Send	Keyboard_Send	Utilizza il tasto Invio di una tastiera esterna per inviare o caricare i dati.
T-Keyboard_Exit	Keyboard_Exit	Utilizza il tasto Esc di una tastiera esterna per eseguire una funzione di uscita. Verifica che il tasto esegua le seguenti operazioni (se applicabili): Chiude finestre modali, finestre di dialogo, popup e menu Cancella il testo di ricerca o rimuove lo stato attivo della ricerca Annulla la selezione della tastiera Esce da video a schermo intero, PiP, modalità a schermo intero o presentazioni Chiude i controlli sullo schermo Annulla i timer di Prossimi / riproduzione automatica Deseleziona tutti gli elementi selezionati Interrompe la ridenominazione/modifica senza salvare Esce dagli strumenti di ritaglio/trasformazione e ignora le modifiche
T-Context_Menus	Context_Menus	Utilizza il tasto secondario del mouse o la funzionalità di tocco secondario del trackpad per accedere al menu contestuale degli elementi interattivi.
T-Content_Zoom	Content_Zoom	Utilizza la rotellina del mouse (insieme al tasto Control o Ctrl) e i gesti di pizzicamento del trackpad per aumentare e diminuire lo zoom dei contenuti.
T-Hover_States	Hover_States	Passa il cursore del mouse o del trackpad sopra gli elementi UI utilizzabili per attivare lo stato di passaggio del mouse dell'elemento.