Spinner background color with dropdowndown icon

Question

I'm trying to create a spinner with some background color and dropdownicon.But whenever i'm applying the background color the dropdown icon disappers.So how to have Spinner with dropdown icon & with different background color. Please have a look on the xml that i'm trying below:

Expected OutPut:

Getting (without drop down icon)

Background removed then i'm getting the following output:

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginLeft="@dimen/dp_5"
        android:layout_marginRight="@dimen/dp_5"
        android:layout_weight="8"
        android:padding="@dimen/dp_8"
        app:cardElevation="@dimen/dp_5">

        <android.support.v7.widget.AppCompatSpinner
            android:id="@+id/appCompatSpinner"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:entries="@array/clubName"
            android:textAlignment="center"
            android:spinnerMode="dropdown"
           android:background="@color/colorPrimary_blue"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        </android.support.v7.widget.AppCompatSpinner>
    </android.support.v7.widget.CardView>

Answer 1

Create .xml Class and write this coad.

   <?xml version="1.0" encoding="utf-8"?>
     <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <color android:color="@color/InputBg" />
</item>
<item android:gravity="center_vertical|right" android:right="8dp">
    <layer-list>
        <item android:width="12dp" android:height="12dp" android:gravity="center" android:bottom="10dp">
            <rotate
                android:fromDegrees="45"
                android:toDegrees="45">
                <shape android:shape="rectangle">
                    <solid android:color="#666666" />
                    <stroke android:color="#aaaaaa" android:width="1dp"/>
                </shape>
            </rotate>
        </item>
        <item android:width="30dp" android:height="10dp" android:bottom="21dp" android:gravity="center">
            <shape android:shape="rectangle">
                <solid android:color="@color/InputBg"/>
            </shape>
        </item>
    </layer-list>
</item>

        And Apply like this in Spinner.
 <Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/spinner_bg" />

Answer 2

Simple workaround to this just wrap your spinner in framelayout and set the background color of layout of your choice

 <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/blue"
    >

    <Spinner
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

</FrameLayout>