Gli indicatori di avanzamento mostrano visivamente lo stato di un'operazione. Utilizzano il movimento per attirare l'attenzione dell'utente sulla fase di completamento del processo, ad esempio il caricamento o l'elaborazione dei dati. Possono anche indicare che l'elaborazione è in corso, senza fare riferimento a quanto manca al completamento.
Considera questi tre casi d'uso in cui potresti utilizzare un indicatore di avanzamento:
- Caricamento di contenuti: durante il recupero di contenuti da una rete, ad esempio il caricamento di un'immagine o di dati per il profilo di un utente.
- Caricamento file: fornisci all'utente un feedback sul tempo necessario per il caricamento.
- Elaborazione lunga: mentre un'app elabora una grande quantità di dati, comunicate all'utente la percentuale di completamento del totale.
In Material Design esistono due tipi di indicatori di avanzamento:
- Determinato: mostra esattamente il progresso compiuto.
- Indeterminate: l'animazione viene visualizzata continuamente, indipendentemente dall'avanzamento.
Analogamente, un indicatore di avanzamento può avere una delle due seguenti forme:
- Lineare: una barra orizzontale che si riempie da sinistra a destra.
- Circolare: un cerchio il cui tratto aumenta di lunghezza fino a comprendere la circonferenza completa del cerchio.
Compatibilità delle versioni
Questa implementazione richiede che il valore minSDK del progetto sia impostato sul livello API 21 o superiore.
Dipendenze
Creare determinati indicatori
Un determinato indicatore riflette esattamente il livello di completezza di un'azione. Utilizza i composabili LinearProgressIndicator o CircularProgressIndicator e passa un valore per il parametro progress.
Lo snippet seguente fornisce un esempio relativamente dettagliato. Quando l'utente preme il pulsante, l'app mostra l'indicatore di avanzamento e avvia una coroutine che aumenta gradualmente il valore di progress. Di conseguenza, l'indicatore di avanzamento viene visualizzato in ordine crescente.
Risultati
Quando il caricamento è parzialmente completato, l'indicatore lineare nell'esempio precedente viene visualizzato come segue:
Analogamente, l'indicatore circolare viene visualizzato come segue:
Crea indicatori indefiniti
Un indicatore indeterminato non riflette il livello di completamento di un'operazione. Utilizza piuttosto il movimento per indicare all'utente che l'elaborazione è in corso, anche se senza specificare alcun grado di completamento.
Per creare un indicatore di avanzamento indeterminato, utilizza il composable LinearProgressIndicator o CircularProgressIndicator, ma non passare un valore per progress. L'esempio seguente mostra come attivare/disattivare un indicatore indeterminato premendo un pulsante.
Risultati
Di seguito è riportato un esempio di questa implementazione quando l'indicatore è attivo:
Di seguito è riportato un esempio della stessa implementazione, ma conLinearProgressIndicator anziché CircularProgressIndicator.
Punti chiave
Sebbene esistano diversi composabili che puoi utilizzare per creare indicatori di avanzamento in linea con Material Design, i relativi parametri non differiscono molto. Tra i parametri chiave da tenere presenti, figurano i seguenti:
progress: l'avanzamento corrente visualizzato dall'indicatore. Passa un valoreFloatcompreso tra0.0e1.0.color: il colore dell'indicatore, ovvero la parte del componente che riflette l'avanzamento e che lo racchiude completamente al termine dell'avanzamento.trackColor: il colore del canale su cui viene disegnato l'indicatore.
Raccolte che contengono questa guida
Questa guida fa parte di queste raccolte di guide rapide selezionate che coprono obiettivi di sviluppo Android più ampi:
Mostrare componenti interattivi
Mostrare un elenco o una griglia
