How to set tint for an image view programmatically in android?

Question

Need to set tint for an image view... I am using it the following way:

imageView.setColorFilter(R.color.blue,android.graphics.PorterDuff.Mode.MULTIPLY);

But it doesn't change...

Answer 1

You can change the tint, quite easily in code via:

imageView.setColorFilter(Color.argb(255, 255, 255, 255)); // White Tint

If you want color tint then

imageView.setColorFilter(ContextCompat.getColor(context, R.color.COLOR_YOUR_COLOR), android.graphics.PorterDuff.Mode.MULTIPLY);

For Vector Drawable

imageView.setColorFilter(ContextCompat.getColor(context, R.color.COLOR_YOUR_COLOR), android.graphics.PorterDuff.Mode.SRC_IN);

UPDATE:
@ADev has newer solution in his answer here, but his solution requires newer support library - 25.4.0 or above.

Answer 2

Most answers refer to using setColorFilter which is not what was originally asked.

The user @Tad has his answer in the right direction but it only works on API 21+.

To set the tint on all Android versions, use the ImageViewCompat:

ImageViewCompat.setImageTintList(imageView, ColorStateList.valueOf(yourTint));

Note that yourTint in this case must be a "color int". If you have a color resource like R.color.blue, you need to load the color int first:

ContextCompat.getColor(context, R.color.blue);

Answer 3

This worked for me

mImageView.setColorFilter(ContextCompat.getColor(getContext(), R.color.green_500));

Answer 4

@Hardik has it right. The other error in your code is when you reference your XML-defined color. You passed only the id to the setColorFilter method, when you should use the ID to locate the color resource, and pass the resource to the setColorFilter method. Rewriting your original code below.

If this line is within your activity:

imageView.setColorFilter(getResources().getColor(R.color.blue), android.graphics.PorterDuff.Mode.MULTIPLY);

Else, you need to reference your main activity:

Activity main = ...
imageView.setColorFilter(main.getResources().getColor(R.color.blue), android.graphics.PorterDuff.Mode.MULTIPLY);

Note that this is also true of the other types of resources, such as integers, bools, dimensions, etc. Except for string, for which you can directly use getString() in your Activity without the need to first call getResources() (don't ask me why).

Otherwise, your code looks good. (Though I haven't investigated the setColorFilter method too much...)

Answer 5

After i tried all methods and they did not work for me.

I get the solution by using another PortDuff.MODE.

imgEstadoBillete.setColorFilter(context.getResources().getColor(R.color.green),PorterDuff.Mode.SRC_IN);

Answer 6

Better simplified extension function thanks to ADev

fun ImageView.setTint(@ColorRes colorRes: Int) {
    ImageViewCompat.setImageTintList(this, ColorStateList.valueOf(ContextCompat.getColor(context, colorRes)))
}

Usage:-

imageView.setTint(R.color.tintColor)

Answer 7

If your color has hex transparency, use the below code.

ImageViewCompat.setImageTintMode(imageView, PorterDuff.Mode.SRC_ATOP);
ImageViewCompat.setImageTintList(imageView, ColorStateList.valueOf(Color.parseColor("#80000000")));

To clear the tint

ImageViewCompat.setImageTintList(imageView, null);

Answer 8

Beginning with Lollipop, there is also a tint method for BitmapDrawables that works with the new Palette class:

public void setTintList (ColorStateList tint)

and

public void setTintMode (PorterDuff.Mode tintMode)

On older versions of Android, you can now use the DrawableCompat library

Answer 9

Simple and one line

imageView.setColorFilter(activity.getResources().getColor(R.color.your_color));

Answer 10

Try this. It should work on all Android versions that the support library supports:

public static Drawable getTintedDrawableOfColorResId(@NonNull Context context, @NonNull Bitmap inputBitmap, @ColorRes int colorResId) {
    return getTintedDrawable(context, new BitmapDrawable(context.getResources(), inputBitmap), ContextCompat.getColor(context, colorResId));
}

public static Drawable getTintedDrawable(@NonNull Context context, @NonNull Bitmap inputBitmap, @ColorInt int color) {
    return getTintedDrawable(context, new BitmapDrawable(context.getResources(), inputBitmap), color);
}

public static Drawable getTintedDrawable(@NonNull Context context, @NonNull Drawable inputDrawable, @ColorInt int color) {
    Drawable wrapDrawable = DrawableCompat.wrap(inputDrawable);
    DrawableCompat.setTint(wrapDrawable, color);
    DrawableCompat.setTintMode(wrapDrawable, PorterDuff.Mode.SRC_IN);
    return wrapDrawable;
}

You can use any of the above to make it work.

You can read about more interesting features of DrawableCompat on the docs, here.

Answer 11

For set tint for an image view programmatically in android

I have two methods for android :

1)

imgView.setColorFilter(context.getResources().getColor(R.color.blue));

2)

 DrawableCompat.setTint(imgView.getDrawable(),
                     ContextCompat.getColor(context, R.color.blue));

I hope I helped anyone out :-)

Answer 12

As the first answer didn't work for me:

//get ImageView
ImageView myImageView = (ImageView) findViewById(R.id.iv);

//colorid is the id of a color defined in values/colors.xml
myImageView.setImageTintList(ColorStateList.valueOf(ContextCompat.getColor(getApplicationContext(), R.color.colorid)));

This only seems to work in API 21+, but for me that wasn't an issue. You can use an ImageViewCompat to resolve that issue, tho.

I hope I helped anyone out :-)

Answer 13

Adding to ADev's answer (which in my opinion is the most correct), since the widespread adoption of Kotlin, and its useful extension functions:

fun ImageView.setTint(context: Context, @ColorRes colorId: Int) {
    val color = ContextCompat.getColor(context, colorId)
    val colorStateList = ColorStateList.valueOf(color)
    ImageViewCompat.setImageTintList(this, colorStateList)
}

I think this is a function which could be useful to have in any Android project!

Answer 14

Beginning in Lollipop, there is a method called ImageView#setImageTintList() that you can use... the advantage being that it takes a ColorStateList as opposed to just a single color, thus making the image's tint state-aware.

On pre-Lollipop devices, you can get the same behavior by tinting the drawable and then setting it as the ImageView's image drawable:

ColorStateList csl = AppCompatResources.getColorStateList(context, R.color.my_clr_selector);
Drawable drawable = DrawableCompat.wrap(imageView.getDrawable());
DrawableCompat.setTintList(drawable, csl);
imageView.setImageDrawable(drawable);

Answer 15

I found that we can use color selector for tint attr:

mImageView.setEnabled(true);

activity_main.xml:

<ImageView
    android:id="@+id/image_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_arrowup"
    android:tint="@color/section_arrowup_color" />

section_arrowup_color.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@android:color/white" android:state_enabled="true"/>
    <item android:color="@android:color/black" android:state_enabled="false"/>
    <item android:color="@android:color/white"/>
</selector>

Answer 16

Random random=new Random;
ImageView imageView = (ImageView) view.findViewById(R.id.imageView);
ColorFilter cf = new PorterDuffColorFilter(Color.rgb(random.nextInt(255), random.nextInt(255), random.nextInt(255)),Mode.OVERLAY);

imageView.setImageResource(R.drawable.ic_bg_box);
imageView.setColorFilter(cf);

Answer 17

Kotlin solution using extension function, to set and unset the tinting :

fun ImageView.setTint(@ColorInt color: Int?) {
    if (color == null) {
        ImageViewCompat.setImageTintList(this, null)
        return
    }
    ImageViewCompat.setImageTintMode(this, PorterDuff.Mode.SRC_ATOP)
    ImageViewCompat.setImageTintList(this, ColorStateList.valueOf(color))
}

Answer 18

Don't use PoterDuff.Mode, Use setColorFilter() it works for all.

ImageView imageView = (ImageView) listItem.findViewById(R.id.imageView);
imageView.setColorFilter(getContext().getResources().getColor(R.color.msg_read));

Answer 19

In case you want to set selector to your tint:

ImageViewCompat.setImageTintList(iv, getResources().getColorStateList(R.color.app_icon_click_color));

Answer 20

As @milosmns said, you should use imageView.setColorFilter(getResouces().getColor(R.color.blue),android.graphics.PorterDuff.Mode.MULTIPLY);

This API need color value instead of color resource id, That's the root cause why your statement didn't work.

Answer 21

I am late in the party but I didn't see my solusion above. We are able to set tint color via setImageResource(), too (my minSdkVersion is 24).

So, first, you need to create a selector and save it in /drawable asset folder (I call it ic_color_white_green_search.xml)

<!-- Focused and not pressed -->
<item android:state_focused="true"
      android:state_pressed="false">

    <bitmap android:src="@drawable/ic_search"
            android:tint="@color/branding_green"/>
</item>

<!-- Focused and pressed -->
<item android:state_focused="true"
      android:state_pressed="true">

    <bitmap android:src="@drawable/ic_search"
            android:tint="@color/branding_green"/>
</item>

<!-- Default -->
<item android:drawable="@drawable/ic_search"/>

Then set it in code like this:

val icon = itemView.findViewById(R.id.icon) as ImageButton
icon.setImageResource(R.drawable.ic_color_white_green_search)

Answer 22

For me this code works. I use it with card and image views but i thins it works in any view to change their tints colors. cardBookmark is my cardView.

var cardDrawable: Drawable = binding.cardBookmark.background
cardDrawable = DrawableCompat.wrap(cardDrawable)
DrawableCompat.setTint(cardDrawable, resources.getColor(R.color.shuffleColor))
binding.cardBookmark.background = cardDrawable

Answer 23

Not exact answer but a simpler alternative:

• Place another view on top of the image
• Change the alpha value of the view however you want (programmatically) to get the desired effect.

Here is a snippet for that:

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="@dimen/height120"
        android:contentDescription="@string/my_description"
        android:scaleType="fitXY"
        android:src="@drawable/my_awesome_image"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="@dimen/height120"
        android:alpha="0.5"
        android:background="@color/my_blue_color"/>
</FrameLayout>