Jim Clermonts
Jim Clermonts

Reputation: 2660

Ripple effect is not visible on the complete row

I have a RecyclerView with a row that has a checkmark and a drag & drop (rearrange) icon to the right. Just like in the official material design video, I want the ripple effect to be over the whole row. But when I span the ImageView, the CheckBox is not clickable anymore. Is this even possible?

   <FrameLayout
        android:id="@+id/layout"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:orientation="horizontal"
        android:background="@android:color/white"
        android:paddingLeft="@dimen/small_margin"
        android:paddingRight="@dimen/small_margin">

        <CheckBox
            android:id="@+id/checkbox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="start|center_vertical"
            android:checked="@{safeUnbox(viewModel.isEnabled), default=false}"
            android:padding="@dimen/small_margin"
            android:text="@={viewModel.abbreviation}"
            android:textAppearance="@style/TextAppearance.Compat.Notification.Title"
            tools:text="Bijbelvertaling" />

        <Space
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

        <ImageView
            android:id="@+id/dragger"
            android:layout_width="40dp"
            android:background="?android:attr/selectableItemBackground"
            android:layout_height="match_parent"
            android:layout_gravity="center_vertical|end"
            android:scaleType="center"
            android:src="@drawable/ic_drag_handle_24px"
            android:contentDescription="Drag and drop icon" />
    </FrameLayout>

enter image description here

Upvotes: 1

Views: 548

Answers (1)

Md. Asaduzzaman
Md. Asaduzzaman

Reputation: 15433

Instead of FrameLayout use RelativeLayout like below and apply ripple effect android:foreground="?android:attr/selectableItemBackground" to root layout.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layout"
    android:clickable="true"
    android:layout_width="match_parent"
    android:layout_height="64dp"
    android:orientation="horizontal"
    android:foreground="?android:attr/selectableItemBackground"
    android:background="@android:color/white"
    android:paddingLeft="@dimen/small_margin"
    android:paddingRight="@dimen/small_margin">

    <CheckBox
        android:id="@+id/checkbox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:checked="@{safeUnbox(viewModel.isEnabled), default=false}"
        android:padding="@dimen/small_margin"
        android:text="@={viewModel.abbreviation}"
        android:textAppearance="@style/TextAppearance.Compat.Notification.Title"
        tools:text="Bijbelvertaling" />

    <ImageView
        android:id="@+id/dragger"
        android:layout_width="40dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:scaleType="center"
        android:src="@drawable/ic_drag_handle_24px"
        android:contentDescription="Drag and drop icon" />

</RelativeLayout>

Output: enter image description here

Upvotes: 2

Related Questions