How to get touch feedback from RecyclerView?

Question

I implemented a RecyclerView and I can't figure out how to get touch feedback (the ripple effect from it).

Here is what i did for the onClickListener:

holder.itemView.setOnClickListener(new OnClickListener(){

        @Override
        public void onClick(View v) {
            //start Intent
        }

    });

And I added both clickable and focusable to my XML. This is what the recycler view inflates:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:padding="4dp" >

Tarmac

That's RelativeLayout not RecyclerView in the code you provided. https://mcmap.net/q/49778/-recyclerview-onclick – Rundlet

That's the item that recycler view inflates. I looked at that link but i can't find what causes the touch feedback. The clicking works fine, its just the touch feedback – Tarmac

Ah, then you have to set a rippledrawable as the background of the relativelayout – Rundlet

How do you do that is i guess what I was asking. Also would it work for Gingerbread devices and up? – Tarmac

Answer 1

You have to set a ripple drawable as the background:

android:background="@drawable/ripple"

ripple.xml:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#ffa0a0a0"/>

You may need to mask the drawable:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#ffa0a0a0">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#ffa0a0a0"/>
        </shape>
    </item>
</ripple>

This will create a simple grey ripple upon touch (here's a guide if you need more instructions).

RippleDrawable was added in SDK version 21 (Lollipop). Using Ripple drawable on pre-lollipop will crash the app. Either use a simple selector on pre-lollipop devices or use libraries that recreate the effect. (GitHub)

UPDATE: You can get the ripple effect easily with this piece of code:

android:background="?attr/selectableItemBackground"

or if you don't want the rectangle mask:

android:background="?attr/selectableItemBackgroundBorderless"

This is compatible with pre-lollipop devices and will us a simple selector. I believe this will create light ripples in apps with dark theme and vice versa, so if you want a custom colored ripple you will still need to create a ripple drawable.

Rundlet

For other people seeing this, this link might help you as well: gist.github.com/AnderWeb/9672f5d81017429fd5fd – Tarmac

The android:background="?attr/selectableItemBackground" works perfectly. It's exactly the simple touch feedback I wanted to show in my RecyclerView. – Epigram

depending your configuration you might have to add the keyword "android" : ?android:attr/selectableItemBackground – Rebus

Answer 2

In addition to @Longi's answer: If you want your RecyclerViews's Item to have its own background, and at the same time to have the ripple effect, you can do as shown in the example below: recycler_view_item.xml:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/recyclerview_item_background">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="?attr/selectableItemBackgroundBorderless">
       ...
    </LinearLayout>
</LinearLayout>

In this example @drawable/recyclerview_item_background is a nine-patch png, but you can use any background here.

In my case when I used android:background="?attr/selectableItemBackground", the RecyclerView Item's root Linear Layout did have the ripple effect, but the child Linear Layout's background was overlapping thus hiding the ripple effect.

Josefjosefa