Android custom spinner text overlapping right icon

Question

I'm using custom design for my spinner but the text got overlap on the right icon of the spinner. Please have a look on the attached image.

<Spinner
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:spinnerMode="dialog"
                android:background="@drawable/spinner_bg"
                android:id="@+id/mySpinner"
                android:prompt="Testing"
                android:layout_marginTop="8dp" />

spinner_bg.xml :

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <layer-list>
        <item>
            <shape>
                <gradient
                    android:startColor="#6e95bd"
                    android:endColor="#517295"
                    android:angle="270" />
                <stroke
                    android:width="1dp"
                    android:color="#000" />
                <corners
                    android:radius="50dp" />
            </shape>
        </item>
        <item>
            <bitmap android:gravity="right|center_vertical"  android:src="@mipmap/ic_spinner_down"/>
        </item>
    </layer-list>
</item>
</selector>

Answer 1

Try using android:paddingRight="30dp" or more according to your icon.

<Spinner
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:spinnerMode="dialog"
   android:background="@drawable/spinner_bg"
   android:id="@+id/mySpinner"
   android:prompt="Testing"
   android:layout_marginTop="8dp"
   android:paddingRight="30dp" />

Answer 2

Since the background is set to the spinner, no matter what the width of the spinner is, it will always overlap that right icon, so the easiest way to achieve what you are trying to achieve is

<LinearLayout
        android:layout_width="match_parent"
        android:background="@drawable/spinner_bg"
        android:layout_height="wrap_content">
    <Spinner
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:spinnerMode="dialog"
            android:layout_gravity="left"
            android:gravity="left"
            android:background="@android:color/transparent"
            android:id="@+id/mySpinner"
            android:prompt="Testing"
            android:layout_marginTop="8dp" />
</LinearLayout>

Answer 3

Make custom adapter for spinner and set the layout of single row as below :

 <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="wrap_content"
    android:layout_width="match_parent">
       <TextView 
       android:layout_height="wrap_content"
       android:layout_width="wrap_content"
       android:layout_gravity="left"/>
     <ImageView 
       android:layout_height="wrap_content"
       android:layout_width="wrap_content"
       android:layout_gravity="right"/>
    </FrameLayout>