Ripple effect on Android Lollipop CardView

Question

I m trying to get a CardView to display the ripple effect when touched by setting the android backgound attribute in the activity XML file as described here on the Android Developers page  but it isn t working  No animation at all  but the method in onClick is called  I ve also tried creating a ripple xml file as suggested here  but same result  The CardView as it appears in the activity s XML file   lt android support v7 widget CardView     xmlns card view  quot http   schemas android com apk res-auto quot      android layout width  quot 155dp quot      android layout height  quot 230dp quot      android elevation  quot 4dp quot      android translationZ  quot 5dp quot      android clickable  quot true quot      android focusable  quot true quot      android focusableInTouchMode  quot true quot      android onClick  quot showNotices quot      android background  quot  android attr selectableItemBackground quot      android id  quot   id notices card quot      card view cardCornerRadius  quot 2dp quot  gt    lt  android support v7 widget CardView gt    I m relatively new to android development  so I might have made a few obvious mistakes

User · Answer

If there is a root layout like RelativeLayout or LinearLayout which contain all of the adapter item s component in CardView  you have to set background attribute in that root layout  like    lt android support v7 widget CardView xmlns android  http   schemas android com apk res android  xmlns card view  http   schemas android com apk res-auto  xmlns tools  http   schemas android com tools  android layout width  match parent  android layout height  122dp  android layout marginBottom  6dp  android layout marginLeft  6dp  android layout marginRight  6dp  card view cardCornerRadius  4dp  gt    lt RelativeLayout     android layout width  match parent      android layout height  match parent      android background   drawable touch bg   gt   lt  android support v7 widget CardView gt

User · Answer

If the app minSdkVersion which you are working is level 9  you can use  android foreground  quot  selectableItemBackground quot  android clickable  quot true quot   Instead  starting from level 11  you use  android foreground  quot  android attr selectableItemBackground quot  android clickable  quot true quot   From documentation   clickable - Defines whether this view reacts to click events  Must be a boolean value  either  quot true quot  or  quot false quot   foreground - Defines the drawable to draw over the content  This can be used as an overlay  The foreground drawable participates in the padding of the content if the gravity is set to fill

User · Answer

Ripple event for android Cardview control    lt android support v7 widget CardView     android layout width  match parent      android layout height  wrap content      android layout gravity  center      android foreground   android attr selectableItemBackground      android clickable  true      android layout marginBottom  4dp      android layout marginTop  4dp    gt

User · Answer

For me  adding the foreground to CardView didn t work  reason unknown      Adding the same to it s child layout did the trick   CODE    lt android support v7 widget CardView xmlns android  http   schemas android com apk res android      xmlns card view  http   schemas android com apk res-auto      android id    id card view      android layout width  match parent      android layout height  wrap content      android layout gravity  center      android focusable  true      android clickable  true      card view cardCornerRadius   dimen card corner radius      card view cardUseCompatPadding  true  gt        lt LinearLayout         android id    id card item          android layout width  match parent          android layout height  wrap content          android foreground   android attr selectableItemBackground          android padding   dimen card padding  gt        lt  LinearLayout gt   lt  android support v7 widget CardView gt

User · Answer

Add these two line code into your xml view to give ripple effect on your cardView       android clickable  true  android foreground   android attr selectableItemBackground

User · Answer

You should add following to CardView   android foreground   android attr selectableItemBackground  android clickable  true

User · Answer

android foreground   android attr selectableItemBackgroundBorderless     android clickable  true     android focusable  true    Only working api 21 and use this not use this list row card view

User · Answer

For those searching for a solution to the issue of the ripple effect not working on a programmatically created CardView  or in my case custom view which extends CardView  being shown in a RecyclerView  the following worked for me  Basically declaring the XML attributes mentioned in the other answers declaratively in the XML layout file doesn t seem to work for a programmatically created CardView  or one created from a custom layout  even if root view is CardView or merge element is used   so they have to be set programmatically like so   private class MadeUpCardViewHolder extends RecyclerView ViewHolder       private MadeUpCardView cardView       public MadeUpCardViewHolder View v           super v            this cardView    MadeUpCardView v              Declaring in XML Layout doesn t seem to work in RecyclerViews         if  Build VERSION SDK INT  gt   Build VERSION CODES M                int   attrs   new int   R attr selectableItemBackground               TypedArray typedArray   context obtainStyledAttributes attrs               int selectableItemBackground   typedArray getResourceId 0  0               typedArray recycle                 this cardView setForeground context getDrawable selectableItemBackground                this cardView setClickable true                       Where MadeupCardView extends CardView Kudos to this answer for the TypedArray part

User · Answer

Add these two like of code work like a charm for any view like Button  Linear Layout  or CardView Just put these two lines and see the magic     android foreground   android attr selectableItemBackground  android clickable  true

User · Answer

The ripple effect was omitted in the appcompat support library which is what you re using  If you want to see the ripple use the Android L version and test it on an Android L device  Per the AppCompat v7 site    Why are there no ripples on pre-Lollipop  A lot of what allows RippleDrawable to run smoothly is Android 5 0   s new RenderThread  To optimize for performance on previous versions of Android  we ve left RippleDrawable out for now    Check out this link here for more info

User · Answer

I managed to get the ripple effect on the cardview by     lt android support v7 widget CardView      xmlns card view  http   schemas android com apk res-auto       android clickable  true       android foreground   drawable custom bg   gt    and for the custom bg that you can see in above code  you have to define a xml file for both lollipop in drawable-v21 package  and pre-lollipop in drawable package  devices  for custom bg in drawable-v21 package the code is    lt ripple      xmlns android  http   schemas android com apk res android      android color   android attr colorControlHighlight  gt   lt item     android id   android id mask      android drawable   android color white   gt   lt  ripple gt    for custom bg in the drawable package  code is    lt  xml version  1 0  encoding  utf-8   gt   lt selector xmlns android  http   schemas android com apk res android  gt    lt item android state pressed  true  gt       lt shape gt           lt solid android color   color colorHighlight  gt  lt  solid gt       lt  shape gt   lt  item gt   lt item gt       lt shape gt           lt solid android color   color navigation drawer background  gt  lt  solid gt       lt  shape gt   lt  item gt   lt  selector gt    so on pre-lollipop devices you will have a solid click effect and on lollipop devices you will have a ripple effect on the cardview

User · Answer

Use Material Cardview instead  it extends Cardview and provides multiple new features including default clickable effect    lt com google android material card MaterialCardView gt         lt  com google android material card MaterialCardView gt   Dependency  It can be used up to API 14 to support older device   implementation  com google android material material 1 0 0

User · Answer

I wasn t happy with AppCompat  so I wrote my own CardView and backported ripples  Here it s running on Galaxy S with Gingerbread  so it s definitely possible     For more details check the source code

User · Answer

Add the following to your xml   android clickable  true  android focusable  true  android background   android attr selectableItemBackground    And add to your adapter  if it s your case       override fun onBindViewHolder holder  MyViewHolder  position  Int            if  Build VERSION SDK INT  gt   Build VERSION CODES M                val attrs   intArrayOf R attr selectableItemBackground              val typedArray   holder itemView context obtainStyledAttributes attrs              val selectableItemBackground   typedArray getResourceId 0  0              typedArray recycle                holder itemView isClickable   true             holder itemView isFocusable   true             holder itemView foreground   holder itemView context getDrawable selectableItemBackground

[android] Ripple effect on Android Lollipop CardView

Examples related to android

Examples related to android-layout

Examples related to android-5.0-lollipop

Examples related to android-cardview