Android Button drawableEnd Style Item

Question

I have a button style defined in my styles.xml file.

<style name="Button" parent="Widget.AppCompat.Button.Borderless.Colored">
    <item name="android:drawablePadding">@dimen/padding_medium</item>
    <item name="android:paddingStart">@dimen/padding_medium</item>
    <item name="android:paddingEnd">@dimen/padding_medium</item>
    <item name="android:textAppearance">@style/ButtonTextAppearance</item>
</style>
<style name="Button.Secondary" parent="Button">
    <item name="android:background">@drawable/secondary_button_state</item>
    <item name="android:textColor">@color/blue</item>
</style>
<style name="Button.Secondary.Large" parent="Button.Secondary">
    <item name="android:drawableEnd">@drawable/ic_chevron</item>
    <item name="android:drawableTint">?colorPrimary</item>
    <item name="android:gravity">center|start</item>
</style>

And I'm using it in a view

<androidx.appcompat.widget.AppCompatButton
   android:id="@+id/action_date_range"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   style="@style/Button.Secondary.Large"
   android:text="@{viewModel.overrideDateRange}"
   tools:text="@string/override_date_range" />

The issue I'm having is with <item name="android:drawableEnd">@drawable/ic_chevron</item>. This drawable item is not being rendered in api 23 and below, api 24 and up it's fine.

EDIT:

This is my drawable resource

<vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:width="24dp"
  android:height="24dp"
  android:viewportWidth="24"
  android:viewportHeight="24">

  <path
    android:pathData="M7,19.4099l1.5443,1.5901l8.7414,-8.9993l-8.7414,-9.0007l-1.5443,1.5916l7.1956,7.4271z"
    android:strokeWidth="1"
    android:fillColor="#FFFFFF"
    android:fillType="evenOdd"
    android:strokeColor="#00000000" />

</vector>

What type of drawable resource is *ic_chevron*? – Bö macht Blau Nov 27 '18 at 21:03 — Bö macht Blau, Nov 27 '18 at 21:03
I added my drawable resource – tgrable Nov 27 '18 at 21:40 — tgrable, Nov 27 '18 at 21:40

score 1 · Accepted Answer · answered Nov 28 '18 at 19:38

This seems to be a bug (I encountered it in emulators and devices running Android 6): the drawable is rendered but the style attribute <item name="android:drawableTint">?colorPrimary</item> does not have any effect, so the drawable is white.

You can test this by changing android:fillColor="#FFFFFF" to android:fillColor="#000000" in the path of the vector drawable.

So you'll have to set the color programmatically for lower Api levels:

For Android 6, you can introduce a color resource file res/color/my_button_tint.xml defining a ColorStateList. Since you need only one color, one item in the selector structure will be sufficient. But you could have more colors depending on the Button's state

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="?android:attr/colorPrimary"/> 
</selector>

Now you can write

if(Build.VERSION.SDK_INT == Build.VERSION_CODES.M){
    Context ctx = myButton.getContext(); // use any available Context here
    ColorStateList csl = ContextCompat.getColorStateList(ctx, R.color.my_button_tint);
    myButton.setCompoundDrawableTintList(csl);
}

For lower Api levels you can change the color of the Drawable by applying a ColorFilter, see for example this post

Or you simply change the android:fillColor="#ffffff" in the path of the vector drawable to the desired color.

Android Button drawableEnd Style Item

1 Answers1