I'm having trouble with imageView.setColorFilter(). In my app, I have dark mode (black background, white text) and light mode (white background, black text).
Targeting API 21+, I am using vector asset icons generated by Android Studio which is white, where by default android:tint="#FFFFFF" and android:fillColor="#FF000000" in the xml files.
As per material design, the icons have certain alpha applied for different status. I am using status of Active + Unfocused, where for black icon = #8A000000 and white icon = #B3FFFFFF.
In dark mode, the icon will appear greyish over the black background, which is exactly how it should be with alpha applied. However, in light mode, the icon is 100% black regardless of the alpha above. I am applying the color using imageView.setColorFilter() with default PorterDuff.Mode.SRC_ATOP.
What is happening here and how can I solve it? Thank you.
While writing this question, I have experimented with a few things and came to solved the problem myself.
The issue is that the icon itself is BLACK (#FF000000) as per vector xml . Android Studio tinted it with white only.
Using PorterDuff.Mode.SRC_ATOP, the blending of source and destination pixels (which are both black) hence does not result in visible change. In order to fully replace the original icon color, I used PorterDuff.Mode.SRC_IN instead. In this case, I can use the same vector xml in both modes.
As per official docs
PorterDuff.Mode.SRC_ATOP - Keeps the destination pixels that are not covered by source pixels. Discards destination pixels that are covered by source pixels. Discards all source pixels.
PorterDuff.Mode.SRC_IN - Keeps the source pixels that cover the destination pixels, discards the remaining source and destination pixels.