CODEWITHSUNDEEP
androidtransparencymaterial-designandroid-drawable
lostintranslation
lostintranslation

Reputation: 24583

Setting transparency of material design icons

I am grabbing a few material design icons from here:

https://google.github.io/material-design-icons/#getting-icons

And I need a number of them to also be a little transparent 'gray'/'muted'.

I tried to create a drawable bitmap to define the alpha:

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/ic_info_outline_black_24dp"
    android:alpha=".7">
</bitmap>

However this does not work.

Is the right answer to create multiple pngs with different levels of transparency? If so, any worries about apps getting unnecessarily big?

Upvotes: 3

Views: 3681

Answers (1)

Vasileios Pallas
Vasileios Pallas

Reputation: 4877

you can make dynamically using setColorFilter

private Drawable changeColor() {

    try {
        Drawable image;

        int imageId = R.drawable.ic_folder_black;
        int color = Color.parseColor("#A6000000");

        image = getResources().getDrawable(imageId, getTheme());


        image.setColorFilter(color, PorterDuff.Mode.SRC_IN);

        return image;
    } catch (IllegalStateException e) {

    }
    return null;
}

And then call the method on an ImageView like this

imageView.setImageDrawable(changeColor());

On the color the A6 is the alpha and it's like 65% of transparency. Below is the list with the transparency levels and their hex value. I got the list from here.

100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00

** EDIT **

We set the filter as PorterDuff.Mode.SRC_IN because it's the only way to change a black image on any other color you wish. For images with different colors use PorterDuff.Mode.MULTIPLY

Upvotes: 1

Related Questions