将Ripple效果添加到RecyclerView项目

Question

我正在尝试将Ripple Effect添加到RecyclerView的项目中.我在网上看了一下,但找不到我需要的东西.我认为它必须是自定义效果.我已经尝试了android:background属性到RecyclerView本身并将其设置为"？android:selectableItemBackground"但它没有工作:

    <android.support.v7.widget.RecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:focusable="true"
    android:clickable="true"
    android:background="?android:selectableItemBackground"
    android:id="@+id/recyclerView"
    android:layout_below="@+id/tool_bar"/>

这是我试图将效果添加到的RecyclerView:

Answer 1

我想通了.我唯一要做的就是添加这个属性:

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

到我的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:paddingTop="8dp"
                android:paddingBottom="8dp"
                android:background="?android:attr/selectableItemBackground"
                tools:background="@drawable/bg_gradient">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="17sp"
        android:layout_marginLeft="15dp"
        android:layout_marginStart="15dp"
        android:id="@+id/shoppingListItem"
        android:hint="@string/enter_item_hint"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"/>

    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/shopping_list_item_checkbox_label"
        android:id="@+id/shoppingListCheckBox"
        android:layout_centerVertical="true"
        android:layout_marginRight="15dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:checked="false"/>
</RelativeLayout>

结果:

Answer 2

正如已经回答的那样,最简单的解决方案是添加以下其中一项作为RecyclerView行的背景:

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

但是,如果您遇到此方法的问题,或者您希望更好地控制颜色,则可以执行以下操作.

自定义波纹效果

这个答案从这个简单的Android RecyclerView示例开始.它将如下图所示.

为API 21之前的设备添加选择器

在API 21(Android 5.0 Lollipop)之前,单击一个RecyclerView项目只是改变了它的背景颜色(没有涟漪效应).这也是我们要做的事情.如果你仍然有这些设备的用户,他们习惯了这种行为,所以我们不会太担心它们.(当然,如果你真的想要它们的涟漪效果,你也可以使用自定义库.)

右键点击你的res/drawable文件夹并选择新建>可绘制资源文件.叫它custom_ripple.单击"确定"并粘贴以下代码.

custom_ripple.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/colorAccent" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</selector>

我用作colorAccent按下状态的高亮颜色,因为它已经可用,但您可以定义您想要的任何颜色.

为API 21+设备添加Ripple效果

右键点击你的res/drawable文件夹并选择新建>可绘制资源文件.再打custom_ripple一次.不要单击"确定",但这一次.从可用预选赛列表中选择版本,然后点击>>按钮,并写21了平台的API级别.现在单击"确定"并粘贴以下代码.

V21/custom_ripple.xml

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

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

同样,我使用colorAccent了波纹颜色,因为它可用,但你可以使用你想要的任何颜色.掩码将涟漪效果限制在行布局中.面膜颜色显然没关系所以我只使用了不透明的白色.

设置为背景

在RecyclerView项目的根布局中,将背景设置为我们创建的自定义波纹.

android:background="@drawable/custom_ripple"

在我们开始的示例项目中,它看起来像这样:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="@drawable/custom_ripple"
    android:padding="10dp">

    <TextView
        android:id="@+id/tvAnimalName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"/>

</LinearLayout>

成品

而已.您应该能够立即运行您的项目.感谢这个答案和YouTube视频的帮助.

Answer 3

我认为错过了一个小细节.

如果在添加android:background="?android:attr/selectableItemBackground"尝试在布局的根目录中添加以下行后仍然没有获得涟漪效果.

android:clickable="true"
android:focusable="true"

这些将确保视图是可点击的,并将使用上面提到的背景属性启用涟漪效果

Answer 4

在您的适配器 xml 根视图中添加此行

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

Answer 5

使用按钮样式

这对我来说已经无数次了。

将无边框按钮样式添加到布局的根元素。不需要focusable或clickable属性，默认样式为您封装了所有这些。

<androidx.constraintlayout.widget.ConstraintLayout
    style="@android:style/Widget.Material.Button.Borderless"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">