RecyclerView with nested RecyclerView - make nested RecyclerView clickable as a whole view

6.1k views Asked by At

I use a RecyclerView that shows a list of entries. Each entry hosts another RecyclerView that is a list of images.

I now want to make this nested RecyclerView clickable, not the items of it, but the whole view.

How can I achieve that?

Problem:

  • setting the onClickListener for the main view of the nested RecyclerView does work, but only if I click outside the RecyclerView itself
  • clicking on the nested RecyclerView does not hand on the clicks to the parent view (I even tried to set clickable, focusable, focusableIntouch to false, still, the touch is not delegated but consumed by the nested RecyclerView...

Here's the view for the wrapping adapter:

<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="0dp"
    android:layout_margin="5dp"
    android:foreground="?android:attr/selectableItemBackground" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:id="@+id/rlTop"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:text="Datum"
                android:textStyle="bold"
                android:id="@+id/tvDate" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:text="Info"
                android:id="@+id/tvInfo" />
        </RelativeLayout>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/rvData"
            android:clickable="false"
            android:focusableInTouchMode="false"
            android:focusable="false"
            android:layout_below="@+id/rlTop"
            android:layout_width="match_parent"
            android:layout_height="68dp"
            android:scrollbars="horizontal" />

    </RelativeLayout>

</android.support.v7.widget.CardView>
3

There are 3 answers

2
EE66 On

In order to do the entire row clickable and not every image u need to implement a custom onItemClickListener (name comes from listview , sorry). Take a look at this link this worked out perfectly for me.

Edit:

The nested recycler steals your clicks. in order to fix that u will need to create a cusom touch listener and pass it to the nested recycler. Just like the one that u put to the outer ercycler but pass the event to the outer.

Edit 2:

Add a selector with two states just like a button to the entire row, then at the onclick on the inner recycler setSelected(true) the row and postDelay with 50ms for setSelected(false) this will give the "click" effect.

1
David Vávra On

I looked into RecyclerView source and this helped:

recyclerView.setLayoutFrozen(true)
1
Alexey Rogovoy On

This is an old question, but i have the same task and didn't find good solution. I just placed the transparent view over recyclerview and set click listener to this view.

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:cardBackgroundColor="@color/white"
    app:cardCornerRadius="0dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:id="@+id/dataLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingBottom="@dimen/history_margin_v"
            android:paddingEnd="@dimen/history_margin_h"
            android:paddingLeft="@dimen/history_margin_h"
            android:paddingRight="@dimen/history_margin_h"
            android:paddingStart="@dimen/history_margin_h"
            android:paddingTop="@dimen/history_margin_v">

            <TextView
                android:id="@+id/day"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="@dimen/widget_margin_v"
                android:textColor="@color/font_blue"
                android:textSize="@dimen/font_size_large"/>

            <android.support.v7.widget.RecyclerView
                android:id="@+id/images"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>
        </LinearLayout>
        <View
            android:id="@+id/clickView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/selectableItemBackground"
            android:layout_alignLeft="@+id/dataLayout"
            android:layout_alignRight="@+id/dataLayout"
            android:layout_alignStart="@+id/dataLayout"
            android:layout_alignEnd="@+id/dataLayout"
            android:layout_alignTop="@+id/dataLayout"
            android:layout_alignBottom="@+id/dataLayout"/>
    </RelativeLayout>
</android.support.v7.widget.CardView>