对包含 ImageView 的 RecyclerView 项目产生涟漪效应

Question

我有一个 RecyclerView 扩展了以下网格项目：

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="@dimen/children_tile_border"
    android:layout_marginTop="@dimen/children_tile_border"
    android:clickable="true"
    android:focusable="true"
    android:background="?selectableItemBackground"
    tools:ignore="RtlHardcoded">

        <com.example.app.ui.widget.SquareImageView
            android:id="@+id/child_picture"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="visible"
            android:layout_alignParentBottom="true"/>

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="68dp"
            android:background="@color/tile_text_background"
            android:gravity="center_vertical"
            android:layout_alignParentBottom="true">

            ..............
        </LinearLayout>
</RelativeLayout>

但是除非我将 SquareImageView's 可见性设置为不可见，否则涟漪效应不会出现。似乎涟漪效应绘制在 SquareImageView 下方。我怎样才能让它画在 SquareImageView 上？

Answer 1

您的 SquareImageView 填满了整个 space（width 是 match_parent，height 是 wrap_content），因此 SquareImageView收到点击事件。

在我的案例中起作用的是将 RelativeLayout 中所有对象的可点击状态设置为 false：

android:clickable="false"

只需确保您的 RelativeLayout 能够处理 activity 中的点击事件。在我的代码中，我将 RelativeLayout 设置为 view v 并在其上设置 onClick Listener 以处理列表项中的 CheckBox。

v.setOnClickListener(this);

希望这对阅读它的人有所帮助。

Answer 2

将以下代码添加到您的父布局中

android:clickable="true"
android:focusable="true"
android:background="?attr/selectableItemBackground"

如果您想要自定义涟漪效果，请在您的 drawable-v21

中添加此 ripple_custom.xml

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

    <item
        android:id="@android:id/mask"
        android:drawable="@color/windowBackground" />
</ripple>

为了支持旧版本，在 drawable

中添加 ripple_custom.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorHighlight" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</selector>

Answer 3

变化：

android:background="?selectableItemBackground"

收件人：

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

并将其添加到您的 SquareImageView

android:clickable="false"

Answer 4

我们可以将 RecyclerView Item 包裹在 FrameLayout 内，并设置 android:foreground 属性给它。详情请查看 link。它非常适合我。

Answer 5

如果你有一个 CardView + ImageView
只需插入 CardView

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

对于 RelativeLayout + ImageView
在 RelativeLayout

中插入

android:clickable="true"
android:focusable="true"
android:background="?attr/selectableItemBackground"

或者

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

这个代码对我有用

Answer 6

以上回答正确。但我想推荐使用 android:foreground，因为它显示了 imageView 的波纹。

在您的根视图中，添加以下内容。

android:foreground="@drawable/ripple_effect_color_primary"
android:clickable="true"
android:focusable="true"

我知道这是对这样的旧线程的一个相当晚的回答。但谁知道呢，有人可能真的觉得它有用。

对包含 ImageView 的 RecyclerView 项目产生涟漪效应

Ripple effect over a RecyclerView item containing ImageView

android

android-recyclerview

ripple