Importa le icone del design dei materiali in un progetto Android

143

Esiste un modo semplice per importare tutte le icone del repository di icone Material Design in un progetto Android senza il rischio di farlo manualmente?

icons material-design

— Ivan Aranibar
fonte

358

Dai un'occhiata a Vector Asset Studio

Seguire questi passaggi per avviare Vector Asset Studio:

In Android Studio, apri un progetto di app Android.

Nella finestra Progetto, selezionare la vista Android.

Fare clic con il tasto destro del mouse sulla cartella res e selezionare Nuovo> Asset vettoriale.

Dopo aver aperto Vector Asset Studio, è possibile aggiungere un'icona materiale come segue:

Seleziona "Icona materiale" (facendo clic sulla ClipArt: ICONA)

Fai clic su Scegli

Seleziona un'icona materiale

— mpkuth
fonte

24

Questa risposta è fantastica! Non solo puoi scegliere l'icona di progettazione del materiale che è già inclusa in Android Studio (senza plug-in aggiuntivi) ma otterrai anche VectorDrawable e (attendi ...): "Se il tuo livello minimo di API è impostato su una di queste API livelli, Vector Asset Studio dirige anche Gradle a generare immagini raster del disegno vettoriale per compatibilità con le versioni precedenti "

— lenrok258,

5

Puoi anche cambiare il colore nel file xml e i nuovi png verranno generati durante la compilazione (in app / build / generate / res / pngs / debug ). Mi piace! :-)

— lenrok258,

2

Vota per questa risposta! Nel caso in cui la tua icona non venga visualizzata in "Icona materiale", puoi scaricarla da Icone materiale , se scegli il formato SVG, seleziona File SVG locale in Risorse vettoriali e genera il file XML per l'icona. Se scegli il formato PNG, fai clic con il tasto destro in res-> new Image Asset-> seleziona Image-> in Path: scegli l'immagine grande (xxxhdpi) e genera il png per ogni densità.

— no,

11

A partire da Android Studio 2.2 Preview 5, non esiste più il pulsante "Scegli" in Vector Asset Studio ma è necessario fare clic sulla piccola rappresentazione dell'icona (sotto il nome). Mi ci è

— voluto

2

un recente studio di risorse vettoriali ha un tipo di clip art invece dell'icona materiale, fai clic sull'icona Android qui sotto per scegliere la tua icona

— Gigarthan

23

Puoi utilizzare questo nuovo plug-in per Android Studio Plug-in Generatore di icone per la progettazione di materiali Android per aiutarti a lavorare con queste icone di materiali fornite da Google: Google material-design-icons

— Ouss StinGray
fonte

1

L'ho installato, ma come lo uso?

— Gldraphael,

1

@gldraphael - Una volta installato, seleziona "File" - "Nuovo" - "Icona del design del materiale". Seleziona una dimensione di 48dp per assicurarti che ciascuno dei file generati abbia l'altezza / larghezza standard di 48, 72, 96, 144 e 192 pixel. Ovviamente selezionare una dimensione dp più piccola, se necessario.

— Martyn Davis,

2

@MartynDavis grazie. L'ho trovato però. Quello che mi piace di più è il fatto che posso scegliere anche il colore.

— gldraphael,

15

Sulla cartella drawable> right click> new> vector asset, quindi fare clic sull'icona:

— vallata
fonte

6

Ecco una sceneggiatura che clona il repository github delle icone di design dei materiali su

https://github.com/google/material-design-icons

e crea un indice di tutti i file. Copia anche i file svg in sottodirectory per categoria. Puoi usarlo come base per copiare i file che ti interessano nel tuo progetto - basta modificare l'istruzione find e cp copy a tuo piacimento. Se ad esempio hai bisogno che i png abbiano una certa dimensione, si trovano in directory vicine e devi modificare di conseguenza il comando find and copy.

#!/bin/bash
# WF 2016-06-04
# get google material design icons
# see http://stackoverflow.com/questions/28684759/import-material-design-icons-into-an-android-project
tmp=/tmp/icons
index=$tmp/index.html
mkdir -p $tmp
cd $tmp
if [ ! -d material-design-icons ]
then
  git clone https://github.com/google/material-design-icons
fi
cat << EOF > $index
<html>
  <head>
    <head>
    <body>
      <h1>Google Material Design Icons</h1>
EOF
for icon in `find . -name *.svg | grep production | grep 48`
do
    svg=`basename $icon .svg`
    category=`echo $icon | cut -f3 -d '/'`
    echo $category $svg.svg
    mkdir -p $tmp/$category
    cp $icon $tmp/$category
    echo "    <img src='"$icon"' title='"$category $svg"' >" >> $index
done
cat << EOF >> $index
  </body>
</html>
EOF

— Wolfgang Fahl
fonte

1

Sceneggiatura dolce. Dato che si tratta di un caso d'uso usa e getta per quel repository, suggerisci di passare a clone git --depth = 1 per ottenere un clone superficiale. Download un po 'più veloce.

— mbac32768,

1

Ho trovato questo link utile per me.

https://dev.materialdesignicons.com/getting-started/android

implementazione gradle è disponibile

dependencies {
    implementation 'net.steamcrafted:materialiconlib:1.1.5'
}

Dopo aver aggiunto la dipendenza gradle, è possibile creare questa voce di menu in questo modo.

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto" <!-- important, you'll have to include this to use the custom xml attributes -->
    xmlns:tools="http://schemas.android.com/tools" >

    <!-- example of a menu item with an icon -->
    <item
        android:title="Disable Wifi"
        app:showAsAction="always"
        app:materialIcon="wifi_off" <!-- This sets the icon, HAS AUTOCOMPLETE ;) -->
        app:materialIconColor="#FE0000" <!-- Sets the icon color -->
    />

</menu>

— Naveed Jamali
fonte