How to add border to a spinner without affecting its popup menu

Question

I'm trying to add border to my spinners.

This is what I've done so far:

In my styles.xml:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
      <!-- ... -->       
      <item name="android:spinnerItemStyle">@style/spinnerItemStyle</item>
      <!-- ... -->
</style>

<style name="spinnerItemStyle">
        <item name="android:padding">@dimen/form_horizontal_padding_normal</item>
        <item name="android:textAppearance">@style/TextAppearance.AppCompat.Subhead</item>
        <item name="android:background">@drawable/spinner_border</item>
        <item name="android:textColor">@color/secondary_text</item>
 </style>

spinner_border.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <solid android:color="@android:color/white"/>
    <corners android:radius="6dp"/>
    <stroke
        android:width="1dp"
        android:color="@color/detail_accent_pane_background"/>

</shape>

Without the changes this is how the popup menu looks:

After the changes the spinners have the border

But the popup menu also has the the border, which is not what I want.

How can I add border to spinners without affecting their popup menus?

Thanks.

Answer 1

Add

android:popupBackground="@android:color/transparent" 

to your <Spinner/> view in xml

Answer 2

This might be helpful to you

backgroud_spinner.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke android:width="0dp" android:color="#80FFFFFF" />
    <solid android:color="#80FFFFFF"/>
</shape>

And apply this,

 android:popupBackground="@drawable/backgroud_spinner"

It will make the popup fully transparent, But I don't know whether it suits you or not, When I used your drawables, it didn't show the image as you've shown in image.