Importe iconos de diseño de materiales en un proyecto de Android

143

¿Existe una manera fácil de importar todos los íconos del repositorio de íconos de Material Design en un proyecto de Android sin el riesgo de hacerlo manualmente?

icons material-design Ivan Aranibar
fuente

Respuestas:

358

Echa un vistazo a Vector Asset Studio

Siga estos pasos para iniciar Vector Asset Studio:

  • En Android Studio, abra un proyecto de aplicación de Android.
  • En la ventana Proyecto, seleccione la vista de Android.
  • Haga clic con el botón derecho en la carpeta res y seleccione Nuevo> Activo vectorial.

Después de abrir Vector Asset Studio, puede agregar un icono de material de la siguiente manera:

  • Seleccione "Icono de material" (haciendo clic en el Clip Art: ICONO)
  • Haga clic en elegir
  • Seleccione un icono de material
mpkuth
fuente
24
¡Esta respuesta es asombrosa! No solo puede elegir el ícono de diseño de material que ya está incluido en Android Studio (sin complementos adicionales) sino que también obtendrá VectorDrawable y (espere ...): "Si su nivel mínimo de API se establece en una de estas API niveles, Vector Asset Studio también dirige a Gradle a generar imágenes rasterizadas del vector dibujables para compatibilidad con versiones anteriores "
lenrok258
55
Incluso puede cambiar el color en el archivo xml y se generarán nuevos png durante la compilación (en app / build / generate / res / pngs / debug ). ¡Me gusta! :-)
lenrok258
2
¡Vota por esta respuesta! En caso de que su icono no aparezca en el "Icono de material" seleccionado, puede descargarlo de los Iconos de material , si elige el formato SVG, seleccione Archivo SVG local en Vector Asset y genere el archivo xml para el icono. Si elige el formato PNG, haga clic con el botón derecho en res-> new Image Asset-> select Image-> in Path: elija la imagen grande (xxxhdpi) y genere el png para cada densidad.
NOE
11
A partir de Android Studio 2.2 Preview 5, ya no existe el botón "Elegir" en Vector Asset Studio, pero hay que hacer clic en la pequeña representación del icono (debajo del nombre). Me tomó un tiempo entender eso ...
balu
2
reciente vector asset studio tiene un tipo de imágenes prediseñadas en lugar de un icono de material, haga clic en el icono de Android a continuación para elegir su icono
Gigarthan
23

Puede usar este nuevo complemento para Android Studio Android Material Design Icon Generator Plugin para ayudarlo a trabajar con estos iconos de material proporcionados por Google: Google material-design-icons

Ouss StinGray
fuente
1
Lo he instalado, pero ¿cómo lo uso?
gldraphael
1
@gldraphael: una vez instalado, seleccione "Archivo" - "Nuevo" - "Icono de diseño de material". Seleccione un tamaño de 48dp para asegurarse de que cada uno de los archivos generados tenga la altura / anchura estándar de 48, 72, 96, 144 y 192 píxeles. Por supuesto, seleccione un tamaño dp más pequeño si es necesario.
Martyn Davis
2
@MartynDavis gracias. Aunque lo encontré. Lo que más me gusta es el hecho de que también puedo elegir el color.
gldraphael
15

En la carpeta drawable> right click> new> vector asset, a continuación, haga clic en el icono:

Las capturas de pantalla de Android Studio muestran un lugar no obvio donde hacer clic

Valle
fuente
6

Aquí hay un script que clona el repositorio github de los íconos de diseño de materiales en

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

y crea un índice de todos los archivos. También copia los archivos svg a subdirectorios por categoría. Puede usar esto como base para copiar los archivos que le interesan en su proyecto, simplemente modifique la declaración find y cp copy a su gusto. Si, por ejemplo, necesita los png en un determinado tamaño, están en directorios vecinos y debe modificar el comando de buscar y copiar en consecuencia.

ingrese la descripción de la imagen aquí

#!/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
fuente
1
Dulce guión. Como este es un caso de uso desechable para ese repositorio, sugiera cambiar a git clone --depth = 1 para obtener un clon superficial. Descargas un poco más rápidas.
mbac32768
1

Encontré este enlace útil para mí.

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

la implementación de gradle está disponible

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

Después de agregar la dependencia de Gradle, puede crear un elemento de menú de esta manera.

<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
fuente