CJR
CJR

Reputation: 3572

Ripple effect not present in Recyclerview?

I can't get my recycler view items to have the "Ripple effect" when clicked, like this:

enter image description here

I found a lot of similar questions on Stackoverflow, but I did not find anything that helped.

Here is my whole layout:

<androidx.constraintlayout.widget.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/start_root_view"
    android:clickable="true"
    android:focusable="true"
    android:foreground="?android:attr/selectableItemBackground">

    <androidx.cardview.widget.CardView
        android:id="@+id/topContainer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        app:cardBackgroundColor="@color/colorAccent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:cardCornerRadius="24dp">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <androidx.cardview.widget.CardView
                android:id="@+id/image_card"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:layout_marginBottom="8dp"
                app:cardCornerRadius="32dp"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toBottomOf="parent">

                <ImageView
                    android:id="@+id/user_image"
                    android:layout_width="64dp"
                    android:layout_height="64dp" />

            </androidx.cardview.widget.CardView>

            <TextView
                android:id="@+id/welcome_message"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:text="Welcome back!"
                android:textSize="24sp"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintStart_toEndOf="@id/image_card"
                app:layout_constraintBottom_toTopOf="@id/username_display"/>

            <TextView
                android:id="@+id/username_display"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginBottom="8dp"
                android:text="username"
                android:textSize="16sp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toEndOf="@id/image_card"
                app:layout_constraintTop_toBottomOf="@id/welcome_message"/>

        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.cardview.widget.CardView>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerview_questions"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/topContainer"
        android:scrollbars="vertical"
        android:scrollbarStyle="outsideInset" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/button_add_question"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="24dp"
        android:layout_marginBottom="24dp"
        android:clickable="true"
        app:backgroundTint="@color/colorAccentDark"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:srcCompat="@drawable/plus" />

</androidx.constraintlayout.widget.ConstraintLayout>

I should also state that I have added both a ItemTouchHelper and RecyclerView.ItemDecoration to my Recyclerview from my Activity code.

I don't understand why the effect is not working. Any suggestions?

Upvotes: 1

Views: 1931

Answers (2)

CommonsWare
CommonsWare

Reputation: 1006604

Try replacing:

android:foreground="?android:attr/selectableItemBackground"

with:

android:background="?android:attr/selectableItemBackground"

And that attribute needs to be on the element that is supposed to ripple. Right now, you have the android:foreground on the ConstraintLayout that appears to be the entire fragment or activity. If you want rows (or cells or whatever) in a RecyclerView to ripple, you need android:background="?android:attr/selectableItemBackground" on the layouts for those rows/cells/whatever.

For example, see this resource in this sample module from this book.

Upvotes: 1

Nezih Yılmaz
Nezih Yılmaz

Reputation: 666

If you want your recyclerview rows to have ripple effect, you should use selectableItemBackground attribute in your recyclerviews row layout file.

The attribute should be set to whichever view is consuming the click event.

Upvotes: 2

Related Questions