How to set dropdown arrow in spinner?

Viewed 169988

I tried to set spinner with drop down arrow but i couldn't fix it can anyone help me with this? I have attached the source code.

my class file:

    import android.os.Bundle;
    import android.view.View;
    import android.widget.AdapterView;
    import android.widget.ArrayAdapter;
    import android.widget.Button;
    import android.widget.EditText;
    import android.widget.Spinner;
    import android.widget.AdapterView.OnItemSelectedListener;
    import android.widget.Toast;

        public class topup extends Activity  {
            Spinner spinner,spin1,spin2,spin3;
                EditText ed,ed1;
                Button btn;
                List<String> list, list1,list2,list3;
                    private String[] countries_list={"01","02","03","04","05","06","07","08","09","10","11","12"};

                    protected void onCreate(Bundle savedInstanceState) {
                        super.onCreate(savedInstanceState);
                        setContentView(R.layout.topup);


                        spinner = (Spinner) findViewById(R.id.spinner1);
                        spin1= (Spinner) findViewById(R.id.spinner2);
                        spin2= (Spinner) findViewById(R.id.spinner3);
                        spin3= (Spinner) findViewById(R.id.spinner4);
                        ed = (EditText) findViewById(R.id.editText3);

                        list = new ArrayList<String>();
                        list.add("");
                        list.add("select");
                        list.add("01");
                        list.add("02");
                        list.add("03");
                        list.add("04");
                        list.add("05");
                        list.add("06");
                        list.add("07");
                        list.add("08");
                        list.add("09");
                        list.add("10");
                        list.add("11");
                        list.add("12");

                        ArrayAdapter<String> adp = new ArrayAdapter<String>
                            (this, android.R.layout.simple_spinner_item, list);
                        //adp.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

                        spinner.setAdapter(adp);


                        spinner.setOnItemSelectedListener(new OnItemSelectedListener() {

                            //@Override
                            public void onItemSelected(AdapterView<?> parent, View arg1,int arg2, long arg3) {
                                // TODO Auto-generated method stub
                                 String item = spinner.getItemAtPosition(1).toString();
                                 //Toast.makeText(spinner.getContext(), "Selected: " + item, Toast.LENGTH_LONG).show();
                                 String ss=spinner.getSelectedItem().toString();
                                 String 
                            }


                            public void onNothingSelected(AdapterView<?> arg0) {
                                // TODO Auto-generated method stub

                            }
                        });

my xml file:

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/back1"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="55dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_marginTop="20dp" 
        android:background="@drawable/red">

        <Spinner
            android:id="@+id/spinner1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:dropDownWidth="fill_parent" 
         />

    </LinearLayout>

    <EditText
        android:id="@+id/editText1"
        android:layout_width="wrap_content"
        android:layout_height="55dp"
        android:layout_alignLeft="@+id/linearLayout1"
        android:layout_alignRight="@+id/linearLayout1"
        android:layout_below="@+id/linearLayout1"
        android:layout_marginTop="25dp"
        android:background="@drawable/red"
        android:ems="10"
        android:hint="enter card number" >

        <requestFocus />
    </EditText>

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="wrap_content"
        android:layout_height="55dp"
        android:layout_alignLeft="@+id/editText1"
        android:layout_alignRight="@+id/editText1"
        android:layout_below="@+id/editText1"
        android:layout_marginTop="33dp"
        android:orientation="horizontal" 
        android:background="@drawable/red">

        <Spinner
            android:id="@+id/spinner3"
            android:layout_width="72dp"
            android:layout_height="wrap_content"
             />

        <Spinner
            android:id="@+id/spinner2"
            android:layout_width="72dp"
            android:layout_height="wrap_content" 
            />

        <EditText
            android:id="@+id/editText2"
            android:layout_width="22dp"
            android:layout_height="match_parent"
            android:layout_weight="0.18"
            android:ems="10"
            android:hint="enter cvv" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout3"
        android:layout_width="wrap_content"
        android:layout_height="55dp"
        android:layout_alignParentLeft="true"
        android:layout_alignRight="@+id/linearLayout2"
        android:layout_below="@+id/linearLayout2"
        android:layout_marginTop="26dp"
        android:orientation="vertical"
        android:background="@drawable/red" >
    </LinearLayout>

    <Spinner
        android:id="@+id/spinner4"
        android:layout_width="15dp"
        android:layout_height="18dp"
        android:layout_alignBottom="@+id/linearLayout3"
        android:layout_alignLeft="@+id/linearLayout3"
        android:layout_alignRight="@+id/linearLayout3"
        android:layout_alignTop="@+id/linearLayout3"

      />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/linearLayout3"
        android:layout_marginTop="18dp"
        android:text="Add Amount" 
        android:background="@drawable/buttonsty"/>



</RelativeLayout>
12 Answers

If you have a vector icon and not bitmap, you can set it this way.

<item>
    <layer-list>
        <item>
            <shape android:shape="rectangle">
                <gradient android:angle="270" android:centerColor="#65FFFFFF" android:centerY="0.2" android:endColor="#00FFFFFF" android:startColor="@color/light_gray" />
                <stroke android:width="1dp" android:color="@color/darkGray" />
                <corners android:radius="@dimen/edit_text_corner_radius" />
            </shape>
        </item>

        <item
            android:right="5dp"
            android:gravity="center|right"
            android:drawable="@drawable/gardify_spinner_dropdown_icon"/>

    </layer-list>
</item>

From the API level 16 and above, you can use following code to change the drop down icon in spinner. just goto onItemSelected in setonItemSelectedListener and change the drawable of textview selected like this.

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
        @Override
        public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
  // give the color which ever you want to give to spinner item in this line of code               
//API Level 16 and above only. 
           ((TextView)parent.getChildAt(position)).setCompoundDrawablesRelativeWithIntrinsicBounds(null,null,ContextCompat.getDrawable(Activity.this,R.drawable.icon),null);
 //Basically itis changing the drawable of textview, we have change the textview left drawable.

}
        @Override
        public void onNothingSelected(AdapterView<?> parent) {

}
    });

hope it will help somebody.

dummy.xml (drawable should be of very less size. i have taken 24dp)

<?xml version="1.0" encoding="utf-8"?>
<layer-list android:opacity="transparent" xmlns:android="http://schemas.android.com/apk/res/android">
            <item android:width="100dp" android:gravity="right" android:start="300dp">
                <bitmap android:src="@drawable/down_button_dummy_dummy" android:gravity="center"/>
            </item>
</layer-list>

layout file snippet

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardUseCompatPadding="true"
        app:cardElevation="5dp"
        >
     <Spinner
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="@drawable/dummy">

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

click here to see resultant rendered layout

Check below sample code.

<FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="40dp"
                    android:background="@drawable/buttonbackground"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="@dimen/dimen_5"
                    android:layout_marginRight="10dp"
                    android:layout_marginBottom="5dp"
                    android:orientation="horizontal">
                    <Spinner
                        android:id="@+id/genderEdt"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:background="#EEEEEE"
                        android:layout_gravity="center_vertical"
                        android:fontFamily="@string/font_family_regular"
                        android:layout_marginLeft="3dp"
                        android:layout_marginRight="3dp"
                        android:textSize="15sp"/>

                    <ImageView
                        android:layout_gravity="center_vertical|end"
                        android:foregroundGravity="center_vertical"
                        android:layout_width="20dp"
                        android:layout_height="20dp"
                        android:src="@drawable/drop_down_arrow"
                        android:layout_marginRight="7dp"/>

                </FrameLayout>
Related