包含 ImageView 的 RecyclerView 项目上的波纹效果答案

【问题标题】：Ripple effect over a RecyclerView item containing ImageView包含 ImageView 的 RecyclerView 项目上的波纹效果
【发布时间】：2015-04-22 13:38:51
【问题描述】：

我有一个 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上绘制？

【问题讨论】：

标签： android android-recyclerview ripple

【解决方案1】：

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

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>

【讨论】：

不适合我。我有一个具有上述配置的 RelativeLayout 项根：pastebin.com/fy3RcfCm，使用 android 支持库 v23
它是否适用于所有设备。我尝试将 android:background="?android:attr/selectableItemBackground" 设置为 RecyclerView 内的布局，但它不起作用
@Sagar Trehan 在您的父母的孩子中有时会发生点击事件，我认为这就是问题
@Jinu 我有一个 ImageView 以及 ListView 项中的其他视图。当我将上述选择器提供给 ImageView 时，涟漪效果有效，但由于 ImageView 内容覆盖了选择器，所以它没有出现。为了解决这个问题，我将 ImageView 包装在 RelativeLayout 中，并在其中添加了一个视图，以 z 顺序覆盖 ImageView 的宽度和高度。我给这个视图和选择器背景提供了点击事件。应用这些更改涟漪效果正确显示。但我不想引入一个新的视图来做这件事。请建议

【解决方案2】：

变化：

android:background="?selectableItemBackground"

收件人：

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

并将其添加到您的 SquareImageView

android:clickable="false"

【讨论】：

这个确实对我有用。当recyclerview项的核心视图是ImageView时，我认为这是最好的解决方案。

【解决方案3】：

我们可以将 RecyclerView Item 包裹在FrameLayout 中，并为其设置android:foreground 属性。详情请关注link。它对我很有效。

【讨论】：

【解决方案4】：

如果你有 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"

这些代码对我有用

【讨论】：

如果约束布局和图像视图怎么办！

【解决方案5】：

您的 SquareImageView 填满了整个空间（width 是 match_parent 和 height 是 wrap_content），所以 SquareImageView 接收点击事件。

在我的情况下，将RelativeLayout 中所有对象的可点击状态设置为 false：

android:clickable="false"

只要确保您的RelativeLayout 处理您活动中的点击事件即可。在我的代码中，我将RelativeLayout 设置为view v，并在其上设置onClick Listener 以处理我的列表项中的CheckBox。

v.setOnClickListener(this);

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

【讨论】：

【解决方案6】：

以上答案都是正确的。但我想推荐使用 android:foreground 代替，因为它显示了 imageView 前面的波纹。

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

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

我知道对于这样的老话题，这是一个很晚的答案。但谁知道呢，有人可能会觉得它很有用。

【讨论】：