Ubah warna isian pada aset vektor di Android Studio

Android Studio sekarang mendukung aset vektor pada 21+ dan akan menghasilkan png untuk versi yang lebih rendah pada waktu kompilasi. Saya memiliki aset vektor (dari Material Ikon) yang ingin saya ubah warna isiannya. Ini berfungsi di 21+, tetapi png yang dihasilkan tidak berubah warna. Apakah ada cara untuk melakukan ini?

<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"/>

Jangan mengedit aset vektor secara langsung. Jika Anda menggunakan gambar vektor di ImageButton, pilih saja warna Anda 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" />

Kamu bisa melakukannya.

TETAPI Anda tidak dapat menggunakan referensi @color untuk warna (..lame), jika tidak, ia hanya akan berfungsi untuk 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"/>

Seperti yang dikatakan dalam jawaban lain, jangan mengedit vektor yang dapat digambar secara langsung, alih-alih Anda dapat mewarnai kode java, seperti itu:

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

Dan demi kesederhanaan, saya telah menciptakan kelas pembantu:

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;
    }
}

Untuk menggunakan lakukan saja hal berikut:

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

Atau:

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

    actionBar.setHomeAsUpIndicator(drawable);

Untuk mengubah warna gambar vektor, Anda dapat langsung menggunakan 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" />

Untuk mengubah warna secara terprogram

ImageView ivVectorImage = (ImageView) findViewById(R.id.ivVectorImage);
ivVectorImage.setColorFilter(getResources().getColor(R.color.colorPrimary));

Saat ini soloution yang berfungsi adalah android: fillColor = "# FFFFFF"

Tidak ada yang berhasil untuk saya kecuali pengodean keras dalam vektor

<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"/>

Namun, fillcolor dan tint mungkin segera berfungsi. Silakan lihat diskusi ini untuk informasi lebih lanjut:

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

Juga warna mighr menempel di cache sehingga menghapus aplikasi untuk semua pengguna dapat membantu.

Studio Android sekarang mendukung vektor pre-lollipop. Tidak ada konversi PNG. Anda masih dapat mengubah warna isian Anda dan itu akan berhasil.

Di ImageView Anda, gunakan

 app:srcCompat="@drawable/ic_more_vert_24dp"

Di file gradle Anda,

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

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

Perbarui: AppCompatdukungan

Jawaban lain yang mencurigakan jika hanya android:tintakan bekerja pada 21 perangkat saja, AppCompat ( v23.2.0 dan yang lebih tinggi ) sekarang menyediakan penanganan atribut warna yang kompatibel dengan terbelakang.

Jadi, tindakannya adalah menggunakan AppCompatImageViewdan app:srcCompat(dalam namespace AppCompat) alih-alih android:src(Android namespace).

Berikut ini sebuah contoh (AndroidX: Ini adalah androidx.appcompat.widget.AppCompatImageView ;)):

<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" />

Dan jangan lupa untuk mengaktifkan dukungan gambar vektor di gradle:

vectorDrawables.useSupportLibrary = true 

Tambahkan perpustakaan ini ke Gradle untuk mengaktifkan vektor warna yang dapat digambar di Perangkat Android lama.

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

dan sinkronisasi ulang gradle. Saya pikir itu akan menyelesaikan masalah.

Jika vektor tidak menunjukkan pengaturan warna secara individual menggunakan fillColor maka mereka dapat diatur ke parameter widget default.

Coba tambahkan app:itemIconTint="@color/lime"ke activity_main.xml untuk menetapkan jenis warna default untuk ikon widget.

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

jika Anda ingin mendukung pre lolipop versi lama

gunakan kode xml yang sama dengan beberapa perubahan

bukannya normal ImageView --> AppCompatImageView

dari pada android:src --> app:srcCompat

di sini adalah contoh

<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" />

jangan lupa perbarui grad Anda sebagai @ Sayooj Valsan sebutkan

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

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

Perhatikan Untuk siapa pun yang menggunakan vektor, jangan pernah memberikan referensi vektor Anda ke warna seperti ini android:fillColor="@color/primary"memberikan nilai hex.

Bagi mereka yang tidak menggunakan ImageView, berikut ini berfungsi untuk saya di dataran View(dan karenanya perilaku harus meniru pada segala jenis tampilan)

<View
    android:background="@drawable/ic_reset"
    android:backgroundTint="@color/colorLightText" />