web-dev-qa-db-ja.com

Android Studioでベクターアセットの塗りつぶしの色を変更する

Android Studioは21以上のベクトルアセットをサポートし、コンパイル時に下位バージョン用のPNGを生成します。塗りつぶしの色を変更したい（アセットのアイコンからの）ベクトルアセットがあります。これは21以上で動作しますが、生成されたPNGは色を変えません。これを行う方法はありますか？

<vector Android:height="48dp" Android:viewportHeight="24.0"
Android:viewportWidth="24.0" Android:width="48dp" xmlns:Android="http://schemas.Android.com/apk/res/Android">
<path Android:fillColor="@color/primary" Android:pathData="M9,16.17L4.83,12l-1.42,1.41L9,19 21,7l-1.41,-1.41z"/>
androidandroid-studiovector-graphicsandroid-vectordrawable
134
Patrick

ベクターアセットを直接編集しないでください。 ImageButtonで描画可能なベクトルを使用している場合は、Android:tintで色を選択してください。

<ImageButton
        Android:layout_width="48dp"
        Android:layout_height="48dp"
        Android:id="@+id/button"
        Android:src="@drawable/ic_more_vert_24dp"
        Android:tint="@color/primary" />
266
YYYY-MM-DD

あなたはそれをすることができます。

しかし、@ colorリファレンスを色（..lame）に使用することはできません。それ以外の場合はL +に対してのみ機能します。

<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:width="24dp"
    Android:height="24dp"
    Android:viewportWidth="24.0"
    Android:viewportHeight="24.0">
<path
    Android:fillColor="#FFAABB"
    Android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zm-6,0C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z"/>
85
urSus

他の答えで述べたように、直接描画可能なベクトルを編集しないでください、その代わりにあなたはそのようにJavaコードで着色することができます：

    mWrappedDrawable = mDrawable.mutate();
    mWrappedDrawable = DrawableCompat.wrap(mWrappedDrawable);
    DrawableCompat.setTint(mWrappedDrawable, mColor);
    DrawableCompat.setTintMode(mWrappedDrawable, PorterDuff.Mode.SRC_IN);

そして簡単のために、私はヘルパークラスを作成しました：

import Android.content.Context;
import Android.graphics.PorterDuff;
import Android.graphics.drawable.Drawable;
import Android.os.Build;
import Android.support.annotation.ColorRes;
import Android.support.annotation.DrawableRes;
import Android.support.annotation.NonNull;
import Android.support.v4.content.ContextCompat;
import Android.support.v4.graphics.drawable.DrawableCompat;
import Android.view.MenuItem;
import Android.view.View;
import Android.widget.ImageView;

/**
 * {@link Drawable} helper class.
 *
 * @author Filipe Bezerra
 * @version 18/01/2016
 * @since 18/01/2016
 */
public class DrawableHelper {
    @NonNull Context mContext;
    @ColorRes private int mColor;
    private Drawable mDrawable;
    private Drawable mWrappedDrawable;

    public DrawableHelper(@NonNull Context context) {
        mContext = context;
    }

    public static DrawableHelper withContext(@NonNull Context context) {
        return new DrawableHelper(context);
    }

    public DrawableHelper withDrawable(@DrawableRes int drawableRes) {
        mDrawable = ContextCompat.getDrawable(mContext, drawableRes);
        return this;
    }

    public DrawableHelper withDrawable(@NonNull Drawable drawable) {
        mDrawable = drawable;
        return this;
    }

    public DrawableHelper withColor(@ColorRes int colorRes) {
        mColor = ContextCompat.getColor(mContext, colorRes);
        return this;
    }

    public DrawableHelper tint() {
        if (mDrawable == null) {
            throw new NullPointerException("É preciso informar o recurso drawable pelo método withDrawable()");
        }

        if (mColor == 0) {
            throw new IllegalStateException("É necessário informar a cor a ser definida pelo método withColor()");
        }

        mWrappedDrawable = mDrawable.mutate();
        mWrappedDrawable = DrawableCompat.wrap(mWrappedDrawable);
        DrawableCompat.setTint(mWrappedDrawable, mColor);
        DrawableCompat.setTintMode(mWrappedDrawable, PorterDuff.Mode.SRC_IN);

        return this;
    }

    @SuppressWarnings("deprecation")
    public void applyToBackground(@NonNull View view) {
        if (mWrappedDrawable == null) {
            throw new NullPointerException("É preciso chamar o método tint()");
        }

        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            view.setBackground(mWrappedDrawable);
        } else {
            view.setBackgroundDrawable(mWrappedDrawable);
        }
    }

    public void applyTo(@NonNull ImageView imageView) {
        if (mWrappedDrawable == null) {
            throw new NullPointerException("É preciso chamar o método tint()");
        }

        imageView.setImageDrawable(mWrappedDrawable);
    }

    public void applyTo(@NonNull MenuItem menuItem) {
        if (mWrappedDrawable == null) {
            throw new NullPointerException("É preciso chamar o método tint()");
        }

        menuItem.setIcon(mWrappedDrawable);
    }

    public Drawable get() {
        if (mWrappedDrawable == null) {
            throw new NullPointerException("É preciso chamar o método tint()");
        }

        return mWrappedDrawable;
    }
}

使用するには、単に次のようにします。

    DrawableHelper
            .withContext(this)
            .withColor(R.color.white)
            .withDrawable(R.drawable.ic_search_24dp)
            .tint()
            .applyTo(mSearchItem);

または

    final Drawable drawable = DrawableHelper
            .withContext(this)
            .withColor(R.color.white)
            .withDrawable(R.drawable.ic_search_24dp)
            .tint()
            .get();

    actionBar.setHomeAsUpIndicator(drawable);
58
Filipe Bezerra de Sousa

ベクター画像の色を変更するには、直接使用することができますAndroid：tint = "@ color/colorAccent"

<ImageView
        Android:id="@+id/ivVectorImage"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:src="@drawable/ic_account_circle_black_24dp"
        Android:tint="@color/colorAccent" />

プログラムで色を変える

ImageView ivVectorImage = (ImageView) findViewById(R.id.ivVectorImage);
ivVectorImage.setColorFilter(getResources().getColor(R.color.colorPrimary));
31
Rana Ranvijay Singh

現在作業中のソリューションはAndroidです。fillColor = "＃FFFFFF"

ベクトルのハードコーディング以外には何もうまくいきませんでした

<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:width="24dp"
    Android:height="24dp"
    Android:viewportWidth="24.0"
      Android:fillColor="#FFFFFF"
    Android:viewportHeight="24.0">
<path
    Android:fillColor="#FFFFFF"
    Android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zm-6,0C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z"/>

ただし、fillcolorと色合いはすぐに機能する可能性があります。詳細については、この説明を参照してください。

https://code.google.com/p/Android/issues/detail?id=186431

また、色がキャッシュに固執しているため、すべてのユーザーのアプリを削除すると効果的です。

15
sivi

Androidのスタジオは今ロリポッププレベクトルをサポートしています。 PNG変換はありません。あなたはまだあなたの塗りつぶしの色を変更することができ、それは動作します。

ImageViewでは、

 app:srcCompat="@drawable/ic_more_vert_24dp"

Gradleファイルでは、

 // Gradle Plugin 2.0+  
 Android {  
   defaultConfig {  
     vectorDrawables.useSupportLibrary = true  
   }  
 }  

 compile 'com.Android.support:design:23.4.0'
8
Sayooj Valsan

更新：AppCompatのサポート

Android:tintが21台以上のデバイスでのみ動作するかどうかを疑うその他の回答は、AppCompat（v23.2.0以降）tint属性の後方互換性処理を提供します。

そのため、一連のアクションはapp:srcCompat（Android名前空間）の代わりにAppCompatImageViewおよびAndroid:src（AppCompat名前空間内）を使用することになります。

これが一例です。

<Android.support.v7.widget.AppCompatImageView
        Android:id="@+id/credits_material_icon"
        Android:layout_width="20dp"
        Android:layout_height="20dp"
        Android:layout_marginBottom="8dp"
        Android:layout_marginLeft="16dp"
        Android:layout_marginStart="16dp"
        Android:scaleType="fitCenter"
        Android:tint="#ffd2ee"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:srcCompat="@drawable/ic_dollar_coin_stack" />

そしてgradleでvector drawableサポートを有効にすることを忘れないでください：

vectorDrawables.useSupportLibrary = true
4
pulp_fiction

このライブラリをGradleに追加して、古いAndroidデバイスで描画可能な色ベクトルを有効にします。

compile 'com.Android.support:palette-v7:26.0.0-alpha1'

そして、gradleを再同期してください。私はそれが問題を解決すると思います。

2
Sid

古いバージョンのpre lolipopをサポートする場合

いくつかの変更を加えて同じxmlコードを使用する

通常のImageView --> AppCompatImageViewの代わりに

Android:src --> app:srcCompatの代わりに

ここに例があります

<Android.support.v7.widget.AppCompatImageView
        Android:layout_width="48dp"
        Android:layout_height="48dp"
        Android:id="@+id/button"
        app:srcCompat="@drawable/ic_more_vert_24dp"
        Android:tint="@color/primary" />

@ Sayooj Valsan言及としてグラドルを更新することを忘れないでください

// Gradle Plugin 2.0+  
 Android {  
   defaultConfig {  
     vectorDrawables.useSupportLibrary = true  
   }  
 }  

 compile 'com.Android.support:design:23.4.0'

注意ベクタを使用する人には、このような色へのベクトル参照を決して与えないでくださいAndroid:fillColor="@color/primary"は16進値を与えます。

2
Mina Fawzy

ベクトルがfillColorを使用して個別に設定された色を表示していない場合は、デフォルトのウィジェットパラメータに設定されている可能性があります。

app:itemIconTint="@color/Lime"をactivity_main.xmlに追加して、ウィジェットアイコンのデフォルトのカラータイプを設定してください。

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v4.widget.DrawerLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:id="@+id/drawer_layout"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_main"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent" />

    <Android.support.design.widget.NavigationView
        Android:id="@+id/nav_view"
        Android:layout_width="wrap_content"
        Android:layout_height="match_parent"
        Android:layout_gravity="start"
        Android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:itemIconTint="@color/Lime"
        app:menu="@menu/activity_main_drawer" />

</Android.support.v4.widget.DrawerLayout>

VectorDrawable @ developers.Android

1
lubi