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

225140 次浏览
小开
最佳答案

不要直接编辑矢量资产。如果你在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" />
小开

你能做到的。

但是你不能为颜色使用@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"/>

小开

当前的工作解决方案是 android: fillColor = " # FFFFFF " < / p >

除了在向量中硬编码，什么都不管用

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

然而，填充色和色调可能很快就会起作用。请参阅此讨论以了解更多信息:

https://code.google.com/p/android/issues/detail?id=186431 < a href = " https://code.google.com/p/android/issues/detail?id=186431 " > < / >

此外，颜色可能会粘在缓存中，所以删除所有用户的应用程序可能会有所帮助。

小开

正如在其他回答中所说，不要直接编辑可绘制的向量，相反，你可以在java代码中着色，像这样:

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

为了简单起见，我创建了一个helper类:

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);
小开

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'
小开

要改变矢量图像的颜色，你可以直接使用android:色= " @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));
小开

如果你想支持旧版前棒棒糖

使用相同的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" />

别忘了更新你的gradle @ Sayooj Valsan提到

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


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

android:fillColor="@color/primary"给出它的十六进制值。

小开

将这个库添加到Gradle中，以启用旧android设备中的颜色向量可绘制。

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

和重新同步gradle。我认为这会解决问题。

小开

更新:AppCompat支持

其他答案怀疑android:tint是否只在21+设备上工作，AppCompat(v23.2.0及以上)现在提供了一个向后兼容的tint属性处理。

因此，行动的过程将是使用AppCompatImageView和app:srcCompat(在AppCompat命名空间)而不是android:src(Android命名空间)。

下面是一个例子(AndroidX: This is 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" />

别忘了在gradle中启用向量可绘制支持:

vectorDrawables.useSupportLibrary = true
小开

如果向量没有使用fillColor显示单独设置的颜色，那么它们可能被设置为默认的小部件参数。

尝试在activity_main.xml中添加app:itemIconTint="@color/lime"来为小部件图标设置默认颜色类型。

<?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 @ developer.android .android

小开

对于那些不使用ImageView的人，下面的方法在普通的View上为我工作(因此行为应该在任何类型的视图上复制)

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

进入MainActivity.java 下面的代码
->NavigationView navigationView = findViewById(R.id.nav_view);
添加单行代码->navigationView.setItemIconTintList(null);
例如，代码的最后一行

我希望这能解决你的问题。

public class MainActivity extends AppCompatActivity {


private AppBarConfiguration mAppBarConfiguration;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);


Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);


DrawerLayout drawer = findViewById(R.id.drawer_layout);
NavigationView navigationView = findViewById(R.id.nav_view);
navigationView.setItemIconTintList(null);
小开

如果你想改变项目矢量图标的颜色，你可以使用这个:

android:iconTint="@color/color"
小开
如果vector资产在CardView中，请尝试 card_view:tint="@color/secondary"在ImageView中。 注意:用你想要的颜色替换@color/secondary
小开

对于我的ImageButton，我使用app:tint="@color/green"而不是android:tint

小开

使用

android:drawableTint="@color/primary"

在activity_main.xml

activity_main.xml .xml

小开 
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24"
android:tint="//Your Color Code//">
<path
android:fillColor="@android:color/white"
android:pathData="M11,9.16V2c-5,0.5 -9,4.79 -9,10s4,9.5 9"/>
</vector>
小开

下面是由Filipe编写的可绘制Helper的Kotlin版本

class DrawableHelper(var mContext: Context) {
@ColorRes
private var mColor = 0
private lateinit var mDrawable: Drawable
private lateinit var mWrappedDrawable: Drawable
fun withDrawable(@DrawableRes drawableRes: Int): DrawableHelper {
mDrawable = getDrawable(mContext, drawableRes)!!
return this
}


fun withDrawable(drawable: Drawable): DrawableHelper {
mDrawable = drawable
return this
}


@SuppressLint("ResourceType")
fun withColor(@ColorRes colorRes: Int): DrawableHelper {
mColor = ContextCompat.getColor(mContext, colorRes)
return this
}


@SuppressLint("ResourceAsColor")
fun tint(): DrawableHelper {
mWrappedDrawable = DrawableCompat.wrap(mWrappedDrawable)
DrawableCompat.setTint(mWrappedDrawable, mColor)
DrawableCompat.setTintMode(mWrappedDrawable, PorterDuff.Mode.SRC_IN)
return this
}


fun applyToBackground(view: View) {
view.background = mWrappedDrawable
}


fun applyTo(imageView: ImageView) {
imageView.setImageDrawable(mWrappedDrawable)
}


fun applyTo(menuItem: MenuItem) {
menuItem.icon = mWrappedDrawable
}


fun get(): Drawable {
return mWrappedDrawable
}


companion object {
fun withContext(context: Context): DrawableHelper {
return DrawableHelper(context)
}
}
}

提交答案