マテリアルデザインアイコンをAndroidプロジェクトにインポートする


回答:


358

Vector Asset Studioご覧ください

次の手順に従ってVector Asset Studioを起動します。

  • Android Studioで、Androidアプリプロジェクトを開きます。
  • プロジェクトウィンドウで、Androidビューを選択します。
  • resフォルダーを右クリックし、[新規]> [ベクターアセット]を選択します。

Vector Asset Studioを開いたら、次のようにマテリアルアイコンを追加できます。

  • [素材アイコン]を選択します(クリップアートをクリックすると、アイコンが表示されます)。
  • 「選択」をクリックします
  • 素材アイコンを選択

24
この答えは素晴らしいです!Android Studioにバンドルされているマテリアルデザインアイコンを選択できるだけでなく(追加のプラグインなしで)、VectorDrawableを取得して(それを待つ...): 「最小APIレベルがこれらのAPIのいずれかに設定されている場合また、Vector Asset StudioはGradleに、下位互換性のためにベクター
ドローアブルの

5
xmlファイルの色を変更することもでき、ビルド中に新しいpngが生成されます(app / build / generated / res / pngs / debugにあります)。ガスタ!:-)
lenrok258 2016

2
この回答に賛成投票してください!あなたのアイコンが選択し、「マテリアルアイコン」には表示されません。その場合、あなたはからダウンロードすることができます材料のアイコンあなたはSVG形式を選択した場合、ベクタ資産にローカルSVGファイルを選択し、アイコンのためのXMLファイルを生成します。PNG形式を選択する場合は、res-> new Image Asset-> Select Image->をパスで右クリックします。大きな画像(xxxhdpi)を選択し、密度ごとにpngを生成します。
noe

11
Android Studio 2.2プレビュー5以降、Vector Asset Studioに[選択]ボタンはなくなりましたが、アイコンの下の小さな表現(名前の下)をクリックする必要があります。それを理解するのにしばらく
かかりまし

2
最近のベクターアセットスタジオには、素材アイコンの代わりにクリップアートタイプがあります。その下のAndroidアイコンをクリックして、アイコンを選択してください
Gigarthan

23

Android Studioのこの新しいプラグインを使用すると、 Android Material Design Icon Generatorプラグイン を使用して、Googleが提供するこれらのマテリアルアイコンを操作できます: Google material-design-icons


1
インストールしましたが、どのように使用しますか?
gldraphael

1
@gldraphael-インストールしたら、[ファイル]-[新規]-[マテリアルデザインアイコン]を選択します。48dpのサイズを選択して、生成された各ファイルが標準の48、72、96、144、192ピクセルの高さ/幅を持つようにします。もちろん、必要に応じて、より小さいdpサイズを選択します。
Martyn Davis、

2
@MartynDavisありがとう。私はそれを見つけました。一番好きなのは、色も選べるということです。
gldraphael、2015年

15

フォルダにdrawable> right click> new> vector asset、その後、アイコンをクリックします。

Android Studioのスクリーンショット。わかりにくい場所をクリックする場所を示しています


6

以下は、マテリアルデザインアイコンのgithubリポジトリを複製するスクリプトです。

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

すべてのファイルのインデックスを作成します。また、svgファイルをカテゴリ別にサブディレクトリにコピーします。これを基礎として使用して、興味のあるファイルをプロジェクトにコピーできます。単に、findおよびcp copyステートメントをお好みに変更してください。たとえば、特定のサイズのpngが必要な場合-隣接するディレクトリにあり、それに応じて検索とコピーコマンドを変更する必要があります。

ここに画像の説明を入力してください

#!/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
甘いスクリプト。これはそのリポジトリの使い捨てのユースケースの一種であるため、浅いクローンを取得するにはgit clone --depth = 1に変更することをお勧めします。ダウンロードが少し速くなります。
mbac32768

1

このリンクは役に立ちました。

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

Gradle実装が利用可能です

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

Gradle依存関係を追加した後、この方法でメニュー項目を作成できます。

<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>
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.