Style android spinner

I’m trying to get my android app a bit more stylish and have made some progress but the spinner dropdown are giving me trouble. I’ve got a screenshot to show you the problem:

How do I get rid of the white background

  • FileProvider Not Working with Camera
  • Android - retrieve string array from resources
  • Android: ActionBarSherlock search widget
  • how to know the calling activity in android
  • App Crash instantly without exception or log (seems like xamarin/mono bug)
  • Use a local database in Xamarin
  • What I want is the white box in the background to be transparent, as in the same grey overlay over the back screen as the rest of the screen outside the dropdown.

    Android 4.0, API 15 if I recall correctly.

    As requested here’s how I do it so far. These are snippets I think are relevant but I might have missed something.

    Here’s the xml for spinner:

    <Spinner
        android:id="@+id/edit_countrySpinner"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:entries="@array/edit_countryArray"
        android:gravity="center"
        android:prompt="@string/country_prompt" />
    

    In my values/style.xml. If I change the color of the background here the background in the dialog do change, but all the rest of the backgrounds as well. I haven’t figure out how to jus change the background in the dropdown dialog.

    <style name="appcin" parent="@android:style/Theme.NoTitleBar.Fullscreen">
        <item name="android:spinnerStyle">@style/spinnerStyle</item>
        <item name="android:spinnerItemStyle">@style/SpinnerItem</item>
        <item name="android:spinnerDropDownItemStyle">@style/SpinnerDropDownItem</item> -->
        <item name="android:background">#FFFFFF</item>
    </style>
    <style name="spinnerStyle">
        <item name="android:background">@drawable/pink_white_dropdown</item>
        <item name="android:clickable">true</item>
    </style>
    <style name="SpinnerItem">
        <item name="android:textColor">#993399</item>
        <item name="android:background">@drawable/pink_white_dropdown</item>
        <item name="android:maxHeight">10dip</item>
    </style>
    <style name="SpinnerDropDownItem">
        <item name="android:textColor">#993399</item>
        <item name="android:background">#FFFFFF</item>
    </style>
    

    I’ve tried adding this to the app theme but none of them made any difference, the background was still white.

    <...theme....>
       <item name="android:dropDownListViewStyle">@style/DropDownStyle</item>
       <item name="android:dropDownSpinnerStyle">@style/DropDownStyle</item>
       <item name="android:dropDownSelector">@style/DropDownStyle</item>
    </... theme ...>
    <style name="DropDownStyle">
        <item name="android:background">#FFF000</item>
        <item name="android:popupBackground">#FFF000</item>
        <item name="android:cacheColorHint">#FFF000</item>
    </style>
    

    In drawable/pink_white_dropdown, just showing the same image for all the cases. pink_white_arrow is a 9patch image I’ve made. There are lots of guides, here’s one I found by 30sec on google.

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
      <item android:state_window_focused="false" android:state_enabled="true"
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_window_focused="false" android:state_enabled="false"
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_pressed="true" 
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_pressed="false" 
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_focused="true" android:state_enabled="true" 
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_enabled="true" 
          android:drawable="@drawable/pink_white_arrow"/>
      <item android:state_focused="true" 
          android:drawable="@drawable/pink_white_arrow"/>
      <item 
          android:drawable="@drawable/pink_white_arrow"/>
    </selector>
    

    Somewhere in these files I figure something should be made transparent, but I don’t know where.

    Related posts:

    Eclipse Android Change API Level
    How to debug apk signed for release?
    AVD won&#039;t launch (SDK Tools 22.6.2)
    Android Studio: javadoc is empty on hover
    SQLiteOpenHelper vs ContentProvider
    &#039;org.apache.http.HttpEntity&#039; is deprecated. How to solve this error in android stu...
  • does google charge for purchases in app?
  • Android permission of creating database
  • How to get GPS data from Android phone?
  • Android Volley double post when have slow request
  • Android : What should I do instead of using a deprecated function(getwidth() )?
  • Change the margin color of InfoWindow view of marker in google maps api v2
  • 3 Solutions collect form web for “Style android spinner”

    Remove the SpinnerStyle background attribute.

    Remove this:

    <style name="spinnerStyle">
        <item name="android:background">@drawable/whitish_rectangle</item>
    </style>
    

    which is what draws the background white rectangle.

    Building on the code in your question, here is a basic example on how you can style your Spinner:

    The styles.xml file sets styles for the SpinnerItem and SpinnerDropDownItem:

    <resources>
        <style name="customtheme" parent="@android:style/Theme.Light">
            <item name="android:spinnerItemStyle">@style/SpinnerItem</item>
            <item name="android:spinnerDropDownItemStyle">@style/SpinnerDropDownItem</item>
        </style>
        <style name="SpinnerItem">
            <item name="android:textColor">#993399</item>
            <item name="android:background">@drawable/my_rectangle</item>
        </style>
        <style name="SpinnerDropDownItem">
            <item name="android:textColor">#993399</item>
            <item name="android:background">@drawable/my_rectangle</item>
        </style>
    </resources>
    

    For testing, I’ve created a bright-colored drawable shape, called my_rectangle.xml. Replace this with your own drawable:

    <?xml version="1.0" encoding="UTF-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" >
        <solid android:color="#ff0000" />
        <stroke
            android:width="1dp"
            android:color="#888888" />
    </shape>
    

    Add the Spinner to the Activity's layout:

    <LinearLayout 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:padding="40dip">
        <Spinner
            android:id="@+id/edit_countrySpinner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:entries="@array/location_names"/>
    </LinearLayout>
    

    This produces:

    enter image description here

    with no white square in the background.

    add

    <item name="android:popupBackground">@null</item>
    

    to your spinner style.

    I had the same problem, and the below code worked for me:

    <item name="android:popupBackground">@null</item> 
    
    Android Babe is a Google Android Fan, All about Android Phones, Android Wear, Android Dev and Android Games Apps and so on.