Develop Reference

Setting the Color of a TextView Drawable

Im trying to change the color of a TextView Drawable in Xamarin.
In Java you can do it like this:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
TextView txt = (TextView) findViewById(R.id.my_textview);
setTextViewDrawableColor(txt, R.color.my_color);
}
private void setTextViewDrawableColor(TextView textView, int color) {
for (Drawable drawable : textView.getCompoundDrawables()) {
if (drawable != null) {
drawable.setColorFilter(new PorterDuffColorFilter(getColor(color), PorterDuff.Mode.SRC_IN));
}
}
}
How i can do something like this in Xamarin.Android?

Try below solution
private void setTextViewDrawableColor(TextView textView, int color) {
for (Drawable drawable : textView.getCompoundDrawables()) {
if (drawable != null) {
drawable.setColorFilter(new PorterDuffColorFilter(ContextCompat.getColor(textView.getContext(), color), PorterDuff.Mode.SRC_IN));
}
}
}

I am using this in kotlin:
tv.getCompoundDrawables()[0].setTint(//color)

Please, notice that if you set drawables in your layout file via android:drawableStart or android:drawableEnd instead of android:drawableLeft and android:drawableRight respectively you should use TextView.getCompoundDrawablesRelative(). Otherwise you can get empty array of drawables.
private void setTextViewDrawableColor(TextView textView, int color) {
for (Drawable drawable : textView.getCompoundDrawablesRelative()) {
if (drawable != null) {
drawable.setColorFilter(new PorterDuffColorFilter(ContextCompat.getColor(textView.getContext(), color), PorterDuff.Mode.SRC_IN));
}
}
}

// index of drawable
val left = 0
val start = left
val top = 1
val right = 2
val end = right
val bottm = 3
// color int
val color = Color.RED
// apply tint for target drawable
textView.compoundDrawables.getOrNull(left)?.setTint(color)
// apply tint for all drawables
textView.compoundDrawables?.forEach { it?.setTint(color) }
NOTE!
if in XML layout you use android:stratDrawable or android:endDrawable you have to work with textView.compoundDrawablesRelative array, textView.compoundDrawables contains drawables when they have been added with android:leftDrawable or android:rightDrawable attributes.

I solve this problem adding in xml definition this line:
android:drawableTint="#color/red"
A complete example:
<TextView
android:id="#+id/tv_element"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:layout_alignParentEnd="true"
android:drawableStart="#drawable/ic_icon"
android:drawableTint="#color/color"
android:visibility="visible" />

There's built in support for this through TextViewCompat.setCompoundDrawableTintList(textView, colors)
val color = ContextCompat.getColor(context, R.color.foo)
val colorList = ColorStateList.valueOf(color)
TextViewCompat.setCompoundDrawableTintList(textView, colorList)

If you want to change the tint color of the drawable of any view (tested on API 29) :
private fun setTintColor(textView: TextView, color: Int) {
DrawableCompat.setTint(DrawableCompat.wrap(textView.background).mutate(),
ContextCompat.getColor(this, color))
}

For Kotlin. Use the below extension for the TextView drawable. It supports below and above API level of 23.
private fun TextView.setTextViewDrawableColor(color: Int) {
for (drawable in this.compoundDrawablesRelative) {
drawable?.mutate()
drawable?.colorFilter = PorterDuffColorFilter(
color, PorterDuff.Mode.SRC_IN
)
}
}
Note: You can also use this function in the RecyclerView item as well, It will not override the same color for each item

I faced the problem where I am changing the color of the compound drawable and except one rest of all the colors are constant. Confusing for me.!!!
the solution that worked for me is
// Pass through the each drawable and update the tint if drawable is set.
textView.compoundDrawables.filterNotNull().forEach { drawable ->
drawable.mutate()
drawable.setTint(drawableColor)
}
Without the mutate(), the things were working partially. I got the more details here Drawable Mutations .
For the interest of the reader, I am providing a quick summery below.
Android Drawables are the drawing containers. Such as BitmapDrawable is used to display the images, ShapeDrawable is used to display the shapes and gradients.
Drawables are used extensively in the Android ecosystem thus they are optimized. So when views are created the different instances are spawned but the drawables associated with the view share the common state, called "Constant state". For example, if a drawable is a BitmapDrawable then the same bitmap is used with the all the corresponding copies or views. Advantage: It simply saves huge amount of memory.
Problem: As the same drawable is shared across the various views. Any change in the state of the drawable such as alpha, transformation etc. will impact all the places where it is used.
Solution: The mutate() method when called on a drawable, the constant state of the drawable is duplicated to allow you to change any property without affecting other drawables. Note: Bitmap is still shared.

How to fix sporadic drawable tinting?

I am using android support library and besides limited number of widgets that are tinted with color accentColor defined in theme I would like to tint some other drawables which I use across my app.
I do this via this code:
public class ActivityTest extends AppCompatActivity {
protected void tintDrawable(int color, int drawableId) {
Drawable drawable = DrawableCompat.wrap(ContextCompat.getDrawable(this, drawableId));
DrawableCompat.setTint(drawable, color);
}
protected void tintDrawables() {
int colorPrimary = getColorFromAttributeId(this, R.attr.colorPrimary);
tintDrawable(colorPrimary, R.drawable.drawable_1);
tintDrawable(colorPrimary, R.drawable.drawable_2);
tintDrawable(colorPrimary, R.drawable.drawable_3);
tintDrawable(colorPrimary, R.drawable.drawable_4);
tintDrawable(colorPrimary, R.drawable.drawable_5);
tintDrawable(colorPrimary, R.drawable.drawable_6);
}
public static int getColorFromAttributeId(Context context, int resourceAttributeId) {
int[] attributes = new int[] { resourceAttributeId };
TypedArray typedArray = context.obtainStyledAttributes(attributes);
int color = typedArray.getColor(0, Color.TRANSPARENT);
typedArray.recycle();
return color;
}
protected void doSetPreferencedThemeOnCreateSetContentView(Bundle savedInstanceState, int layoutResourceId) {
/* Catch 22:
* This order must be used otherwise an exception is thrown or theme is not applied.
* 1. setTheme()
* 1.b tintDrawables only after the theme is known we can get the color
* 2. onCreate()
* 3. setContentView() *
* 4. setSupportActionBar() */
// Apply theme. This must be done before super.onCreate()
setTheme(R.style.Theme_Custom_Theme); // in real case theme is retrieved from preferences
tintDrawables();
super.onCreate(savedInstanceState);
setContentView(layoutResourceId);
}
#Override
public void onCreate(Bundle savedInstanceState)
{
doSetPreferencedThemeOnCreateSetContentView(savedInstanceState, R.layout.activity_test);
}
}
It looks complicated but it is easy to understand. The problem is that my drawables are tinted "randomly". Some are, and some are not and retain the color as set in original png. To make matters worse if I leave the activity and come back, the result might be different. There could be more drawables tinted correctly or less.
What I am guessing is that tinting is asynchronous and the layout gets created before tint is applied to all drawables. But this is just a guess.
This problem is annoying as my UI depends on correct tinting, White icons on white background are not much of use. Neither are black on black.
How to enforce correct tinting of drawables?

I know this is old, but I ran in to the same problem. Calling mutate() on the drawable ensures that it will not share its state with any other drawable. From the docs:
"By default, all drawables instances loaded from the same resource share a common state; if you modify the state of one instance, all the other instances will receive the same modification"
In my case, this was causing random problems with the tinting.

Can't apply a colorFilter to text selection handles

I'm trying to bring material text selection handles to my app. I got drawables from the SDK for middle/right/left handle (bitmaps) and text cursor (9-patch), and set:
<item name="android:textSelectHandleLeft">#drawable/text_select_handle_left_mtrl_alpha</item>
<item name="android:textSelectHandleRight">#drawable/text_select_handle_right_mtrl_alpha</item>
<item name="android:textSelectHandle">#drawable/text_select_handle_middle_mtrl_alpha</item>
<item name="android:textCursorDrawable">#drawable/text_cursor_mtrl_alpha</item>
It works as expected. However, in Lollipop these drawables are tinted with a particular color in XML using the android:tint attribute, which I can't use on API<21. So I'm trying to set a color filter at runtime.
Text cursor does not get tinted. I think this might be due to it being a 9 patch. How can a 9-patch drawable be filtered at runtime? I tried probably all of PorterDuff.Modes.
Right/left handles are black, while middle handle is white.
I.e., non of them is green as I would like. Why?
As you can see above, I set up four ImageView below my edit text, and they instead get tinted.
private void setUpTextCursors() {
Drawable left = getResources().getDrawable(R.drawable.text_select_handle_left_mtrl_alpha);
Drawable right = getResources().getDrawable(R.drawable.text_select_handle_right_mtrl_alpha);
Drawable middle = getResources().getDrawable(R.drawable.text_select_handle_middle_mtrl_alpha);
Drawable cursor = getResources().getDrawable(R.drawable.text_cursor_mtrl_alpha);
ColorFilter cf = new PorterDuffColorFilter(mGreenColor, PorterDuff.Mode.SRC_IN);
/**
* tint my ImageViews, but no effect on edit text handles
*/
left.setColorFilter(cf);
right.setColorFilter(cf);
middle.setColorFilter(cf);
/**
* no effect whatsoever
*/
cursor.setColorFilter(cf);
}
Looks like here we have both a 9-patch tinting issue - since filter fails even on test ImageViews - and an issue related to the fact that none of the applied filters get considered by the text selection manager.
Relevant source code about that is from the TextView class and from this Editor hidden helper class which I found somehow. Spent some time on it but still can't tell why my filters are ignored.
To #pskink: let cursor be the filtered drawable, I can have:
<ImageView
android:id="#id/1"
android:src="#drawable/cursor_drawable" />
<ImageView
android:id="#id/2" />
The first won't be tinted, but if I call imageView2.setBackground(cursor), then it's tinted.
Also if I have
<item name="android:textSelectHandle">#drawable/cursor_drawable</item>
this affects the edit selection (because I override the default cursor) but it's not tinted, again.

you need to override the default Resources used by your Activity:
// your activity source file
Resources res;
#Override
public Resources getResources() {
if (res == null) {
res = new TintResources(super.getResources());
}
return res;
}
the custom Resources class will override getDrawable() method so you can intercept creating your Drawables and set up the color filter, for example:
class TintResources extends Resources {
public TintResources(Resources resources) {
super(resources.getAssets(), resources.getDisplayMetrics(), resources.getConfiguration());
}
#Override
public Drawable getDrawable(int id) throws NotFoundException {
Drawable d = super.getDrawable(id);
if (id == R.drawable.text_cursor_material) {
// setup #drawable/text_cursor_material
d.setColorFilter(0xff00aa00, PorterDuff.Mode.SRC_IN);
}
return d;
}
}
the same way you can setup other Drawables (#drawable/text_select_handle_*_material), note you need that not direct way since EditText doesn't have getter methods for accessing those Drawables

This is just a partial answer, and we can also consider it quite bad, since it's a workaround. I was able to load just the handles (i.e., the BitmapDrawables) inside the edittext (or any other selection stuff) by pointing at XML files rather than at raw png files. I.e. I set:
<item name="android:textSelectHandleLeft">#drawable/text_select_handle_left_material</item>
<item name="android:textSelectHandleRight">#drawable/text_select_handle_right_material</item>
<item name="android:textSelectHandle">#drawable/text_select_handle_middle_material</item>
<item name="android:textCursorDrawable">#drawable/text_cursor_material</item>
where these are xml drawables like:
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/text_select_handle_left_mtrl_alpha" />
or
<nine-patch xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/text_cursor_mtrl_alpha" />
If I filter these drawables, I found them tinted both in views and in selections. So I altered my method like such:
private void setUpTextCursors() {
ColorFilter cf = new PorterDuffColorFilter(mColorControlActivated, PorterDuff.Mode.SRC_IN);
BitmapDrawable left = (BitmapDrawable) getResources().getDrawable(R.drawable.text_select_handle_left_material);
BitmapDrawable middle = (BitmapDrawable) getResources().getDrawable(R.drawable.text_select_handle_middle_material);
BitmapDrawable right = (BitmapDrawable) getResources().getDrawable(R.drawable.text_select_handle_right_material);
// NinePatchDrawable cursor = (NinePatchDrawable) getResources().getDrawable(R.drawable.text_cursor_material);
left.setColorFilter(cf);
right.setColorFilter(cf);
middle.setColorFilter(cf);
// cursor.setColorFilter(cf); this does not work: cursor still white!
}
However, while this works for left, right, and middle, something is still wrong with the 9-patch cursor, because I can't get it tinted.

How to set different images on ImageView's enabled/disabled programmatically

I've a requirement in which an ImageView's enabled state is changed.
I have 2 images: one for the enabled state & another for the disabled state.
Without using a selector, how can I change the Image src when the setEnabled(true/false) is changed?
That is:
imageView.setEnabled(true);
imageView - use image imgEnabled.png
imageView.setEnabled(false);
imageView - use image imgDisabled.png
Thank You

Try this
if(imageView.isEnabled())
{
imageView.setBackgroundResource(R.drawable.imgEnabled);
}
else
{
imageView.setBackgroundResource(R.drawable.imgDisabled);
}

You can do it by setting the image yourself using setImageResource.
But this may not be appropriate, since your view's state may be changed from your code anywhere.
imageView.setEnabled(true);
imageView.setImageResource(R.drawable.imgEnabled);
imageView.setEnabled(false);
imageView.setImageResource(R.drawable.imgDisabled);
You can also write your own class that extends ImageView
and override the following method
#Override
protected void drawableStateChanged() {
super.drawableStateChanged();
if(isEnabled())
{
//set drawable for enabled state here
}
else
{
//set drawable for disabled state here
}
}

you can use this to change image resource-
imageView.setBackgroundResource(R.drawable.image);

Why does calling setBackgroundColor on a view break its long click color change and highlighting?

In Android, by default when you long click on a list item, it goes from the highlight color to white indicating that the user has held it down and a context item will be displayed. Also, you can use the trackball (or arrow buttons on some phones) to select list items rather then using your fingers.
However, I have a ListView whose item's views I am calling setBackgroundColor on, and both of those expected behaviors no longer work. Anybody know why this is and how to fix it?
Notes: Setting the background color in the xml is not an option because I need to be able to set/change the color dynamically.
The code for my newView function is as follows:
#Override
public View newView(Context ctx, Cursor cursor, ViewGroup parent)
{
View view = new View(mCtx);
final LayoutInflater li = (LayoutInflater) mCtx.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view = li.inflate(R.layout.task_list_item, null);
return view;
}

By default, ListView has a Selector that will play a TransitionDrawable when you longpress a list item. However, if your list item view has a solid background, then you won't be able to see the selector's longpress animation (or on any other states) , because it's covered up by the list item's background.
If you want to see the selector's longpress animation/selected/pressed state, then the list item's has to have a transparent background when the item is selected/pressed/longpressed. You can do it by using a StateListDrawable as your item's background instead of a solid color.
Here is a sample of StateListDrawable for that purpose:
public class ColorfulListItemDrawable extends StateListDrawable {
private final PaintDrawable mColor;
public ColorfulListItemDrawable(int color) {
mColor = new PaintDrawable(color);
initialize();
}
private void initialize() {
Drawable color = mColor;
Drawable selected = new ColorDrawable(Color.TRANSPARENT);
addState(new int[] {android.R.attr.state_pressed, android.R.attr.state_enabled,
android.R.attr.state_window_focused}, selected);
addState(new int[] {android.R.attr.state_pressed, android.R.attr.state_enabled,
android.R.attr.state_window_focused,android.R.attr.state_selected}, selected);
addState(new int[] {android.R.attr.state_enabled,android.R.attr.state_window_focused, android.R.attr.state_selected}, selected);
addState(new int[] {}, color);
}
public void setColor(int color) {
mColor.getPaint().setColor(color);
mColor.invalidateSelf();
}
}

When you set the background color, you're overriding the default background, which seems to be a color animation. If you want a different color, you'll have to create the animation with the color you want.

You want to create a Selector that deals with the Selected state.
As you can't use an XML solution, you want to create a StateListDrawable programmatically and set it with ListView.setSelector.

This probably is happening because you are just setting single color to the layout.. where as by default it has something like stateList and it has different colors for different state (clicked, focussed, lingClicked) etc... you can create one and use it to set the backGround...

I have a one line solution if you're using ListView (it probably works on all views), in your ListView code, add android:drawSelectorOnTop="true".
For example:
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/listID"
android:drawSelectorOnTop="true"
...
/>