CODEWITHSUNDEEP
androidandroid-resources
Kasbolat Kumakhov
Kasbolat Kumakhov

Reputation: 721

Single vector resource multiple tints

I want to replace all .PNG resources (icons) in my project with vector versions. And for this to be as efficient as possible, i wanted to avoid duplication of images because of different states (like for "active" and "inactive" versions of the same icon).

Previously i've done that by using separate PNG files for each version: an opaque "active", and slightly transparent "inactive".

So the question is, is it possible to create some XMLs which reference a single vector (preferably) image but apply different colors/tints to it? Or at least different alpha values would be enough.

P.S. My minSDK version is 19, if it matters.

UPDATE_01: I think i need to explain in a bit more details. Vector resources are working as expected (all preparations are made for compat lib to draw vectors as needed).

The main problem is to use one single vector icon and multiple references of it with different colors/alphas in separate XMLs. And use these XMLs where needed (on toolbar, buttons, states, etc.).

UPDATE_02: Perhaps and example would be better.

I have a vector drawable of a "home" icon, which looks like this:

<vector
    android:height="24dp"
    android:viewportHeight="792.0"
    android:viewportWidth="792.0"
    android:width="24dp"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <path
        android:fillColor="#FF000000"
        android:pathData="..."/>
</vector>

What i want is to use this same XML vector drawable but with different tints for "active" and "inactive" states, for example, in a page adapter's tabs.

What i do now for this is duplicate this XML and change it's "android:fillColor" value.

Mutating it (in code) in all the places it is used is one way, but not very good from my point of view. Perhaps there is another way? Something like this (pseudo):

<image-reference
    android:srcDrawable="@drawable/home_icon"
    android:tint="@color/activeHomeIcon" />

And then just use this "home_icon_ref.xml" everywhere as a drawable source.

Hope this makes my question more clear this time.

Upvotes: 3

Views: 1431

Answers (2)

MikeL
MikeL

Reputation: 2894

Not sure if this is exactly what you needed (and this is almost 2 years old), but you can use android:tint in the xml of an ImageView: 

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:src="@drawable/vector_drawable"
    android:tint="@android:color/black"
    android:contentDescription="@string/description"
/>

I'm currently using minSdkVersion 21 but it seems to work in earlier versions according to this.
You can also use a style with <item name="android:tint">@android:color/black</item>.

Upvotes: 2

Ravi Theja
Ravi Theja

Reputation: 3401

Instead of using in separate XML resources you can modify programatically in your java code.Follow this SO post

Upvotes: 0

Related Questions