Android Spinner: Remove Extra White Space Between Text and Dropdown Icon

Question

I have a spinner and by default there is extra white-space between text and dropdown icon which I really don't like and wanna remove it.

Tried searching over the web but did not get anything which could help me. Anybody here who has done it earlier?

Cologne

Customize Spinner – Kuehn

Possible duplicate of How to customize a Spinner in Android – Granniah

Neither of the solution there worked for me – Cologne

Answer 1

I did it myself after playing with Spinner. Here is the solution which worked pretty well.

First create a Dropdown with indicator image of your choice.

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape
        android:shape="rectangle"/>
</item>
<item
    android:width="24dp"
    android:height="24dp"
    android:gravity="right|center_vertical">
    <bitmap
        android:src="@drawable/ic_dropdown"
        android:tint="@color/colorPrimaryDark"/>
</item></layer-list>

Then assign it to the background of Spinner.

<Spinner
        android:id="@+id/basket_spinner_item_quantity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:spinnerMode="dropdown"
        android:padding="0dp"
        android:background="@drawable/ic_spinner_dropdown"/>

Now, adjust the padding and alignment of spinner item as per your requirement.

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/simple_spinner_text_quantity"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:paddingLeft="20dp"
android:paddingRight="25dp"
android:gravity="right"
android:textAlignment="gravity"/>

Cologne

A good start. I needed to add android:right="24dp" on the first item and android:left="24dp"on the second item to prevent the text to colide with the icon. – Tarrah

I gave the android:right="24dp" & android:left="24dp" still the text is colliding with the drawable icon. Any solution please? – U

From where do you get @drawable/ic_dropdown? – Simulation

Answer 2

set gravity to end and adjust it with an appropriate value :

  android:gravity="end"
  android:paddingEnd="20dp"

Obturate

Answer 3

Simply just add the following attribute to your spinner xml element:

For API < 17:

android:gravity="right"

For API => 17:

android:gravity="end"

Harmonious

Answer 4

Quickfix

android:layout_marginStart="-40dp"

play with negative margin, according to need. inside you spinner item xml

Cantabrigian

Negative margins are not at all recommended. If you ever need to use negative margins, you are doing it wrong! – Barnet

@Barnet indeed , that's why i wrote quickfix, i am still looking for solution. if found any please send me link, thanks. – Cantabrigian

@AbhishekGarg maybe adding "Quickfix! Not Recommended" would be helpful for beginners who might use it without being fully aware of the consequences.! – Barnet

@Barnet thank you, i completely agree with your thought, i noted it down for future.you can also take a quick read of policies of stackoverflow to know what is recommended or what not. – Cantabrigian

Answer 5

Use below code for Quick fixed

 <Spinner
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="-9dp"
        android:layout_marginTop="10dp"
        android:entries="@array/almanac"
        android:gravity="left"
        android:padding="0dp"
        android:spinnerMode="dropdown"
        android:layout_marginStart="-9dp" />

Dislike

Answer 6

For some reason giving padding:20dp solved the problem for me. Also, play with the values of translationX to adjust the position of the dropdown icon. At last, you can use layout_marginLeft and layout_marginRight to move the whole dropdown accordingly.

Chalone

Answer 7

Remove padding of spinner in xml

<Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="left"
    android:padding="0dp"     
    android:id="@+id/my_spinner">

SpinnerAdapter or your Adapter class should be customized according to fit your needs.

SpinnerAdapter.getView(position, convertView, parent)    
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View view = super.getView(position, convertView, parent);
        view.setPadding(0, view.getPaddingTop(), view.getPaddingRight(), view.getPaddingBottom());
        return view;
}

Change style attribute in your spinner list item layout

Ishtar