Home » Android » How to add left drawable in Spinner View in Android

How to add left drawable in Spinner View in Android

Posted by: admin June 15, 2020 Leave a comment

Questions:

Hello I am trying to add left drawable in Spinner but I didn’t find any propery for this as you do same in EditText using android:drawableLeft="@drawable/password_drawable". Is there any correct way to achieve same in Spinner in Android.

Here in my case there should be left drawable only this state which I gave in the screenshot, when user click on the Spinner I don’t want to have left drawable there in open drop down list in Spinner

I’m trying like this where there is no such attribute

<Spinner
    android:id="@+id/selectSpinner"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/sign_up_views_vertical_top_margin"
    android:background="@drawable/edittext_border"
     />

I want something like below screenshot

enter image description here

Currently it is looking like below

enter image description here

and when I set the background of the Spinner then it looks like

<Spinner
    android:id="@+id/selectSpinner"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/sign_up_views_vertical_top_margin"
    android:background="@drawable/selectone_drawable"
    android:entries="@array/select_type" />

enter image description here

Thanks in advance

How to&Answers:

Create a nine-patch image and set it as the background of the Spinner, then add a left padding, should do the trick.

Answer:

create a xml drawable @drawable/gradient_spinner
`

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item><layer-list>
        <item><shape>
            <gradient android:angle="90" android:endColor="@color/myTextPrimaryColor" android:startColor="@color/myTextPrimaryColor" android:type="linear" />

            <stroke android:width="1dp" android:color="@color/bg_eo" />

            <corners android:radius="4dp" />

            <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
        </shape></item>
        <item ><bitmap android:gravity="right|center" android:src="@drawable/expnd" />
        </item>
    </layer-list></item>

</selector> `

set spinner background android:background=”@drawable/gradient_spinner”

Answer:

Try this,

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
        @Override
        public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
           if(view!=null) {
               ((TextView) view).setPadding(0, 0, 0, 0);//remove extra padding
               ((TextView)view) .setCompoundDrawablesWithIntrinsicBounds(AppCompatResources.getDrawable(context, R.drawable.your_image), null, null, null);
               ((TextView) view).setCompoundDrawablePadding(20);// to set drawablePadding
           }
        }

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

        }
    });

Answer:

layout looks like this

dummy.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list android:opacity="transparent">
            <item android:gravity="left" android:width="100dp" 
            android:end="300dp">
                <shape>
                    <solid android:color="#269cf7">

                    </solid>
                </shape>
            </item>
            <item android:gravity="right" android:width="300dp" android:start="100dp">
                <shape>
                    <solid android:color="@color/transparent">

                    </solid>
                </shape>
            </item>
            <item android:width="100dp" android:end="300dp">
                <bitmap android:src="@drawable/arrow_bottom" android:gravity="center"/>
            </item>
        </layer-list>
    </item>
</selector>

in layout file add this code

<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>

Answer:

As Mark Said, you should put the following image as a background of the spinner and take required left padding so that the text will be right after the arrow image.

enter image description here

Following is some code to make you understand more 😉

<Spinner
    android:id="@+id/selectSpinner"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/sign_up_views_vertical_top_margin"
    android:background="@drawable/the_attached_drawable"
    android:paddingLeft="@dimen/required_padding_for_each_screen_size"
    android:entries="@array/select_type" />