Change color of the drop down arrow of Spinner in XML

Question

As I wrote in my question, I want to change the color of the drop down arrow (the default arrow, not a custom arrow or something like that) of a Spinner in XML, but the problem is that I couldn't find anything to make reference to it from the XML.

Is it possible? If yes, how can I change the color?

Thanks in advance.

Answer 1

There are three ways to achieve that.

1. Through code:

In your xml, make sure your spinner has an id. Let's say we have a spinner with id "spinner".

In your code, add the following in your onCreate():

Spinner spinner = (Spinner) findViewById(R.id.spinner);
spinner.getBackground().setColorFilter(getResources().getColor(R.color.red), PorterDuff.Mode.SRC_ATOP);

where red is your defined color in colors.xml in the values folder.

2. Through xml:

For API 21+:

<Spinner
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:backgroundTint="@color/red" />

or if you use the support library, you can use:

<android.support.v7.widget.AppCompatSpinner
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:backgroundTint="@color/red" />

3. Through drawables:

You can use this online tool: http://android-holo-colors.com

This will generate custom drawables for any view you want with your preferred color. Make sure you select spinner, then download the resources.

Answer 2

I'm surprised noone had pointed it out, but you can just subclass Widget.AppCompat.Spinner and change backgroundTint

<style name="Spinner" parent="Widget.AppCompat.Spinner">
        <item name="backgroundTint">@color/spinnerTint</item>
</style>

and apply it to the Spinner

<Spinner
    style="@style/Spinner"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:spinnerMode="dropdown" />

Answer 3

use backgroundTint attribute

<Spinner
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:backgroundTint="@color/white"
        />

if min_SDK < 21(Lollipop) you should use AppCompatSpinner

<android.support.v7.widget.AppCompatSpinner
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:backgroundTint="@color/white"
        /> 

Answer 4

If (API 21+) {

you can use directly android:backgroundTint="@color/color", inside your Spinner:

<Spinner
   android:id="@+id/spinner"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:backgroundTint="@color/color" />

} else {

create your own style:

<style name="spinner_style" parent="Widget.AppCompat.Spinner">
        <item name="backgroundTint">@color/color</item>
</style>

then into Spinner:

<Spinner
   android:id="@+id/spinner"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   style="@style/spinner_style"/> 

}

Note: you can use the style method in all API's.

Answer 5

try this:

spinner_age.getBackground().setColorFilter(ContextCompat.getColor(this,
                R.color.spinner_icon), PorterDuff.Mode.SRC_ATOP);

Answer 6

<Spinner
            android:id="@+id/spinner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:backgroundTint="#00000" />

Only works above API Level 21

Answer 7

Use this dependency for create a very nice and easy spinner and use "app:arrowTint="@color/green" to change the arrow color