Crea icone delle app

Le icone aiutano gli utenti a identificare la tua app e le azioni al suo interno. Puoi accedere alla suite Icone Material e aggiungile direttamente alla tua app con Compose. Per creare icone o icone personalizzate per per la tua app con Visualizzazioni, Android Studio offre Image Asset Studio.

Aggiungere icone all'interno dell'app con Compose

Con Compose, puoi importare la raccolta di Material di Compose o la raccolta di Material 3 di Compose per accedere a qualsiasi icona Material. Dopodiché usa il componibile Icon per aggiungere icone alla tua app. La Le icone Material sono particolarmente utili per le icone della barra delle azioni, le icone delle schede o le icone di notifica. Per maggiori informazioni le informazioni, vedi Icone Material.

Se devi creare icone personalizzate, ad esempio l'icona di Avvio applicazioni, utilizza Image Asset Studio. Per le icone Avvio app, la AndroidManifest.xml deve fare riferimento alla posizione mipmap/. Image Asset Studio aggiunge questo codice automaticamente. Il seguente codice del file manifest fa riferimento 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 la tua app icone da icone dei materiali, immagini personalizzate e stringhe di testo. Genera un insieme di icone con la risoluzione appropriata per ogni densità di pixel supportata dalla tua app. Image Asset Studio inserisce le icone appena generate in cartelle specifiche per la densità nella directory res/ del progetto. In fase di esecuzione, Android utilizza in base alla densità dello schermo del dispositivo su cui è in esecuzione l'app.

Image Asset Studio consente di generare i seguenti tipi di icone:

  • Icone in Avvio app
  • Icone della barra delle azioni e della scheda
  • Icone di notifica

Le seguenti sezioni descrivono i tipi di icone che puoi creare e gli input di immagini e testo che puoi utilizzare.

Icone di Avvio app adattive e legacy

Un'icona in Avvio applicazioni è un'immagine che rappresenta la tua app agli utenti. Può:

  • Comparire nell'elenco di app installate su un dispositivo e nella schermata Home.
  • Rappresentare le scorciatoie nella tua app (ad esempio, un'icona di scorciatoia per un contatto che consente di visualizzare le informazioni dettagliate del contatto).
  • Essere utilizzata da app Avvio app.
  • Aiuta gli utenti a trovare la tua app su Google Play.

Le icone del programma di avvio adattabile possono essere visualizzate in una serie di 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 utilizzando Image Asset Studio. Image Asset Studio genera anteprime di un'icona adattabile in forme circolari, ovali, quadrate arrotondate e quadrate, nonché un'anteprima con sbordatura completa dell'icona. Image Asset Studio genera inoltre versioni legacy, rotonde e di Google Play Store anteprime dell'icona. Un'icona in Avvio applicazioni precedente è un'immagine che rappresenta la tua app sul schermata Home e nella finestra Avvio app. Le icone di avvio applicazioni precedenti sono destinate all'uso sui dispositivi con Android 7.1 (livello API 25) o versioni precedenti, che non supportano le icone adattive e non visualizzano forme diverse nei modelli di dispositivi.

Image Asset Studio posiziona le icone nelle posizioni appropriate all'interno res/mipmap-density/ directory. Crea anche un'immagine di 512 x 512 pixel che sia appropriato per il Google Play Store.

Ti consigliamo di utilizzare lo stile Material Design per le icone in Avvio applicazioni, anche se supporti versioni precedenti di Android.

Per ulteriori informazioni, consulta Icone del programma di avvio adattabili e Iconhe dei prodotti - Material Design.

Icone della barra delle azioni e della scheda

Le icone della barra delle azioni sono elementi grafici posizionati nella barra delle azioni e che rappresentano singoli elementi. attività. Per ulteriori informazioni, consulta Aggiunta e gestione delle azioni, Barra delle app - Material Design e Design della barra delle azioni.

Le icone delle schede sono elementi grafici utilizzati per rappresentare le singole schede in un'interfaccia con più schede. Ogni icona della scheda ha due stati: deselezionato e selezionato. Per ulteriori informazioni, consulta Creare visualizzazioni scorrevoli con schede e Schede - Material Design.

Image Asset Studio posiziona le icone nelle posizioni appropriate all'interno res/drawable-density/ .

Ti consigliamo di utilizzare lo stile material design per la barra delle azioni e delle schede, anche se supporti versioni precedenti di Android. Utilizza appcompat e altre librerie di supporto per fornire l'interfaccia utente in Material Design alle versioni precedenti della piattaforma.

In alternativa a Image Asset Studio, puoi utilizzare Vector Asset Studio per creare la barra delle azioni e delle schede. I disegni vettoriali sono adatti per icone semplici e possono ridurre le dimensioni del tuo dell'app.

Icone di notifica

Una notifica è un messaggio che puoi mostrare all'utente al di fuori della normale UI della tua app. Image Asset Studio posiziona le icone di notifica nelle posizioni appropriate nelle directory res/drawable-density/:

  • Icone per Android 2.2 (livello API 8) e inferiori sono posizionati nelle directory res/drawable-density/.
  • Le icone per Android dalla versione 2.3 alla 2.3.7 (livello API da 9 a 10) sono res/drawable-density-v9/ directory.
  • Icone per Android 3 (livello API 11) e superiori vengono posizionate in res/drawable-density-v11/ directory.

Se la tua app supporta Android dalla versione 2.3 alla versione 2.3.7 (livelli API da 9 a 10), Image Asset Studio genera un'eccezione una versione grigia dell'icona. Le versioni di Android successive utilizzano l'icona bianca che Image Asset Studio generato.

Vedi Notifiche. Notifiche Material Design; Notifiche, modifiche ad Android 5.0; Notifiche, Android 4.4 e versioni precedenti; e Icone della barra di stato, Android 3.0 e versioni precedenti per ulteriori informazioni.

Clip art

Image Asset Studio ti consente di importare facilmente le icone Material Design di Google nei formati VectorDrawable e PNG: seleziona un'icona da una finestra di dialogo. Per ulteriori informazioni, consulta Material Icons.

Immagini

Puoi importare le tue immagini e regolarle 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 consente di digitare una stringa di testo in diversi caratteri e di posizionarla su un'icona. Converte l'icona basata su testo in file PNG per densità diverse. Puoi utilizzare i caratteri installati sul tuo computer.

Esegui Image Asset Studio

Per avviare Image Asset Studio:

  1. Nella finestra Progetto, seleziona la Visualizzazione Android.
  2. Fai clic con il tasto destro del mouse sulla cartella res e seleziona Nuovo > Asset immagine.

    La procedura guidata adattiva e precedente in Image Asset Studio.

  3. Continua seguendo i passaggi per:

Creare icone di Avvio applicazioni adattive e legacy

Dopo aver aperto Image Asset Studio, puoi aggiungere icone adattabili e precedenti seguendo questi passaggi:

  1. Nel campo Tipo di icona, seleziona Icone Avvio app (adattivi e legacy).
  2. Nella scheda Livello in primo piano, seleziona un Tipo di asset e poi specifica la risorsa nel campo sottostante:
    • Seleziona Immagine per specificare il percorso di un file immagine.
    • Seleziona Clip art per specificare un'immagine dall'insieme di icone di Material Design.
    • Seleziona Testo per specificare una stringa di testo e seleziona un carattere.
  3. Nella scheda Livello di sfondo, seleziona un Tipo di asset e poi specifica la risorsa nel campo sottostante. Puoi selezionare un colore o specificare un'immagine da utilizzare come livello di sfondo.
  4. Nella scheda Opzioni, controlla le impostazioni predefinite e conferma di voler generare icone precedenti, rotonde e del Google Play Store.
  5. Se vuoi, modifica il nome e le impostazioni di visualizzazione per ciascuna delle schede Livello primo piano e Livello sfondo:
    • Nome: se non vuoi utilizzare il nome predefinito, digita un nuovo nome. Se questo nome risorsa esiste già nel progetto, come indicato da un errore in fondo alla procedura guidata, viene sovrascritta. 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 . Questa operazione rimuove e trasparente, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
    • Colore: per modificare il colore di un'illustrazione clip o di un'icona 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 in campo.
    • Ridimensiona: utilizza il cursore per specificare un fattore di ridimensionamento in percentuale. per ridimensionare un'icona Immagine, Clip Art o Testo. Questo controllo è disattivato per il livello di sfondo quando specifichi un tipo di risorsa Colore.
  6. Fai clic su Avanti.
  7. Facoltativamente, modifica la directory delle risorse selezionando il set di origini delle risorse. in cui vuoi aggiungere l'asset immagine: src/main/res, src/debug/res, src/release/res o un set di sorgenti personalizzato. Il set di origini principali si applica a tutte le varianti di build, tra cui debug e . I set di origine di debug e release sostituiscono il set di origine 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 origini, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un insieme di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per maggiori informazioni le informazioni, vedi Configura Varianti della build.
  8. Fai clic su Fine. Image Asset Studio aggiunge le immagini alle directory mipmap per le diverse densità.

Visualizza in anteprima le icone delle app a tema

Android Studio ti consente di visualizzare l'anteprima l'icona dell'app a tema e testa come si adatta alla colorazione dello sfondo dell'utente. Per visualizzare l'anteprima dell'icona dell'app themed, apri il file launcher.xml che la definisce, quindi utilizza il selettore Modalità UI del sistema nella 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.

Selettore Modalità UI di sistema.

Visualizza l'anteprima delle icone delle app a tema su diversi sfondi.

Creare un'icona per la barra delle app o la scheda

Dopo aver aperto Image Asset Studio, puoi aggiungere un'icona della barra delle azioni o della scheda seguendo questi passaggi:

  1. Nel campo Tipo di icona, seleziona Barra delle app e icone delle schede.
  2. Seleziona un Tipo di asset, poi specifica l'asset nel campo sottostante:
    • Nel campo Clip art, fai clic sul pulsante.
    • Nella finestra di dialogo Seleziona icona, seleziona un'icona del materiale e fai clic su OK.

    • Nel campo Percorso, specifica il percorso e il nome del file dell'immagine. Fai clic su ... per utilizzare una finestra di dialogo.
    • Nel campo Testo, digita una stringa di testo e seleziona un carattere.

    L'icona viene visualizzata nell'area Asset sorgente a destra e nei nella parte inferiore della procedura guidata.

  3. Se vuoi, puoi modificare il nome e le opzioni di 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 in in fondo alla procedura guidata, verranno sovrascritte. Il nome può contenere lettere minuscole solo caratteri, trattini bassi e cifre.
    • Taglia: per regolare il margine tra grafica dell'icona e bordo nella risorsa di origine, seleziona . Questa operazione rimuove gli spazi trasparenti, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
    • Spaziatura interna: se vuoi regolare spaziatura interna degli asset di origine su tutti e quattro i lati, sposta il cursore. Seleziona un valore compreso tra -10% e 50%. Se selezioni anche Taglia, il taglio avviene per primo.
    • Tema - Seleziona HOLO_LIGHT o HOLO_DARK. In alternativa, per specificare un colore nella finestra di dialogo Seleziona colore, seleziona PERSONALIZZATO, quindi fai clic sul campo Colore personalizzato.

    Image Asset Studio crea l'icona all'interno di un quadrato trasparente con spaziatura interna sui bordi. La spaziatura interna fornisce spazio adeguato per l'effetto standard dell'icona ombra.

  4. Fai clic su Avanti.
  5. Facoltativamente, modifica la directory delle risorse:
    • Res Directory (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 un set di origini definito dall'utente. Il set di origine principale si applica a tutte le varianti di compilazione, tra cui debugging e release. I set di origini di debug e di rilascio sostituiscono il set di origini principale e applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire un nuovo insieme di origini, seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un insieme di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per ulteriori informazioni, vedi Configura le varianti della build.

    L'area Directory di output mostra le immagini e le cartelle in cui verranno visualizzate nella visualizzazione File del progetto della finestra Progetto.

  6. Fai clic su Fine.
  7. Image Asset Studio aggiunge le immagini nelle cartelle drawable per le diverse densità.

Crea un'icona di notifica

Dopo aver aperto Image Asset Studio, puoi aggiungere un'icona di notifica procedendo nel seguente modo:

  1. Nel campo Tipo di icona, seleziona Icone di notifica.
  2. Seleziona un Tipo di risorsa e poi specifica la risorsa nel campo sottostante:
    • Nel campo Clip art, fai clic sul pulsante.
    • Nella finestra di dialogo Seleziona icona, seleziona un'icona del materiale e fai clic su OK.

    • Nel campo Percorso, specifica il percorso e il nome del file dell'immagine. Fai clic su ... per utilizzare una finestra di dialogo.
    • Nel campo Testo, digita una stringa di testo e seleziona un carattere.

    L'icona viene visualizzata nell'area Asset sorgente a destra e nei nella parte inferiore della procedura guidata.

  3. Se vuoi, puoi modificare il nome e le opzioni di 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 in in fondo alla procedura guidata, verranno sovrascritte. Il nome può contenere lettere minuscole solo caratteri, trattini bassi e cifre.
    • Taglia: per regolare il margine tra grafica dell'icona e bordo nella risorsa di origine, seleziona . Questa operazione rimuove gli spazi trasparenti, mantenendo le proporzioni. Per lasciare invariato l'asset di origine, seleziona No.
    • Spaziatura: se vuoi regolare la spaziatura dell'asset di origine su tutti e quattro i lati, sposta il cursore. Seleziona un valore compreso tra -10% e 50%. Se Seleziona Taglia, il taglio avviene per primo.

    Image Asset Studio crea l'icona all'interno di un quadrato trasparente con spaziatura interna sui bordi. La spaziatura interna fornisce spazio adeguato per l'effetto standard dell'icona ombra.

  4. Fai clic su Avanti.
  5. Facoltativamente, modifica la directory delle risorse:
    • Res Directory (Directory delle risorse): seleziona il set di origine della risorsa 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 di compilazione, tra cui debugging e release. I set di origine di debug e release sostituiscono il set di origine principale e si applicano a una versione di una build. L'insieme di origini di debug è destinato solo al debug. Per definire una nuova origine quindi seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un insieme di origini beta e creare una versione di un'icona che includa il testo "BETA" nell'angolo in basso a destra. Per ulteriori informazioni, consulta Configurare le varianti di build.

    L'area Directory di output mostra le immagini e le cartelle in cui appariranno Visualizzazione File di progetto della Finestra Progetto.

  6. Fai clic su Fine.
  7. Image Asset Studio aggiunge le immagini nelle cartelle drawable per le diverse densità e versioni.

Fai riferimento a una risorsa immagine nel codice con Visualizzazioni

Di solito puoi fare riferimento a una risorsa immagine in modo generico nel codice e, quando l'app viene eseguita, 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 o Drawable nel codice Java.
  • Ad esempio, il seguente codice XML di layout mostra il drawable in un Visualizzazione immagine:

    <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());

    getResources() risiede nel file Context che si applica agli oggetti UI, come attività, frammenti, layout, visualizzazioni e così via.

  • Se la tua app utilizza Support Library, puoi fare riferimento a una risorsa immagine nel codice XML con un app:srcCompat. Ad esempio:
  • <ImageView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        app:srcCompat="@drawable/myimage" />

Puoi accedere alle risorse delle immagini solo dal thread principale.

Dopo aver creato una risorsa immagine 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 ImageView per 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:

  1. Nella finestra Progetto, seleziona il Vista Android.
  2. Espandi la cartella res/mipmap per trovare un'icona in Avvio applicazioni. res/drawable per altri tipi di icone.
  3. Individua una sottocartella con il nome dell'icona che vuoi eliminare.
  4. Questa cartella contiene l'icona in diverse densità.

  5. Seleziona la cartella e premi il tasto Elimina.
  6. In alternativa, seleziona Modifica > Elimina. In alternativa, fai clic con il tasto destro del mouse sul file e seleziona Elimina.

    Viene visualizzata la finestra di dialogo Eliminazione sicura.

  7. Se vuoi, seleziona le opzioni per trovare dove viene utilizzata l'icona nel progetto e fai clic su OK.
  8. Android Studio elimina i file dal progetto e dal drive. Tuttavia, se scegli di cercare per le posizioni del progetto in cui vengono utilizzati i file e in cui vengono rilevati alcuni utilizzi, puoi visualizzarli decideranno se eliminarli. Devi eliminare o sostituire questi riferimenti per poter la compilazione del progetto.

  9. Seleziona Compila > Pulisci progetto.
  10. Android Studio rimuove tutti i file immagine generati corrispondenti alla risorsa immagine eliminata. e vengono rimossi dal progetto e dal Drive.

  11. Se necessario, correggi gli eventuali errori rimanenti dovuti a parti del codice che fanno riferimento alla risorsa.
  12. Android Studio evidenzia questi errori nel tuo codice. Dopo aver rimosso tutti i riferimenti dal codice, puoi compilare di nuovo il progetto.