Le icone aiutano gli utenti a identificare la tua app e le azioni al suo interno. Puoi accedere alla suite di icone di Material e aggiungerle alla tua app direttamente con Scrivi. Per creare icone o icone personalizzate per la tua app con Views, Android Studio offre Image Asset Studio.
Aggiungere icone all'interno dell'app con Scrivi
Con Compose, puoi importare la
raccolta Compose Material o la
raccolta Compose Material 3 per accedere
a qualsiasi icona di Material. Dopodiché usa la componibile Icon
per aggiungere icone alla tua app. Le icone Material sono più utili per le icone della barra delle azioni, delle schede o di notifica. Per ulteriori
informazioni, consulta la sezione
Icone in Materiale.
Se devi creare icone personalizzate, ad esempio l'icona in Avvio app, utilizza Image Asset Studio. Per le icone in Avvio applicazioni, il file AndroidManifest.xml
deve fare riferimento alla posizione mipmap/
. Image Asset Studio aggiunge questo codice
automaticamente. Il seguente codice del file manifest fa riferimento all'icona ic_launcher
nella directory mipmap/
:
<application android:name="ApplicationTitle" android:label="@string/app_label" android:icon="@mipmap/ic_launcher" >
Informazioni su Image Asset Studio
Android Studio include uno strumento chiamato Image Asset Studio che ti aiuta a generare icone
dell'app da
icone materiali,
immagini personalizzate e stringhe di testo. Genera un set di icone alla risoluzione appropriata per ogni densità di pixel supportata dall'app.
Image Asset Studio posiziona le icone appena generate in cartelle specifiche per la densità all'interno della directory res/
del progetto. In fase di runtime, Android utilizza la risorsa appropriata in base alla densità dello schermo del dispositivo su cui è in esecuzione la tua app.
Image Asset Studio consente di generare i seguenti tipi di icone:
- Icone Avvio app
- Barra delle azioni e icone delle schede
- Icone di notifica
Le seguenti sezioni descrivono i tipi di icone che puoi creare e gli input di immagine e testo che puoi utilizzare.
Icone adattivi e precedenti in Avvio applicazioni
Un'icona in Avvio applicazioni è un'immagine che rappresenta la tua app per gli utenti. Può:
- Vengono visualizzate nell'elenco di app installate su un dispositivo e nella schermata Home.
- Rappresentare scorciatoie nella tua app (ad esempio, un'icona di scorciatoia di contatto che apre informazioni dettagliate su un contatto).
- Essere utilizzata da app Avvio app.
- Aiuta gli utenti a trovare la tua app su Google Play.
Le icone di Avvio applicazioni adattivo possono essere visualizzate sotto forma di varie forme su diversi modelli di dispositivi e sono disponibili su Android 8.0 (livello API 26) e versioni successive. Android Studio 3.0 introduce il supporto per la creazione di icone adattive con Image Asset Studio. Image Asset Studio genera anteprime di un'icona adattiva nelle forme cerchio, quadrato, quadrato e arrotondato, nonché un'anteprima al vivo dell'icona. Image Asset Studio genera inoltre anteprime dell'icona legacy, rotonde e del Google Play Store. Un'icona in Avvio applicazioni precedente è un'immagine che rappresenta l'app nella schermata Home e nella finestra di Avvio applicazioni del dispositivo. Le icone in Avvio applicazioni precedenti sono destinate all'uso su dispositivi con Android 7.1 (livello API 25) o versioni precedenti, che non supportano le icone adattive e non vengono visualizzate in forme diverse in base ai modelli di dispositivi.
Image Asset Studio posiziona le icone nelle posizioni corrette
nelle directory res/mipmap-density/
. Viene inoltre creata un'immagine da 512 x 512 pixel
appropriata per Google Play Store.
Ti consigliamo di utilizzare lo stile material design per le icone in Avvio applicazioni, anche se supporti le versioni precedenti di Android.
Per ulteriori informazioni, consulta le sezioni Icone di Avvio app adattive e Icone dei prodotti - Material Design.
Barra delle azioni e icone delle schede
Le icone della barra delle azioni sono elementi grafici posizionati nella barra delle azioni e rappresentano le singole attività. Per ulteriori informazioni, consulta gli articoli Aggiunta e gestione delle azioni, Barra dell'app - Material Design e Progettazione della barra delle azioni.
Le icone delle schede sono elementi grafici utilizzati per rappresentare singole schede in un'interfaccia a più schede. Ogni icona di scheda ha due stati: deselezionata e selezionata. Per ulteriori informazioni, consulta Creazione di visualizzazioni a scorrimento con le schede e Schede - Material Design.
Image Asset Studio posiziona le icone nelle posizioni appropriate nelle
res/drawable-density/
directory.
Ti consigliamo di usare lo stile material design per le icone della barra delle azioni
e delle schede, anche se supporti le versioni precedenti di Android. Utilizza appcompat
e altre
librerie di supporto
per distribuire la tua UI di material design alle versioni precedenti della piattaforma.
In alternativa a Image Asset Studio, puoi utilizzare Vector Asset Studio per creare icone della barra delle azioni e della scheda. I disegnabili vettoriali sono adatti alle icone semplici e possono ridurre le dimensioni dell'app.
Icone di notifica
Una notifica è un messaggio che puoi mostrare all'utente al di fuori della normale UI dell'app. Image Asset Studio posiziona le icone delle notifiche nelle posizioni appropriate all'interno delle
directory res/drawable-density/
:
- Le icone per Android 2.2 (livello API 8) e versioni precedenti sono posizionate nelle directory
res/drawable-density/
. - Le icone per Android dalla versione 2.3 alla versione 2.3.7 (livelli API da 9 a 10) sono posizionate nelle directory
res/drawable-density-v9/
. - Le icone per Android 3 (livello API 11) e versioni successive vengono posizionate nelle directory
res/drawable-density-v11/
.
Se la tua app supporta Android dalla 2.3 alla 2.3.7 (livelli API da 9 a 10), Image Asset Studio genera una versione grigia dell'icona. Le versioni Android successive utilizzano l'icona bianca generata da Image Asset Studio.
Per ulteriori informazioni, consulta le sezioni Notifiche; Material Design delle notifiche; Notifiche, Modifiche ad Android 5.0; Notifiche, Android 4.4 e versioni precedenti; Icone della barra di stato, Android 3.0 e versioni precedenti.
Clip art
Image Asset Studio semplifica l'importazione delle icone di materiali Google nei formati VectorDrawable e PNG: è sufficiente selezionare un'icona da una finestra di dialogo. Per ulteriori informazioni, consulta la sezione Icone in materiale.
Immagini
Puoi importare immagini personalizzate e modificarle in base al tipo di icona. Image Asset Studio supporta i seguenti tipi di file: PNG (preferito), JPG (accettabile) e GIF (sconsigliato).
Stringhe di testo
Image Asset Studio ti consente di digitare una stringa di testo in diversi tipi di carattere e di posizionarla su un'icona. Converte l'icona basata su testo in file PNG per densità diverse. Puoi usare i caratteri installati sul computer.
Esegui Image Asset Studio
Per avviare Image Asset Studio:
- Nella finestra Progetto, seleziona la vista Android.
- Fai clic con il pulsante destro del mouse sulla cartella res e seleziona Nuovo > Asset immagine.
- Continua seguendo questi passaggi per:
- Se la tua app supporta Android 8.0, crea icone adattivo e legacy in Avvio applicazioni.
- Se la tua app supporta versioni precedenti ad Android 7.1, crea solo un'icona in Avvio applicazioni precedente.
- Crea una barra delle azioni o un'icona della scheda.
- Crea un'icona di notifica.
Creazione di icone in Avvio applicazioni adattive e precedenti
Nota: se la tua app supporta versioni non successive ad Android 7.1, segui le istruzioni per creare solo un'icona in Avvio applicazioni precedente.
Dopo aver aperto Image Asset Studio, puoi aggiungere le icone adattive e legacy seguendo questi passaggi:
- Nel campo Tipo di icona, seleziona Icone Avvio app (adattive e legacy).
- Nella scheda Livello di primo piano, seleziona un Tipo di asset, quindi specifica l'asset nel campo sottostante:
- Seleziona Immagine per specificare il percorso di un file immagine.
- Seleziona Clip Art per specificare un'immagine dal set di icone di material design.
- Seleziona Testo per specificare una stringa di testo e seleziona un carattere.
- Nella scheda Livello di sfondo, seleziona un Tipo di asset e specifica l'asset nel campo sottostante. Puoi selezionare un colore o specificare un'immagine da utilizzare come livello di sfondo.
- Nella scheda Legacy, rivedi le impostazioni predefinite e conferma di voler generare icone legacy, rotonde e del Google Play Store.
- Se vuoi, modifica le impostazioni di nome e visualizzazione di ciascuna delle schede Livello di primo piano e Livello di sfondo:
- Nome: se non vuoi utilizzare il nome predefinito, digitane uno nuovo. Se il nome della risorsa esiste già nel progetto, come indicato da un errore nella parte inferiore della procedura guidata, verrà sovrascritto. Il nome può contenere solo caratteri minuscoli, trattini bassi e cifre.
- Taglia: per regolare il margine tra l'immagine dell'icona e il bordo nell'asset di origine, seleziona Sì. Questa operazione rimuove lo spazio trasparente, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
- Colore: per modificare il colore di un'icona Clip art o Testo, fai clic sul campo. Nella finestra di dialogo Seleziona colore, specifica un colore e fai clic su Scegli. Il nuovo valore viene visualizzato nel campo.
- Ridimensiona: utilizza il dispositivo di scorrimento per specificare un fattore di ridimensionamento in percentuale per ridimensionare un'icona Immagine, Clip art o Testo. Questo controllo è disabilitato per il livello di sfondo quando specifichi un tipo di asset Colore.
- Tocca Avanti.
- Se vuoi, modifica la directory delle risorse: seleziona il set di origini delle risorse in cui vuoi aggiungere l'asset immagine: src/main/res, src/debug/res, src/release/res o in un set di origini personalizzato. Il set di origine principale si applica a tutte le varianti della build, inclusi il debug e la release. I set di origini di debug e release sostituiscono il set di origini principale e si applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire un nuovo set di origine, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per maggiori informazioni, consulta Configurare le varianti delle build.
- Fai clic su Fine. Image Asset Studio aggiunge le immagini alle cartelle mipmap per le diverse densità.
Visualizza l'anteprima delle icone delle app a tema
Android Studio ti consente di visualizzare l'anteprima dell'icona dell'app a tema e di verificare come si adatta alla colorazione dello sfondo dell'utente. Per visualizzare l'anteprima dell'icona dell'app a tema, apri il file launcher.xml
che definisce l'icona, quindi utilizza il selettore Modalità UI di sistema sulla barra degli strumenti per cambiare sfondo e vedere come reagisce l'icona.
Per scoprire di più su come creare icone delle app a tema, consulta Icone adattive.
Crea un'icona in Avvio applicazioni precedente
Nota : se la tua app supporta Android 8.0, segui le istruzioni per creare invece icone adattivo e legacy in Avvio applicazioni.
Dopo aver aperto Image Asset Studio, puoi aggiungere un'icona in Avvio applicazioni seguendo questi passaggi:
- Nel campo Tipo di icona, seleziona Icone Avvio app (solo versione precedente) .
- Seleziona un Tipo di asset e specifica l'asset nel campo sottostante:
- Fai clic sul pulsante nel campo Clip Art.
- Nel campo Percorso, specifica il percorso e il nome file dell'immagine. Fai clic su ... per utilizzare una finestra di dialogo.
- Nel campo Testo, digita una stringa di testo e seleziona un carattere.
- Se vuoi, modifica le impostazioni di nome e visualizzazione:
- Nome: se non vuoi utilizzare il nome predefinito, digitane uno nuovo. Se il nome della risorsa esiste già nel progetto, come indicato da un errore nella parte inferiore della procedura guidata, verrà sovrascritto. Il nome può contenere solo caratteri minuscoli, trattini bassi e cifre.
- Taglia: per regolare il margine tra la grafica dell'icona e il bordo nell'asset di origine, seleziona Sì. Questa operazione rimuove lo spazio trasparente, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
- Spaziatura interna: se vuoi regolare la spaziatura interna degli asset di origine su tutti e quattro i lati, sposta il dispositivo di scorrimento. Seleziona un valore compreso tra -10% e 50%. Se selezioni anche Taglia, il taglio viene eseguito prima.
- Primo piano: per modificare il colore di primo piano di un'icona di Clip Art o di Testo, fai clic sul campo. Nella finestra di dialogo Seleziona colore, specifica un colore e fai clic su Scegli. Il nuovo valore viene visualizzato nel campo.
- Sfondo: per modificare il colore dello sfondo, fai clic sul campo. Nella finestra di dialogo Seleziona colore, specifica un colore e fai clic su Scegli. Il nuovo valore viene visualizzato nel campo.
- Ridimensiona: per adattarla alle dimensioni dell'icona, seleziona Ritaglia o Riduci e adatta. Con la funzionalità di ritaglio, i bordi dell'immagine possono essere tagliati, mentre con la riduzione non li riduci. Se necessario, puoi regolare la spaziatura interna se l'asset di origine continua a non adattarsi.
- Forma: per posizionare uno sfondo dietro l'asset di origine, seleziona una forma: circolare, quadrata, verticale o orizzontale. Per uno sfondo trasparente, seleziona Nessuno.
- Effetto: se vuoi aggiungere un effetto orecchio di cane in alto a destra di una forma quadrata o rettangolare, seleziona Orecchio cane. In caso contrario, seleziona Nessuno.
Image Asset Studio posiziona l'icona in un quadrato trasparente in modo che venga applicata una spaziatura interna sui bordi. La spaziatura interna fornisce spazio adeguato per l'effetto icona ombra standard.
- Tocca Avanti.
- Facoltativamente, modifica la directory della risorsa:
- Directory Res: seleziona il set di origine delle risorse in cui vuoi aggiungere l'asset immagine: src/main/res, src/debug/res, src/release/res o un set di origine definito dall'utente. Il set di origine principale si applica a tutte le varianti della build, inclusi il debug e la release. I set di origini di debug e release sostituiscono il set di origini principale e si applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire un nuovo set di origine, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per maggiori informazioni, consulta Configurare le varianti delle build.
- Fai clic su Fine.
Nella finestra di dialogo Seleziona icona, seleziona un'icona del materiale e fai clic su OK.
L'icona viene visualizzata nell'area Asset di origine sul lato destro e nell'area di anteprima nella parte inferiore della procedura guidata.
L'area Directory di output mostra le immagini e le cartelle in cui verranno visualizzate nella visualizzazione File di progetto della finestra Progetto.
Image Asset Studio aggiunge le immagini alle cartelle mipmap per le diverse densità.
Crea una barra delle azioni o un'icona della scheda
Dopo aver aperto Image Asset Studio, puoi aggiungere una barra delle azioni o un'icona della scheda seguendo questi passaggi:
- Nel campo Tipo di icona, seleziona Barra delle azioni e Icone scheda.
- Seleziona un Tipo di asset e specifica l'asset nel campo sottostante:
- Fai clic sul pulsante nel campo Clip Art.
- Nel campo Percorso, specifica il percorso e il nome file dell'immagine. Fai clic su ... per utilizzare una finestra di dialogo.
- Nel campo Testo, digita una stringa di testo e seleziona un carattere.
- Se vuoi, modifica le opzioni di nome e visualizzazione:
- Nome: se non vuoi utilizzare il nome predefinito, digitane uno nuovo. Se il nome della risorsa esiste già nel progetto, come indicato da un errore nella parte inferiore della procedura guidata, verrà sovrascritto. Il nome può contenere solo caratteri minuscoli, trattini bassi e cifre.
- Taglia: per regolare il margine tra la grafica dell'icona e il bordo nell'asset di origine, seleziona Sì. Questa operazione rimuove lo spazio trasparente, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
- Spaziatura interna: se vuoi regolare la spaziatura interna degli asset di origine su tutti e quattro i lati, sposta il dispositivo di scorrimento. Seleziona un valore compreso tra -10% e 50%. Se selezioni anche Taglia, il taglio avviene prima.
- Tema: seleziona HOLO_Light o HOLO_DARK. In alternativa, per specificare un colore nella finestra di dialogo Seleziona colore, seleziona PERSONALIZZATO e fai clic sul campo Colore personalizzato.
Image Asset Studio crea l'icona all'interno di un quadrato trasparente in modo che venga applicata una spaziatura interna sui bordi. La spaziatura interna fornisce spazio adeguato per l'effetto icona ombra standard.
- Tocca Avanti.
- Facoltativamente, modifica la directory della risorsa:
- Directory Res: seleziona il set di origine delle risorse in cui vuoi aggiungere l'asset immagine: src/main/res, src/debug/res, src/release/res o un set di origine definito dall'utente. Il set di origine principale si applica a tutte le varianti della build, inclusi il debug e la release. I set di origini di debug e release sostituiscono il set di origini principale e si applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire un nuovo set di origine, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per maggiori informazioni, consulta Configurare le varianti delle build.
- Fai clic su Fine.
Nella finestra di dialogo Seleziona icona, seleziona un'icona del materiale e fai clic su OK.
L'icona viene visualizzata nell'area Asset di origine sul lato destro e nell'area di anteprima nella parte inferiore della procedura guidata.
L'area Directory di output mostra le immagini e le cartelle in cui verranno visualizzate nella visualizzazione File di progetto della finestra Progetto.
Image Asset Studio aggiunge le immagini nelle cartelle disegnabili per le diverse densità.
Crea un'icona di notifica
Dopo aver aperto Image Asset Studio, puoi aggiungere un'icona di notifica seguendo questi passaggi:
- Nel campo Tipo di icona, seleziona Icone di notifica.
- Seleziona un Tipo di asset e specifica l'asset nel campo sottostante:
- Fai clic sul pulsante nel campo Clip Art.
- Nel campo Percorso, specifica il percorso e il nome file dell'immagine. Fai clic su ... per utilizzare una finestra di dialogo.
- Nel campo Testo, digita una stringa di testo e seleziona un carattere.
- Se vuoi, modifica le opzioni di nome e visualizzazione:
- Nome: se non vuoi utilizzare il nome predefinito, digitane uno nuovo. Se il nome della risorsa esiste già nel progetto, come indicato da un errore nella parte inferiore della procedura guidata, verrà sovrascritto. Il nome può contenere solo caratteri minuscoli, trattini bassi e cifre.
- Taglia: per regolare il margine tra la grafica dell'icona e il bordo nell'asset di origine, seleziona Sì. Questa operazione rimuove lo spazio trasparente, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
- Spaziatura interna: se vuoi regolare la spaziatura interna degli asset di origine su tutti e quattro i lati, sposta il dispositivo di scorrimento. Seleziona un valore compreso tra -10% e 50%. Se selezioni anche Taglia, il taglio viene eseguito prima.
Image Asset Studio crea l'icona all'interno di un quadrato trasparente in modo che venga applicata una spaziatura interna sui bordi. La spaziatura interna fornisce spazio adeguato per l'effetto icona ombra standard.
- Tocca Avanti.
- Facoltativamente, modifica la directory della risorsa:
- Directory Res: seleziona il set di origine delle risorse in cui vuoi aggiungere l'asset immagine: src/main/res, src/debug/res, src/release/res o un set di origine definito dall'utente. Il set di origine principale si applica a tutte le varianti della build, inclusi il debug e la release. I set di origini di debug e release sostituiscono il set di origini principale e si applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire un nuovo set di origine, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per maggiori informazioni, consulta Configurare le varianti delle build.
- Fai clic su Fine.
Nella finestra di dialogo Seleziona icona, seleziona un'icona del materiale e fai clic su OK.
L'icona viene visualizzata nell'area Asset di origine sul lato destro e nell'area di anteprima nella parte inferiore della procedura guidata.
L'area Directory di output mostra le immagini e le cartelle in cui verranno visualizzate nella visualizzazione File di progetto della finestra Progetto.
Image Asset Studio aggiunge le immagini nelle cartelle disegnabili per le diverse densità e versioni.
Fai riferimento a una risorsa immagine nel codice con Views
Normalmente nel codice puoi fare riferimento a una risorsa immagine in modo generico e, quando la tua app è in esecuzione, l'immagine corrispondente viene visualizzata automaticamente a seconda del dispositivo:
- Nella maggior parte dei casi, puoi fare riferimento alle risorse immagine come
@drawable
nel codice XML oDrawable
nel codice Java.
Ad esempio, il seguente codice XML di layout mostra il disegno in un ImageView:
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/myimage" />
Il seguente codice Java recupera l'immagine come
Drawable
:
Kotlin
val drawable = resources.getDrawable(R.drawable.myimage, theme)
Java
Resources res = getResources(); Drawable drawable = res.getDrawable(R.drawable.myimage, getTheme());
Il metodo getResources()
risiede nella classe Context
e si applica a oggetti UI quali attività, frammenti, layout, viste e così via.
app:srcCompat
. Ecco alcuni esempi:<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" app:srcCompat="@drawable/myimage" />
Puoi accedere alle risorse immagine solo dal thread principale.
Dopo che una risorsa immagine si trova nella directory res/
del progetto, puoi farvi riferimento dal codice Java o dal layout XML utilizzando il relativo ID risorsa.
Il seguente codice Java imposta un componente ImageView in modo da utilizzare la risorsa drawable/myimage.png
:
Kotlin
findViewById<ImageView>(R.id.myimageview).apply { setImageResource(R.drawable.myimage) }
Java
ImageView imageView = (ImageView) findViewById(R.id.myimageview); imageView.setImageResource(R.drawable.myimage);
Per ulteriori informazioni, consulta Accesso alle risorse.
Eliminare un'icona da un progetto
Per rimuovere un'icona da un progetto:
- Nella finestra Progetto, seleziona la vista Android.
- Espandi la cartella res/mipmap per un'icona in Avvio applicazioni o la cartella res/drawable per altri tipi di icone.
- Individua una sottocartella con il nome dell'icona che vuoi eliminare.
- Seleziona la cartella e premi il tasto Elimina.
- Facoltativamente, seleziona le opzioni per trovare la posizione in cui viene utilizzata l'icona nel progetto e fai clic su OK.
- Seleziona Crea > Rimuovi progetto.
- Se necessario, correggi eventuali errori rimanenti dovuti alle parti di codice che fanno riferimento alla risorsa.
Questa cartella contiene l'icona con densità diverse.
In alternativa, seleziona Modifica > Elimina. In alternativa, fai clic con il pulsante destro del mouse sul file e seleziona Elimina.
Viene visualizzata la finestra di dialogo Eliminazione sicura.
Android Studio elimina i file dal progetto e dal Drive. Tuttavia, se hai scelto di cercare posizioni nel progetto in cui vengono utilizzati i file e sono stati rilevati alcuni usi, puoi visualizzarli e decidere se eliminarli. Devi eliminare o sostituire questi riferimenti per poter compilare correttamente il progetto.
Android Studio rimuove tutti i file immagine generati corrispondenti alla risorsa immagine eliminata. Li rimuove dal progetto e dal Drive.
Android Studio evidenzia questi errori nel codice. Dopo aver rimosso tutti i riferimenti dal codice, puoi creare di nuovo il progetto correttamente.