Ripple effect on the Spinner drop-down list colored background (appcompat-v7 V21)

Question

I tried applying a ripple effect to Spinner's dropdowns, for example:

activity.java

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource( this, R.array.array_name, R.layout.simple_spinner_dropdown_item); adapter.setDropDownViewResource(R.layout.simple_spinner_dropdown_item); Spinner mSpinner = (Spinner) findViewById(R.id.spinner); mSpinner.setAdapter(adapter); 

simple_spinner_dropdown_item.xml

 <?xml version="1.0" encoding="utf-8"?> <CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/text1" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/spinner_ripple" android:ellipsize="marquee" android:gravity="center_horizontal" android:padding="10dip" android:singleLine="true" android:textSize="14sp" /> 

spinner_ripple.xml

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item> <ripple android:color="?android:attr/colorControlHighlight"> <item><shape> <solid android:color="@android:color/white" /> </shape> </item> </ripple> </item> </selector> 

but in the drop-down list, it only works for the first item and only if the currently selected item is different than the first . In all other cases, it fills the background element with ripple color (like no ripple effect). Where is not my code?

Already tried : it doesn’t work to set a fixed color against the background of the drop-down list of elements and move the ripple effect under the Spinner element, for example:

simple_spinner_dropdown_item.xml

 <?xml version="1.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/text1" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:ellipsize="marquee" android:gravity="center_horizontal" android:padding="10dip" android:singleLine="true" android:textSize="14sp" /> 

activity_layout.xml

 <Spinner android:id="@+id/spinner" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawSelectorOnTop="true" android:dropDownSelector="@drawable/spinner_ripple" /> 

Answer 1

Your second approach is correct, but as mentioned in this question , the android:dropDownSelector does not work, and this is a well-known error.

In addition, if you want to change the drop-down background color, you need to install Spinner's android:popupBackground instead of setting the background of the drop-down element.

The whole solution would be this:

popup_background.xml

 <!--Based on Android popup_background_material.xml--> <!--This changes the background of the drop-down--> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="2dp" /> <solid android:color="@android:color/white" /> </shape> 

styles.xml

 <resources> <style name="AppTheme" parent="android:Theme.Material.Light"> <!--Workaround for the Android bug--> <item name="android:dropDownListViewStyle">@style/Theme.MyListView</item> </style> <style name="Theme.MyListView" parent="@android:style/Widget.Material.ListView.DropDown"> <item name="android:listSelector">@drawable/spinner_ripple</item> </style> </resources> 

activity.xml

 ... <Spinner android:id="@+id/spinner" android:layout_width="match_parent" android:layout_height="wrap_content" android:dropDownSelector="@drawable/spinner_ripple" android:popupBackground="@drawable/popup_background" /> ... 

spinner_ripple.xml (original)

 <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item> <ripple android:color="?android:attr/colorControlHighlight"> <item> <shape> <solid android:color="@android:color/white" /> </shape> </item> </ripple> </item> </selector> 

Answer 2

If you want your drop-down list items to be white by default and highlight them with a ripple effect only when the user touched them, you need to implement the correct list of states in the spinner_ripple.xml drawable file:

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"> <ripple android:color="?android:attr/colorControlHighlight" /> </item> <item android:state_pressed="false"> <shape> <solid android:color="@android:color/white" /> </shape> </item> </selector> 

Here android:state_pressed="true" means that the selector element should be applied only when the user actually clicks on the view. If you want to support other selector states, check out the StateListDrawable link.

Keep in mind that AppCompat-v7 v21 does not support ripple effect, according to the official Android developers blog :

Why is there no ripple on pre-Lollipop? Much of what makes RippleDrawable run smoothly is the new RenderThread from Android 5.0. To optimize performance in previous versions of Android, we left RippleDrawable for now.

Therefore, it will only work on Lollypop.

Answer 3

I believe you need two layers in spinner_ripple.xml

 <!-- Background --> <ripple android:color="#ff00ff00"> <item android:drawable="@android:color/black" /> <ripple /> <!-- Ripple color --> <ripple android:color="#ff00ff00"> <item android:drawable="@android:color/white" /> <ripple />