如何在Android中更改Drawable的颜色?


271

我正在开发一个android应用程序,并且有一个可绘制的图像是从源图像加载的。在此图像上,我想将所有白色像素转换为另一种颜色,例如蓝色,然后缓存生成的Drawable对象,以便以后使用。

例如,假设我有一个20x20 PNG文件,中间有一个白色圆圈,圆圈之外的所有内容都是透明的。将白色圆圈变成蓝色并缓存结果的最佳方法是什么?如果我要使用该源图像创建几个新的Drawable(例如蓝色,红色,绿色,橙色等),答案是否会改变?

我猜想我会以某种方式使用ColorMatrix,但是我不确定如何使用。


2
您终于以某种方式使它工作了吗?我确实在下面看到了很多答案,我也尝试了许多答案,但是没有任何效果。我目前有一个白色正方形,我想根据需要每次都用不同的颜色上色,这样我就不必创建静态资产。请提出建议,因为我仍在等待适用于全白的简单形状的可行解决方案。
omkar.ghaisas 2015年

@ omkar.ghaisas我建立了一个名为SillyAndroid的库,其中包含一个通用的Coloring类,并对可绘制对象和文本进行了各种着色。您可以在github.com/milosmns/silly-android中查看。该课程位于/sillyandroid/src/main/java/me/angrybyte/sillyandroid/extras/Coloring.java
milosmns'7

Answers:


221

我认为您实际上可以使用Drawable.setColorFilter( 0xffff0000, Mode.MULTIPLY )。这会将白色像素设置为红色,但我认为这不会影响透明像素。

参见Drawable#setColorFilter


9
当可绘制为单色时,这将很好用,当其为白色时,会更好。
Mitul Nakum 2011年

67
如果颜色发生了明显变化(例如在Adapter中),则可绘制对象必须是可变的。示例:Drawable.mutate().setColorFilter( 0xffff0000, Mode.MULTIPLY)更多信息:curious-creature.org/2009/05/02/drawable-mutations
sabadow 2013年

1
是的,它特别适合突出显示(较亮,较暗或为灰度图像添加色调。)我使用此技巧来切换按钮,其中“未选中”为灰度级,“选中”为我应用程序调色板中的粗体颜色。我个人觉得比自定义复选框更容易。
thom_nic 2014年

2
这正是我一直在寻找的东西,尽管令人难以置信的是,我们不能在XML中做到这一点(5.0及更高版本除外)。着色甚至在AppCompat中都不可用,因此我们不得不setColorFilter每次使用图标时都要调用,而不是使用具有不同颜色的选择器。不过,这是一个不是直接编辑PNG格式,并具有额外的静态资产更好的解决方案。
克里斯·西里菲斯

21
如果您的源图标为深色,则乘法将不起作用。要使用目标颜色绘制源图标形状,请使用SRC_INmyImage.getDrawable().mutate().setColorFilter(getResources().getColor(R.color.icon_grey), PorterDuff.Mode.SRC_IN);
取消间隔

152

试试下面的代码:

ImageView lineColorCode = (ImageView)convertView.findViewById(R.id.line_color_code);
int color = Color.parseColor("#AE6118"); //The color u want             
lineColorCode.setColorFilter(color);

106

我知道这个问题是在Lollipop之前问的,但是我想在Android 5. +上添加一个不错的方法。您使一个可绘制的xml引用了原始的xml并在其上设置了着色,如下所示:

<?xml version="1.0" encoding="utf-8"?>
<bitmap
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/ic_back"
    android:tint="@color/red_tint"/>

这也是最新支持库的一部分吗?
S-

否。仅对一些简单的小部件有用。
MinceMan 2015年

8
着色通过DrawableCompat支持v4
Mark Renouf

1
很酷,我会调查一下并相应地进行更新。
MinceMan 2015年

壁画不支持这种类型的绘制
jackqack

62

新的支持v4将色彩重新带回api 4。

你可以这样

public static Drawable setTint(Drawable d, int color) {
    Drawable wrappedDrawable = DrawableCompat.wrap(d);
    DrawableCompat.setTint(wrappedDrawable, color);
    return wrappedDrawable;
}

2
从支持库22起
rnrneverdies

1
这是首选的解决方案,自从棒棒糖发布以来,在老的API中,将可绘制的东西着色一直是灰色区域。这将打破障碍!我不知道这一个-感谢@Pei
RicardoSousaDev

2
小心!您应该对新包装的可绘制“ #mutate()”进行变异,以避免与状态相关的问题。请参阅stackoverflow.com/a/44593641/5555218
瑞卡德(Ricard)'18年

62

如果您有一个纯色的可绘制对象,并且想将其更改为另一种纯色,则可以使用ColorMatrixColorFilter。透明度得以保留。

int iColor = Color.parseColor(color);

int red   = (iColor & 0xFF0000) / 0xFFFF;
int green = (iColor & 0xFF00) / 0xFF;
int blue  = iColor & 0xFF;

float[] matrix = { 0, 0, 0, 0, red,
                   0, 0, 0, 0, green,
                   0, 0, 0, 0, blue,
                   0, 0, 0, 1, 0 };

ColorFilter colorFilter = new ColorMatrixColorFilter(matrix);
drawable.setColorFilter(colorFilter);

3
如果要使用颜色资源而不是字符串(#ff0000等),则可以使用例如int iColor = getResources()。getColor(R.color.primary)
Ben Clayton,

这可行,但我有复选框,我想保留中间的白色勾号。有什么建议吗?
Farooq

3
Ben注释中的代码现已弃用。相反,您可以使用int iColor = ContextCompat.getColor(context, R.color.primary);
ban-geoengineering

出色的答案!!谢谢大家!
卡韦什·坎沃(Kaveesh Kanwal)

@Mike Hill好,解释一下为什么要放置20种以上的颜色。您需要在数组中插入20种以上的颜色,否则它将与java.lang.ArrayIndexOutOfBoundsException
一起

50

我也ImageView用于图标(在ListView或“设置”屏幕中)。但是我认为有更简单的方法可以做到这一点。

使用tint来改变你的选择的图标颜色叠加。

在xml中,

android:tint="@color/accent"
android:src="@drawable/ic_event" 

正常工作,因为它来自 AppCompat


3
奇迹般有效!简单而完美。这需要标记为已接受答案。
娜迦·马拉什

2
这里有很多好的答案,但是对于OP的问题,这是最好,最简单的解决方案。
塞巴斯蒂安·布赖特

适用于api 22及更高版本
philip oghenerobo balogun

1
@philipoghenerobobalogun我看到这个在api 19上的工作
Jemshit Iskenderov 2016年

41

您应该对所有API执行此操作:

Drawable myIcon = getResources().getDrawable( R.drawable.button ); 
ColorFilter filter = new LightingColorFilter( Color.BLACK, Color.BLACK);
myIcon.setColorFilter(filter);

这以可接受的方式解决了该问题。但是在过滤颜色时,可能会发生(发生在我身上)结果颜色不符合预期的情况。变浅的颜色。我所做的是:`new LightingColorFilter(Color.parseColor(“#FF000000”),myFinalColor)
Yoraco Gonzales 2014年

1
强调我认为先前的评论者所说的话,如果LightingColorFilter中的2个参数不同,则此解决方案会更改颜色,例如,ColorFilter filter = new LightingColorFilter(Color.BLACK, Color.LTGRAY);将可绘制对象中的黑色变为灰色。
hBrent 2014年

1
当使用Alpha着色颜色时,这似乎不起作用。
ypresto

30

我能够使用下面的代码来做到这一点,该代码取自一个活动(布局是一个非常简单的布局,仅包含ImageView,并且未在此处发布)。

private static final int[] FROM_COLOR = new int[]{49, 179, 110};
private static final int THRESHOLD = 3;

public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.test_colors);

    ImageView iv = (ImageView) findViewById(R.id.img);
    Drawable d = getResources().getDrawable(RES);
    iv.setImageDrawable(adjust(d));
}

private Drawable adjust(Drawable d)
{
    int to = Color.RED;

    //Need to copy to ensure that the bitmap is mutable.
    Bitmap src = ((BitmapDrawable) d).getBitmap();
    Bitmap bitmap = src.copy(Bitmap.Config.ARGB_8888, true);
    for(int x = 0;x < bitmap.getWidth();x++)
        for(int y = 0;y < bitmap.getHeight();y++)
            if(match(bitmap.getPixel(x, y))) 
                bitmap.setPixel(x, y, to);

    return new BitmapDrawable(bitmap);
}

private boolean match(int pixel)
{
    //There may be a better way to match, but I wanted to do a comparison ignoring
    //transparency, so I couldn't just do a direct integer compare.
    return Math.abs(Color.red(pixel) - FROM_COLOR[0]) < THRESHOLD &&
        Math.abs(Color.green(pixel) - FROM_COLOR[1]) < THRESHOLD &&
        Math.abs(Color.blue(pixel) - FROM_COLOR[2]) < THRESHOLD;
}

我从哪里获得阈值或FROM_COLOR?
mikepenz

这些只是我定义的常数。我只是编辑了答案以包括它们。
马特·麦克明

谢谢;)尝试过,但是不适合我遇到的问题。尝试了setColorFilter,这可以工作,但是缩放.9.png图像存在问题。因此,如果您知道原因,请回答我的问题。stackoverflow.com/questions/5884481/...
mikepenz

1
彩色滤光片要容易得多。
afollestad 2014年

17

您可以使用Android支持兼容性库来解决它。:)

 // mutate to not share its state with any other drawable
 Drawable drawableWrap = DrawableCompat.wrap(drawable).mutate();
 DrawableCompat.setTint(drawableWrap, ContextCompat.getColor(getContext(), R.color.your_color))

1
@AmitabhaBiswas为什么您完全改变我的答案呢?逐步 1.不赞成使用getResources()。getDrawable()!2.我使用支持库是因为我不想关心Andorid Api版本。3.我不想重绘Drawable ....如果要显示其他方法,请写下您自己的答案。
Ricard

1
@AmitabhaBiswas此外,可绘制对象在资源的所有getDrawable之间共享,因此要求mutate()调用能够更改可绘制对象的色彩,而不更改与该资源ID关联的所有可绘制对象。
Ricard

1
这是最好的答案!在图像视图中包装可绘制对象并不能解决问题。
朱利叶斯

15

在您的“活动”中,您可以用一种单色着色PNG图像资源:

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    myColorTint();
    setContentView(R.layout.activity_main);
}

private void myColorTint() {
    int tint = Color.parseColor("#0000FF"); // R.color.blue;
    PorterDuff.Mode mode = PorterDuff.Mode.SRC_ATOP;
    // add your drawable resources you wish to tint to the drawables array...
    int drawables[] = { R.drawable.ic_action_edit, R.drawable.ic_action_refresh };
    for (int id : drawables) {
        Drawable icon = getResources().getDrawable(id);
        icon.setColorFilter(tint,mode);
    }
}

现在,当您使用R.drawable。*时,应使用所需的颜色进行着色。如果需要其他颜色,则应该可以将drawable .mutate()。




3

查看此示例代码“ ColorMatrixSample.java

/*
 * Copyright (C) 2007 The Android Open Source Project
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

package com.example.android.apis.graphics;

import com.example.android.apis.R;

import android.app.Activity;
import android.content.Context;
import android.graphics.*;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;

public class ColorMatrixSample extends GraphicsActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(new SampleView(this));
    }

    private static class SampleView extends View {
        private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        private ColorMatrix mCM = new ColorMatrix();
        private Bitmap mBitmap;
        private float mSaturation;
        private float mAngle;

        public SampleView(Context context) {
            super(context);

            mBitmap = BitmapFactory.decodeResource(context.getResources(),
                                                   R.drawable.balloons);
        }

        private static void setTranslate(ColorMatrix cm, float dr, float dg,
                                         float db, float da) {
            cm.set(new float[] {
                   2, 0, 0, 0, dr,
                   0, 2, 0, 0, dg,
                   0, 0, 2, 0, db,
                   0, 0, 0, 1, da });
        }

        private static void setContrast(ColorMatrix cm, float contrast) {
            float scale = contrast + 1.f;
               float translate = (-.5f * scale + .5f) * 255.f;
            cm.set(new float[] {
                   scale, 0, 0, 0, translate,
                   0, scale, 0, 0, translate,
                   0, 0, scale, 0, translate,
                   0, 0, 0, 1, 0 });
        }

        private static void setContrastTranslateOnly(ColorMatrix cm, float contrast) {
            float scale = contrast + 1.f;
               float translate = (-.5f * scale + .5f) * 255.f;
            cm.set(new float[] {
                   1, 0, 0, 0, translate,
                   0, 1, 0, 0, translate,
                   0, 0, 1, 0, translate,
                   0, 0, 0, 1, 0 });
        }

        private static void setContrastScaleOnly(ColorMatrix cm, float contrast) {
            float scale = contrast + 1.f;
               float translate = (-.5f * scale + .5f) * 255.f;
            cm.set(new float[] {
                   scale, 0, 0, 0, 0,
                   0, scale, 0, 0, 0,
                   0, 0, scale, 0, 0,
                   0, 0, 0, 1, 0 });
        }

        @Override protected void onDraw(Canvas canvas) {
            Paint paint = mPaint;
            float x = 20;
            float y = 20;

            canvas.drawColor(Color.WHITE);

            paint.setColorFilter(null);
            canvas.drawBitmap(mBitmap, x, y, paint);

            ColorMatrix cm = new ColorMatrix();

            mAngle += 2;
            if (mAngle > 180) {
                mAngle = 0;
            }

            //convert our animated angle [-180...180] to a contrast value of [-1..1]
            float contrast = mAngle / 180.f;

            setContrast(cm, contrast);
            paint.setColorFilter(new ColorMatrixColorFilter(cm));
            canvas.drawBitmap(mBitmap, x + mBitmap.getWidth() + 10, y, paint);

            setContrastScaleOnly(cm, contrast);
            paint.setColorFilter(new ColorMatrixColorFilter(cm));
            canvas.drawBitmap(mBitmap, x, y + mBitmap.getHeight() + 10, paint);

            setContrastTranslateOnly(cm, contrast);
            paint.setColorFilter(new ColorMatrixColorFilter(cm));
            canvas.drawBitmap(mBitmap, x, y + 2*(mBitmap.getHeight() + 10),
                              paint);

            invalidate();
        }
    }
}

相关API可在此处获取


1
这确实显示了如何使用ColorMatrix,但是我没有看到如何使用它来获得所需的结果。
马特·麦克明

3

这适用于具有背景的所有内容:

文字检视,按钮...

TextView text = (TextView) View.findViewById(R.id.MyText);
text.setBackgroundResource(Icon);    
text.getBackground().setColorFilter(getResources().getColor(Color), PorterDuff.Mode.SRC_ATOP);

3

此代码段对我有用:

PorterDuffColorFilter porterDuffColorFilter = new PorterDuffColorFilter(getResources().getColor(R.color.your_color),PorterDuff.Mode.MULTIPLY);

imgView.getDrawable().setColorFilter(porterDuffColorFilter);
imgView.setBackgroundColor(Color.TRANSPARENT)

2

有很多解决方案,但是没有人建议如果颜色资源xml文件已经具有颜色,那么我们也可以从那里直接进行选择,如下所示:

ImageView imageView = (ImageView) findViewById(R.id.imageview);
imageView.setColorFilter(getString(R.color.your_color));

1

根据isWorking字段更改可绘制颜色的简短示例。

我的形状xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="@android:color/holo_blue_bright" />
    <corners android:radius="30dp" />
    <size
        android:height="15dp"
        android:width="15dp" />
</shape>

我的更改方法:

private Drawable getColoredDrawable(int drawableResId, boolean isworking) {
    Drawable d = getResources().getDrawable(R.drawable.shape);
    ColorFilter filter = new LightingColorFilter(
            isworking ? Color.GREEN : Color.RED,
            isworking ? Color.GREEN : Color.RED);
    d.setColorFilter(filter);
    return d;
}

用法示例:

text1.setCompoundDrawablesWithIntrinsicBounds(getColoredDrawable(R.drawable.shape, isworking()), null, null, null);

0
Int color = Color.GRAY; 
// or int color = Color.argb(123,255,0,5);
// or int color = 0xaaff000;

在XML /res/values/color.xml中

<?xml version="1.0" encoding="utf-8">
<resources>
    <color name="colorRed">#ff0000</color>
</resoures> 

Java代码

int color = ContextCompat.getColor(context, R.color.colorRed);

GradientDrawable drawableBg = yourView.getBackground().mutate();
drawableBg.setColor(color);

0

为时已晚,但万一有人需要它:

   fun setDrawableColor(drawable: Drawable, color: Int) :Drawable {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
            drawable.colorFilter = BlendModeColorFilter(color, BlendMode.SRC_ATOP)
            return drawable
        } else {
            drawable.setColorFilter(color, PorterDuff.Mode.SRC_ATOP)
            return drawable
        }
    }

0

它适用于一些简单的可绘制对象。我在具有圆角的简单纯色矩形形状上使用了它,并且需要使用不同的布局更改该颜色。

试试这个

android:backgroundTint="#101010"

-1

使用库为您完成此操作非常简单。试试这个图书馆

您可以这样打电话:

Icon.on(holderView).color(R.color.your_color).icon(R.mipmap.your_icon).put();
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.