Malzeme tasarım simgelerini bir android projesine aktarın


144

Materyal Tasarımı simgeler havuzunun tüm simgelerini manuel olarak yapma tehlikesi olmadan bir android projesine içe aktarmanın kolay bir yolu var mı?

Yanıtlar:


358

Vector Asset Studio'ya bir göz atın

Vector Asset Studio'yu başlatmak için şu adımları izleyin:

  • Android Studio'da bir Android uygulaması projesi açın.
  • Proje penceresinde Android görünümünü seçin.
  • Res klasörünü sağ tıklayın ve Yeni> Vektör Varlığı'nı seçin.

Vector Asset Studio'yu açtıktan sonra, aşağıdaki gibi bir malzeme simgesi ekleyebilirsiniz:

  • "Malzeme Simgesi" ni seçin (Küçük Resim: ICON üzerine tıklayarak)
  • Seç'i tıklayın
  • Bir malzeme simgesi seçin

24
Bu cevap harika! Yalnızca Android Studio'da paketlenmiş malzeme tasarımı simgesini (ek eklentiler olmadan) seçmekle kalmaz, aynı zamanda VectorDrawable'ı alırsınız ve (bekleyin ...): "Minimum API seviyeniz
lenrok258

5
Hatta xml dosyasında renk değiştirebilirsiniz ve yeni png'ler oluşturma sırasında oluşturulur ( app / build / oluşturulan / res / pngs / debug içinde ). Bana gusta! :-)
lenrok258

2
Bu cevap için oy verin! Simgenizin "Malzeme Simgesi" seçiminde görünmemesi durumunda, Malzeme Simgeleri'nden indirebilirsiniz , SVG biçimini seçerseniz, Vektör Varlığında Yerel SVG Dosyası'nı seçin ve simge için xml dosyasını oluşturun. PNG formatını seçerseniz, res-> new Image Asset-> Image-> 'ı seçerek Path'da sağ tıklayın: büyük resmi seçin (xxxhdpi) ve her yoğunluk için png oluşturun.
noe

11
Android Studio 2.2 Preview 5'ten itibaren, Vector Asset Studio'da artık "Seç" düğmesi yok, ancak simgenin küçük adının (adın altında) tıklanması gerekiyor. Bunu anlamak için bir süre aldı…
balu

2
son vektör varlık stüdyosu malzeme simgesi yerine bir klip sanat türü vardır, simgenizi seçmek için aşağıdaki android simgesini tıklayın
Gigarthan

23

Google tarafından sağlanan bu malzeme simgeleriyle çalışmanıza yardımcı olması için android stüdyo Android Malzeme Tasarımı Icon Generator Eklentisi için bu yeni eklentiyi kullanabilirsiniz : Google malzeme-tasarım-simgeleri


1
Yükledim, ama nasıl kullanırım?
gldraphael

1
@gldraphael - Kurulduktan sonra "Dosya" - "Yeni" - "Malzeme tasarımı simgesi" ni seçin. Oluşturulan dosyaların her birinin standart 48, 72, 96, 144 ve 192 piksel yüksekliğine / genişliğine sahip olduğundan emin olmak için 48dp'lik bir boyut seçin. Elbette gerekirse daha küçük bir dp boyutu seçin.
Martyn Davis

2
@MartynDavis teşekkürler. Yine de buldum. En çok sevdiğim şey, rengi de seçebilmem.
gldraphael

15

Klasörün üzerinde drawable> right click> new> vector assetsonra simgesine tıklayın:

Nerede tıklanacağı açık olmayan bir yeri gösteren Android Studio ekran görüntüleri


6

Burada malzeme tasarım simgelerinin github deposunu klonlayan bir komut dosyası

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

ve tüm dosyaların bir dizinini oluşturur. Ayrıca svg dosyalarını kategoriye göre alt dizinlere kopyalar. İlgilendiğiniz dosyaları projenize kopyalamak için bunu temel olarak kullanabilirsiniz - sadece find ve cp copy deyimini beğeninize göre değiştirin. Örneğin, belirli bir boyutta png'ye ihtiyacınız varsa - komşu dizinlerde bulunurlar ve o zaman buna göre bul ve kopyala komutunu değiştirmeniz gerekir.

resim açıklamasını buraya girin

#!/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

1
Tatlı senaryo. Bu tür bir repo için bir tür kullanıma uygun kullanım örneği olduğundan, sığ bir klon elde etmek için git clone --depth = 1 olarak değiştirmenizi öneririz. Biraz daha hızlı indirir.
mbac32768

2

Bu bağlantıyı benim için yararlı buldum.

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

dereceli uygulama mevcuttur

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

Sınıf bağımlılığı ekledikten sonra, menü öğesini bu şekilde oluşturabilirsiniz.

<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>
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.