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 Scrivi la raccolta Material oppure Componi la raccolta Material 3 per accedere icone 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 ulteriori informazioni le informazioni, vedi Icone Material.

Se devi creare icone personalizzate, ad esempio l'icona in 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 una serie di icone alla risoluzione appropriata. per ogni pixel standard supportata dalla tua app. Image Asset Studio posiziona le icone appena generate in cartelle specifiche relative alla densità sotto i Directory res/ nel 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 di 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 scorciatoie nell'app (ad esempio, un'icona di scorciatoia contatto che apre le informazioni dettagliate di un contatto).
  • Essere utilizzata da app Avvio app.
  • Aiuta gli utenti a trovare la tua app su Google Play.

Le icone Avvio app adattive possono essere visualizzate in una varietà di forme su diversi modelli di dispositivi e sono disponibile in Android 8.0 (livello API 26) e versioni successive. Android Studio 3.0 introduce il supporto per creando icone adattive usando Image Asset Studio. Image Asset Studio genera l'anteprima di un icona adattiva in cerchio, scoiattolo, quadrato arrotondato e forme quadrate, nonché al vivo 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.

Vedi Icone di Avvio app adattivo e . Product Icons - Material Design per saperne di più.

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à. Consulta la sezione Aggiunta e gestione di azioni. Barra delle app - Material Design Design della barra delle azioni per ulteriori informazioni.

Le icone delle schede sono elementi grafici utilizzati per rappresentare singole schede in un basata su più schede. Ogni icona della scheda ha due stati: deselezionato e selezionato. Consulta la sezione Creare visualizzazioni di scorrimento con le schede e Schede - Material Design per ulteriori informazioni.

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. Usa appcompat e altro librerie di supporto per caricare la UI material design sulle 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 dell'app. Image Asset Studio posiziona le icone delle notifiche nelle posizioni appropriate all'interno res/drawable-density/ directory:

  • 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 semplifica l'importazione delle icone dei materiali Google in VectorDrawable e Formati PNG: seleziona un'icona in una finestra di dialogo. Per ulteriori informazioni, vedi Icone del Material.

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. L'icona di testo viene convertita in file PNG per densità diverse. Puoi usare i caratteri che sul tuo computer.

Esegui Image Asset Studio

Per avviare Image Asset Studio:

  1. Nella finestra Progetto, seleziona il Vista 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:

Creazione di icone adattive e Avvio app precedenti

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

  1. Nel campo Tipo di icona, seleziona Icone Avvio app (adattivo e legacy).
  2. Nella scheda Livello 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' set di icone di Material Design.
    • Seleziona Testo per specificare una stringa di testo e selezionare 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 oppure specificare un'immagine da utilizzare come livello di sfondo.
  4. Nella scheda Legacy, rivedi le impostazioni predefinite e conferma che vuoi per generare icone legacy, rotonde e del Google Play Store.
  5. Se vuoi, puoi modificare il nome e le impostazioni di visualizzazione di ogni Schede Livello primo piano e Livello di sfondo:
      .
    • Nome: se non vuoi utilizzare il nome predefinito, digitane uno 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ò deve contenere solo caratteri minuscoli, trattini bassi e numeri.
    • 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 uscire dalla asset di origine invariato, seleziona No.
    • Colore. Per cambiare il colore di una Clip art o Testo, fai clic sul campo. Nella finestra di dialogo Seleziona colore, specifica un colore, quindi 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 è disabilitato per il livello di sfondo quando specifichi Tipo di asset 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 . Gli insiemi delle origini di debug e di rilascio 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 origini, 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 include il testo "BETA" nell'angolo in basso a destra. Per ulteriori informazioni le informazioni, vedi Configura Varianti della build.
  8. Fai clic su Fine. Image Asset Studio aggiunge le immagini al file 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'app a tema apri il file launcher.xml che definisce l'icona, quindi usa Selettore della 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.

Selettore Modalità UI di sistema.
di Gemini Advanced.
.
Visualizza l'anteprima delle icone delle app a tema su diversi sfondi.

Crea una barra delle azioni o un'icona di scheda

Dopo aver aperto Image Asset Studio, puoi aggiungere una barra delle azioni o un'icona della scheda. procedendo nel seguente modo:

  1. Nel campo Tipo di icona, seleziona Barra delle azioni e Icone della scheda.
  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 lo spazio trasparente, 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: seleziona il set di origini delle risorse in cui vuoi aggiungere la directory asset immagine: src/main/res, src/debug/res, src/release/res, o un insieme di origini definito dall'utente. Il set di origini principali si applica a tutte le varianti della build, tra cui eseguire il debug e il rilascio. 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 una nuova origine quindi seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di sorgenti beta e creare un versione di un'icona che include 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 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à.

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 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 lo spazio trasparente, conservando le proporzioni. Per uscire dall'asset di origine invariato, 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 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: seleziona il set di origini delle risorse in cui vuoi aggiungere la directory asset immagine: src/main/res, src/debug/res, src/release/res, o un insieme di origini definito dall'utente. Il set di origini principali si applica a tutte le varianti della build, tra cui eseguire il debug e il rilascio. 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 una nuova origine quindi seleziona File > Struttura del progetto > app > Tipi di build. Ad esempio, puoi definire un set di sorgenti beta e creare un versione di un'icona che include 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 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

Normalmente puoi fare riferimento a una risorsa immagine in modo generico nel codice e quando viene eseguita l'app, l'immagine corrispondente viene visualizzata automaticamente a seconda dispositivo:

  • Nella maggior parte dei casi, puoi fare riferimento alle risorse immagine come @drawable nel codice XML oppure Drawable con 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 per le immagini nella directory res/ del progetto, puoi farvi riferimento dal codice Java o dal layout XML utilizzando l'ID risorsa. Il seguente codice Java imposta un valore ImageView 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);

Consulta Accesso alle risorse per ulteriori informazioni.

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 con densità diverse.

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

    Viene visualizzata la finestra di dialogo Eliminazione sicura.

  7. Facoltativamente, seleziona le opzioni per sapere 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 Crea > 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 di codice che fanno riferimento risorsa.
  12. Android Studio evidenzia questi errori nel tuo codice. Dopo aver rimosso tutti i riferimenti da il tuo codice, puoi creare di nuovo il progetto.